🧰 [Project] Maintenence

.changeset/tall-monkeys-sip.md

@@ -0,0 +1,6 @@
+---
+"website": patch
+"earwurm": patch
+---
+
+Update project dependencies.

.github/labeler.yml

@@ -24,18 +24,12 @@
           - '.github/**'
           - '.vscode/**'
           - .editorconfig
-          - .eslintignore
-          - .eslintrc
-          - .eslintrc.cjs
-          - .gitignore
-          - .npmignore
-          - .nvmrc
-          - .prettierignore
-          - .prettierrc
+          - '.env*'
+          - '.*ignore'
+          - '.*rc'
           - 'config/**'
-          - package.json
-          - tsconfig.json
-          - 'tsconfig.*.json'
-          - vite.config.ts
+          - '*.config.*'
+          - 'package*.json'
+          - 'tsconfig*.json'
           - '**/*/env.d.ts'
           - '**/*/lightningcss-plugins.ts'

.github/workflows/deploy.yml

@@ -34,7 +34,7 @@ jobs:
       - name: 🧰 Configure PNPM
         uses: pnpm/action-setup@v4
 
-      - name: 🔧 Setup Node 20.x
+      - name: 🔧 Setup Node 22.x
         uses: actions/setup-node@v4
         with:
           node-version-file: .nvmrc
@@ -47,7 +47,7 @@ jobs:
         run: pnpm build
 
       - name: 📄 Configure Pages
-        uses: actions/configure-pages@v4
+        uses: actions/configure-pages@v5
 
       - name: 📈 Upload artifact
         uses: actions/upload-pages-artifact@v3

.github/workflows/lint.yml

@@ -13,7 +13,7 @@ jobs:
       - name: 🧰 Configure PNPM
         uses: pnpm/action-setup@v4
 
-      - name: 🔧 Setup Node 20.x
+      - name: 🔧 Setup Node 22.x
         uses: actions/setup-node@v4
         with:
           node-version-file: .nvmrc

.github/workflows/release.yml

@@ -18,7 +18,7 @@ jobs:
       - name: 🧰 Configure PNPM
         uses: pnpm/action-setup@v4
 
-      - name: 🔧 Setup Node 20.x
+      - name: 🔧 Setup Node 22.x
         uses: actions/setup-node@v4
         with:
           node-version-file: .nvmrc

.github/workflows/test.yml

@@ -13,7 +13,7 @@ jobs:
       - name: 🧰 Configure PNPM
         uses: pnpm/action-setup@v4
 
-      - name: 🔧 Setup Node 20.x
+      - name: 🔧 Setup Node 22.x
         uses: actions/setup-node@v4
         with:
           node-version-file: .nvmrc

.nvmrc

@@ -1 +1 @@
-20.16
+22.11

.vscode/extensions.json

@@ -9,6 +9,7 @@
     "DavidAnson.vscode-markdownlint",
     "dbaeumer.vscode-eslint",
     "esbenp.prettier-vscode",
+    "yoavbls.pretty-ts-errors",
     "vue.volar",
     "csstools.postcss"
   ],

.vscode/settings.json

@@ -67,7 +67,9 @@
     "gql",
     "graphql",
     "astro",
+    "svelte",
     "css",
+    "less",
     "scss",
     "pcss",
     "postcss"

app/website/README.md

@@ -1,63 +1,3 @@
 # Earwurm app
 
 This repo hosts the website for the `earwurm` project.
