diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100755 index 00000000..5e4a6152 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,8 @@ +{ + "recommendations": [ + "Vue.volar", + "dbaeumer.vscode-eslint", + "esbenp.prettier-vscode", + "antfu.unocss" + ] +} diff --git a/.vscode/settings.json b/.vscode/settings.json index 992477fb..0486c068 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,4 +1,51 @@ { + // As per https://github.com/antfu/eslint-config#vs-code-support-auto-fix-on-save + "prettier.enable": false, + "editor.formatOnSave": false, + + // Auto fix + "editor.codeActionsOnSave": { + "source.fixAll.eslint": "explicit", + "source.organizeImports": "never" + }, + + // Silent the stylistic rules in you IDE, but still auto fix them + "eslint.rules.customizations": [ + { "rule": "style/*", "severity": "off", "fixable": true }, + { "rule": "format/*", "severity": "off", "fixable": true }, + { "rule": "*-indent", "severity": "off", "fixable": true }, + { "rule": "*-spacing", "severity": "off", "fixable": true }, + { "rule": "*-spaces", "severity": "off", "fixable": true }, + { "rule": "*-order", "severity": "off", "fixable": true }, + { "rule": "*-dangle", "severity": "off", "fixable": true }, + { "rule": "*-newline", "severity": "off", "fixable": true }, + { "rule": "*quotes", "severity": "off", "fixable": true }, + { "rule": "*semi", "severity": "off", "fixable": true } + ], + + // Enable eslint for all supported languages + "eslint.validate": [ + "javascript", + "javascriptreact", + "typescript", + "typescriptreact", + "vue", + "html", + "markdown", + "json", + "jsonc", + "yaml", + "toml", + "xml", + "gql", + "graphql", + "astro", + "css", + "less", + "scss", + "pcss", + "postcss" + ], "typescript.tsdk": "node_modules/typescript/lib", "files.exclude": { "**/dist": true @@ -9,4 +56,4 @@ "search.exclude": { "**/dist": true } -} \ No newline at end of file +} diff --git a/docs/cypress/e2e/dark-mode.cypress.cy.js b/docs/cypress/e2e/dark-mode.cypress.cy.js index 093d2e21..08d34dff 100644 --- a/docs/cypress/e2e/dark-mode.cypress.cy.js +++ b/docs/cypress/e2e/dark-mode.cypress.cy.js @@ -6,12 +6,12 @@ describe('Dark Mode', () => { } const assertTheme = (theme) => - cy.get('html').then(html => + cy.get('html').then((html) => expect(html.hasClass('dark')).to.equal(theme === 'dark')) it('can toggle on and off', () => { visitHome() - cy.get('html').then(html => { + cy.get('html').then((html) => { if (html.hasClass('dark')) toggleTheme() assertTheme('light') }) diff --git a/docs/cypress/e2e/docsearch.cypress.cy.js b/docs/cypress/e2e/docsearch.cypress.cy.js index 2c44c657..e25d8687 100644 --- a/docs/cypress/e2e/docsearch.cypress.cy.js +++ b/docs/cypress/e2e/docsearch.cypress.cy.js @@ -15,7 +15,7 @@ describe('DocSearch', () => { const searchModal = () => cy.get('.DocSearch-Modal') - const closeSearchModal = () =>{ + const closeSearchModal = () => { cy.get('body').type('{esc}') searchModal().should('not.exist') } diff --git a/docs/iles.config.ts b/docs/iles.config.ts index bd74cbb6..afc2e722 100644 --- a/docs/iles.config.ts +++ b/docs/iles.config.ts @@ -6,7 +6,7 @@ import icons from '@islands/icons' import prism from '@islands/prism' import pwa from '@islands/pwa' -import windicss from 'vite-plugin-windicss' +import UnoCSS from 'unocss/vite' import inspect from 'vite-plugin-inspect' import lastUpdated from './modules/lastUpdated' import site from './src/site' @@ -104,7 +104,7 @@ export default defineConfig({ }, }, plugins: [ - windicss(), + UnoCSS(), Boolean(process.env.DEBUG) && inspect(), ], }, diff --git a/docs/package.json b/docs/package.json index 5c4a086c..ee48f3af 100644 --- a/docs/package.json +++ b/docs/package.json @@ -8,7 +8,8 @@ "build": "iles build", "preview": "iles preview --open --port 3050", "now": "npm run build && npm run preview", - "lint": "eslint . --ext .ts,.js,.vue,.html", + "lint": "eslint .", + "lint:fix": "eslint . --fix", "check": "vue-tsc --noEmit", "cy:run": "scripts/test-cypress" }, @@ -16,39 +17,28 @@ "node": "^14.18 || >= 16.0.0" }, "devDependencies": { - "@iconify-json/bx": "^1.0.3", - "@iconify-json/heroicons-outline": "^1.0.2", + "@iconify-json/bx": "^1.1.10", + "@iconify-json/heroicons-outline": "^1.1.10", "@islands/headings": "workspace:*", "@islands/icons": "workspace:*", "@islands/prism": "workspace:*", "@islands/pwa": "workspace:*", - "@preact/preset-vite": "^2.5.0", - "@types/cross-spawn": "^6.0.2", - "@vueuse/core": "^6.9.2", - "autoprefixer": "^10.4.0", + "@preact/preset-vite": "^2.9.0", + "@types/cross-spawn": "^6.0.6", + "@vueuse/core": "^10.11.0", + "autoprefixer": "^10.4.19", "cross-spawn": "^7.0.3", "iles": "workspace:*", - "postcss-nesting": "^8.0.1", - "preact": "^10.18.1", - "preact-render-to-string": "^6.2.2", + "postcss-nesting": "^12.1.5", + "preact": "^10.23.1", + "preact-render-to-string": "^6.5.7", "rehype-external-links": "^3.0.0", - "vite-plugin-inspect": "^0.7.40", - "vite-plugin-windicss": "^1.9.0", - "vue-tsc": "^1.8.18" + "unocss": "^0.61.8", + "vite-plugin-inspect": "^0.8.5", + "vue-tsc": "^2.0.29" }, "dependencies": { - "@docsearch/css": "^3.1.1", - "@mussi/docsearch": "^3.1.2-beta.0" - }, - "eslintConfig": { - "rules": { - "react/react-in-jsx-scope": "off" - }, - "globals": { - "$ref": "readonly", - "$computed": "readonly", - "$$": "readonly", - "$": "readonly" - } + "@docsearch/css": "^3.6.1", + "@mussi/docsearch": "3.1.2-beta.0" } } diff --git a/docs/src/app.ts b/docs/src/app.ts index 407e35a1..08943f18 100644 --- a/docs/src/app.ts +++ b/docs/src/app.ts @@ -1,5 +1,5 @@ -import 'virtual:windi.css' -import 'virtual:windi-devtools' +import 'virtual:uno.css' +import '@unocss/reset/tailwind-compat.css' import '~/styles/all.css' import { defineApp } from 'iles' diff --git a/docs/src/components/AppButton.vue b/docs/src/components/AppButton.vue index 48642407..463d89ce 100644 --- a/docs/src/components/AppButton.vue +++ b/docs/src/components/AppButton.vue @@ -26,7 +26,7 @@ defineProps({ .outline { background: theme('colors.gray.100'); color: theme('colors.gray.500'); - + outline-style: none; &:hover { background: theme('colors.gray.200'); } @@ -43,11 +43,11 @@ html.dark { } .outline { - background: theme('colors.warm-gray.800'); + background: theme('colors.warmgray.800'); color: theme('colors.gray.200'); &:hover { - background: theme('colors.warm-gray.600'); + background: theme('colors.warmgray.600'); } } } diff --git a/docs/src/components/EditLink.vue b/docs/src/components/EditLink.vue index 56bcb7e8..2ca3caf2 100644 --- a/docs/src/components/EditLink.vue +++ b/docs/src/components/EditLink.vue @@ -1,7 +1,9 @@