chore(example): update example build

.github/workflows/deploy.yml

@@ -15,7 +15,7 @@ jobs:
       - name: Use Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 22
 
       # pull code
       - name: Checkout code

example/.editorconfig

@@ -0,0 +1,6 @@
+[*.{js,jsx,mjs,cjs,ts,tsx,mts,cts,vue}]
+charset = utf-8
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true

example/.prettierrc.json

@@ -1,5 +1,7 @@
+
 {
+  "$schema": "https://json.schemastore.org/prettierrc",
   "semi": false,
   "singleQuote": true,
-  "endOfLine": "auto"
+  "printWidth": 100
 }

example/eslint.config.js

@@ -0,0 +1,25 @@
+import pluginVue from 'eslint-plugin-vue'
+import vueTsEslintConfig from '@vue/eslint-config-typescript'
+import pluginVitest from '@vitest/eslint-plugin'
+import skipFormatting from '@vue/eslint-config-prettier'
+
+export default [
+  {
+    name: 'app/files-to-lint',
+    files: ['**/*.{ts,mts,tsx,vue}'],
+  },
+
+  {
+    name: 'app/files-to-ignore',
+    ignores: ['**/dist/**', '**/dist-ssr/**', '**/coverage/**'],
+  },
+
+  ...pluginVue.configs['flat/essential'],
+  ...vueTsEslintConfig(),
+
+  {
+    ...pluginVitest.configs.recommended,
+    files: ['src/**/__tests__/*'],
+  },
+  skipFormatting,
+]

example/package.json

@@ -21,30 +21,30 @@
     "vue-router": "^4.5.0"
   },
   "devDependencies": {
-    "@rushstack/eslint-patch": "^1.10.4",
-    "@tsconfig/node18": "^18.2.4",
+    "@tsconfig/node22": "^22.0.0",
     "@types/jsdom": "^20.0.1",
     "@types/node": "^18.19.67",
     "@types/prismjs": "^1.26.5",
-    "@vitejs/plugin-vue": "^4.6.2",
-    "@vitejs/plugin-vue-jsx": "^3.1.0",
-    "@vue/eslint-config-prettier": "^7.1.0",
-    "@vue/eslint-config-typescript": "^11.0.3",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "@vitejs/plugin-vue-jsx": "^4.1.1",
+    "@vitest/eslint-plugin": "^1.1.21",
+    "@vue/eslint-config-prettier": "^10.1.0",
+    "@vue/eslint-config-typescript": "^14.2.0",
     "@vue/test-utils": "^2.4.6",
-    "@vue/tsconfig": "^0.4.0",
+    "@vue/tsconfig": "^0.7.0",
     "eslint": "^9.15.0",
     "eslint-plugin-vue": "^9.31.0",
-    "jsdom": "^20.0.3",
-    "npm-run-all": "^4.1.5",
-    "prettier": "^2.8.8",
+    "jsdom": "^25.0.1",
+    "npm-run-all2": "^7.0.2",
+    "prettier": "^3.4.2",
     "prismjs": "^1.29.0",
     "sass": "^1.81.0",
     "typescript": "^5.7.2",
     "vite": "^6.0.1",
-    "vitest": "^0.34.6",
-    "vue-tsc": "^1.8.27"
+    "vitest": "^2.1.8",
+    "vue-tsc": "^2.2.0"
   },
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=22.0.0"
   }
 }

example/src/components/ComponentQueryString/index.vue

@@ -4,8 +4,7 @@
       <template #title> <code>with ?component</code> </template>
 
       <template #sub-title>
-        You can import SVG as a Vue component via <code>?component</code> query
-        string.
+        You can import SVG as a Vue component via <code>?component</code> query string.
       </template>
 
       <template #demo>

example/tsconfig.node.json

@@ -1,5 +1,5 @@
 {
-  "extends": "@tsconfig/node18/tsconfig.json",
+  "extends": "@tsconfig/node22/tsconfig.json",
   "include": [
     "vite.config.*",
     "vitest.config.*",