-
-## TsConfig
-
-Originally, we isolated the `app` vs `node` configs. This had to be changed however because of the following bug: <https://github.com/antfu/eslint-config/issues/564>
-
-As a result, the following packages were removed:
-
-```json
-{
-  "@tsconfig/node20": "^20.1.4",
-  "@vue/tsconfig": "^0.5.1"
-}
-```
-
-### Record keeping
-
-In case we ever restore the original `tsconfig`:
-
-#### tsconfig.app.json
-
-```json
-{
-  "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "compilerOptions": {
-    "composite": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"]
-}
-```
-
-#### tsconfig.node.json
-
-```json
-{
-  "extends": "@tsconfig/node20/tsconfig.json",
-  "compilerOptions": {
-    "composite": true,
-    "module": "esnext",
-    "moduleResolution": "bundler",
-    "types": ["node"]
-  },
-  "include": ["lightningcss-plugins.ts", "vite.config.ts"]
-}
-```
-
-#### tsconfig.json
-
-```json
-{
-  "references": [
-    { "path": "./tsconfig.node.json" },
-    { "path": "./tsconfig.app.json" }
-  ],
-  "files": []
-}
-```

app/website/eslint.config.mjs

@@ -4,8 +4,8 @@ import antfu from '@antfu/eslint-config';
 export default antfu(
   // Websites config
   {
+    name: 'website',
     type: 'app',
-    // ignores: [],
     formatters: {
       // Formats .css and .scss files, but also the `<style>` blocks in Vue.
       css: true,
@@ -33,27 +33,28 @@ export default antfu(
       },
     },
   },
+
   // General config
   {
     // Without a `files` scope, these rules will apply to everything.
+    name: 'Websites general',
     rules: {
-      'antfu/if-newline': 'off',
+      // General
       'no-console': 'warn',
+
+      // Antfu
+      'antfu/if-newline': 'off',
       'style/arrow-parens': ['error', 'always'],
       'style/object-curly-spacing': ['error', 'never'],
       'test/prefer-lowercase-title': 'off',
       'ts/explicit-function-return-type': 'off',
       'ts/strict-boolean-expressions': 'off',
-      // Would like this if I could differentiate between ternary and if conditions.
-      // 'style/operator-linebreak': ['error', 'after'],
 
-      // TODO: Try and solve broken if/else statements.
-      /*
-      'style/padding-line-between-statements': [
-        'error',
-        {blankLine: 'never', prev: 'if', next: 'block-like'},
-      ],
-      */
+      // I like sorted imports/exports... but the Antfu config doesn't
+      // quite order things the way I'd like, so I'm disabling it for now.
+      'perfectionist/sort-exports': 'off',
+      'perfectionist/sort-named-exports': 'off',
+      'perfectionist/sort-imports': 'off',
     },
   },
 );

app/website/package.json

@@ -12,8 +12,8 @@
     "earwurm"
   ],
   "engines": {
-    "node": ">=20.16.0",
-    "pnpm": ">=9.7.1"
+    "node": ">=22.11.0",
+    "pnpm": ">=9.15.0"
   },
   "scripts": {
     "clean": "rm -rf dist && rm -rf *.tsbuildinfo",
@@ -26,18 +26,20 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.json --composite false"
   },
   "dependencies": {
-    "beeftools": "^0.1.7",
+    "beeftools": "^0.1.8",
     "earwurm": "workspace:*",
-    "vue": "^3.4.38"
+    "vue": "^3.5.13"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^2.26.0",
+    "@antfu/eslint-config": "^3.11.2",
     "@earwurm/types": "workspace:*",
-    "@vitejs/plugin-vue": "^5.1.2",
-    "eslint": "^9.9.0",
-    "eslint-plugin-format": "^0.1.2",
-    "lightningcss": "^1.26.0",
+    "@tsconfig/node22": "^22.0.0",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "@vue/tsconfig": "^0.7.0",
+    "eslint": "^9.16.0",
+    "eslint-plugin-format": "^0.1.3",
+    "lightningcss": "^1.28.2",
     "vite-plugin-svg-sprite": "^0.5.2",
-    "vue-tsc": "^2.0.29"
+    "vue-tsc": "^2.1.10"
   }
 }

app/website/tsconfig.app.json

@@ -0,0 +1,11 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.dom.json",
+  "compilerOptions": {
+    "composite": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"]
+}

app/website/tsconfig.json

@@ -1,31 +1,7 @@
 {
-  "compilerOptions": {
-    // "types": ["node"],
-    "composite": true,
-    "target": "esnext",
-    "jsx": "preserve",
-    "jsxImportSource": "vue",
-    "lib": [
-      "es2020",
-      "dom",
-      "dom.iterable"
-    ],
-    "useDefineForClassFields": true,
-    "baseUrl": ".",
-    "module": "esnext",
-    "moduleResolution": "bundler",
-    "paths": {
-      "@/*": ["./src/*"]
-    },
-    "resolveJsonModule": true,
-    "types": [],
-    "strict": true,
-    "noImplicitThis": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "verbatimModuleSyntax": true,
-    "skipLibCheck": true
-  },
-  "include": ["env.d.ts", "lightningcss-plugins.ts", "vite.config.ts", "src/**/*", "src/**/*.vue"]
+  "references": [
+    { "path": "./tsconfig.node.json" },
+    { "path": "./tsconfig.app.json" }
+  ],
+  "files": []
 }

app/website/tsconfig.node.json

@@ -0,0 +1,10 @@
+{
+  "extends": "@tsconfig/node22/tsconfig.json",
+  "compilerOptions": {
+    "composite": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "types": ["node"]
+  },
+  "include": ["lightningcss-plugins.ts", "vite.config.ts"]
+}

app/website/vite.config.ts

@@ -1,7 +1,7 @@
-import {URL, fileURLToPath} from 'node:url';
+import {fileURLToPath, URL} from 'node:url';
 
-import {defineConfig} from 'vite';
 import vue from '@vitejs/plugin-vue';
+import {defineConfig} from 'vite';
 import createSvgSpritePlugin from 'vite-plugin-svg-sprite';
 
 import {mixinAtRules, mixinVisitor} from './lightningcss-plugins';
@@ -19,11 +19,8 @@ export default defineConfig({
         customMedia: true,
       },
       // targets: browserslistToTargets(browserslist('>= 0.25%')),
-
-      // @ts-expect-error: No overloads
       customAtRules: mixinAtRules,
       visitor: mixinVisitor,
-
       // It would be ideal if we could tree-shake unused utility classes.
       // Lightning CSS is not able to determine this by itself.
       // unusedSymbols: ['foo', '--bar']

eslint.config.mjs

@@ -5,10 +5,10 @@ import antfu from '@antfu/eslint-config';
 // 2. https://github.com/antfu/eslint-plugin-antfu
 // 3. https://github.com/antfu/eslint-plugin-format
 export default antfu(
-  // Library config
+  // Packages config
   {
+    name: 'Packages',
     type: 'lib',
-    // Antfu respects `gitignore`, so we don't need to repeat those directories.
     ignores: ['app/**'],
     formatters: {
       markdown: true,
@@ -21,17 +21,31 @@ export default antfu(
     },
     vue: false,
   },
+
+  // TODO: Is there not a way to have a separate entry for `/websites`?
+
   // General config
   {
     // Without a `files` scope, these rules will apply to everything.
+    name: 'Packages general',
     rules: {
-      'antfu/if-newline': 'off',
+      // General
       'no-console': 'warn',
+
+      // Antfu
+      'antfu/if-newline': 'off',
       'style/arrow-parens': ['error', 'always'],
       'style/object-curly-spacing': ['error', 'never'],
       'test/prefer-lowercase-title': 'off',
       'ts/explicit-function-return-type': 'off',
       'ts/strict-boolean-expressions': 'off',
+
+      // I like sorted imports/exports... but the Antfu config doesn't
+      // quite order things the way I'd like, so I'm disabling it for now.
+      'perfectionist/sort-exports': 'off',
+      'perfectionist/sort-named-exports': 'off',
+      'perfectionist/sort-imports': 'off',
+
       // Would like this if I could differentiate between ternary and if conditions.
       // 'style/operator-linebreak': ['error', 'after'],