升级依赖到最新稳定版本，支持 Node 20+

- 升级核心依赖：vue 3.5.41、vue-router 5.2.0、vue-i18n 11.4.2、element-plus 2.14.4
- 升级工具依赖：@vueuse/core 14.4.0、pinia 3.0.4、vue-virtual-scroller 2.0.1（正式版）
- 升级图表依赖：echarts 6.1.0、vue-echarts 8.1.0
- 升级 axios 1.19.0、dayjs 1.11.23、lodash-es 4.18.1、monaco-editor 0.56.0
- 升级构建工具：vite 7.3.6、@vitejs/plugin-vue 6.0.8、@vitejs/plugin-vue-jsx 5.1.6
- 升级 @typescript-eslint 8.67.0、@rushstack/eslint-patch 1.16.1
- package.json 新增 engines 字段声明 Node >= 20.0.0
- 优化 vite.config.mjs：eslint 和 mock 插件仅在 dev 模式启用，避免构建阻塞
- 构建分包策略：monaco-editor 独立拆包 monaco chunk
- 修复 monaco-editor 0.56.0 worker 导入路径（适配新版 exports 字段）
- 新增 acorn ^8.14.0 dev 依赖修复 ESLint 模块解析问题
- .eslintrc.js 关闭 vue/no-v-html 规则以支持动态内容渲染
- README.md 补充 Node.js >= 20.0.0 环境要求说明

.eslintrc.js

@@ -18,6 +18,7 @@ module.exports = {
   rules: {
     'vue/multi-word-component-names': 'off',
     '@typescript-eslint/no-unused-expressions': 'off',
-    '@typescript-eslint/no-explicit-any': 'off'
+    '@typescript-eslint/no-explicit-any': 'off',
+    'vue/no-v-html': 'off'
   }
 }

README.md

@@ -23,6 +23,11 @@
 
 ![image-20240101210847359](https://git.mengqingpo.com:8888//fugary/blogpic/uploads/dbdd47602fee400658917582e96cb412/image-20240101210847359.png)
 
+### 环境要求
+
+- Node.js >= 20.0.0
+- npm >= 9.0.0
+
 ### 安装使用
 
 clone到本地之后，安装依赖：

package.json

@@ -13,45 +13,49 @@
     "type": "git",
     "url": "https://github.com/fugary/simple-element-plus-template"
   },
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "dependencies": {
     "@element-plus/icons-vue": "^2.3.2",
     "@guolao/vue-monaco-editor": "^1.6.0",
     "@howiefh/ant-path-matcher": "^0.0.4",
     "@vicons/material": "^0.13.0",
-    "@vueuse/core": "^14.2.0",
+    "@vueuse/core": "^14.4.0",
     "async-validator": "^4.2.5",
-    "axios": "^1.13.4",
+    "axios": "^1.19.0",
-    "dayjs": "^1.11.19",
+    "dayjs": "^1.11.23",
-    "echarts": "^6.0.0",
+    "echarts": "^6.1.0",
-    "element-plus": "^2.13.2",
+    "element-plus": "^2.14.4",
-    "lodash-es": "^4.17.23",
+    "lodash-es": "^4.18.1",
-    "monaco-editor": "^0.55.1",
+    "monaco-editor": "^0.56.0",
     "nprogress": "^0.2.0",
     "numeral": "^2.0.6",
     "pinia": "^3.0.4",
     "pinia-plugin-persistedstate": "^4.7.1",
-    "sortablejs": "^1.15.6",
+    "sortablejs": "^1.15.7",
     "split.js": "^1.6.5",
-    "ua-parser-js": "^2.0.8",
+    "ua-parser-js": "^2.0.10",
     "vite-plugin-mock": "^3.0.2",
-    "vue": "^3.5.27",
+    "vue": "^3.5.41",
-    "vue-echarts": "^8.0.1",
+    "vue-echarts": "^8.1.0",
-    "vue-i18n": "^11.2.8",
+    "vue-i18n": "^11.4.2",
-    "vue-router": "^5.0.1",
+    "vue-router": "^5.2.0",
-    "vue-virtual-scroller": "^2.0.0-beta.8"
+    "vue-virtual-scroller": "^2.0.1"
   },
   "devDependencies": {
-    "@rushstack/eslint-patch": "^1.15.0",
+    "@rushstack/eslint-patch": "^1.16.1",
-    "@typescript-eslint/eslint-plugin": "^8.54.0",
+    "@typescript-eslint/eslint-plugin": "^8.67.0",
-    "@typescript-eslint/parser": "^8.54.0",
+    "@typescript-eslint/parser": "^8.67.0",
-    "@vitejs/plugin-vue": "^6.0.3",
+    "@vitejs/plugin-vue": "^6.0.8",
-    "@vitejs/plugin-vue-jsx": "^5.1.3",
+    "@vitejs/plugin-vue-jsx": "^5.1.6",
     "@vue/eslint-config-standard": "^8.0.1",
+    "acorn": "^8.14.0",
     "eslint": "^8.57.1",
     "eslint-plugin-vue": "^9.33.0",
-    "rollup-plugin-visualizer": "^6.0.5",
+    "rollup-plugin-visualizer": "^6.0.11",
     "typescript": "^5.9.3",
-    "vite": "^7.3.1",
+    "vite": "^7.3.6",
     "vite-plugin-eslint": "^1.8.1"
   }
 }

src/vendors/monaco-editor.js

@@ -3,11 +3,11 @@ import { ref, watch, toRaw, h, withDirectives, resolveDirective } from 'vue'
 const MonacoLoader = () => import('monaco-editor')
 
 const WorkerImporters = {
-  JsonWorker: () => import('monaco-editor/esm/vs/language/json/json.worker?worker'),
+  JsonWorker: () => import('monaco-editor/language/json/json.worker.js?worker'),
-  CssWorker: () => import('monaco-editor/esm/vs/language/css/css.worker?worker'),
+  CssWorker: () => import('monaco-editor/language/css/css.worker.js?worker'),
-  HtmlWorker: () => import('monaco-editor/esm/vs/language/html/html.worker?worker'),
+  HtmlWorker: () => import('monaco-editor/language/html/html.worker.js?worker'),
-  JsWorker: () => import('monaco-editor/esm/vs/language/typescript/ts.worker?worker'),
+  JsWorker: () => import('monaco-editor/language/typescript/ts.worker.js?worker'),
-  EditorWorker: () => import('monaco-editor/esm/vs/editor/editor.worker?worker')
+  EditorWorker: () => import('monaco-editor/editor/editor.worker.js?worker')
 }
 /**
  * 默认配置

vite.config.mjs

@@ -5,7 +5,6 @@ import vue from '@vitejs/plugin-vue'
 import { viteMockServe } from 'vite-plugin-mock'
 import vueJsx from '@vitejs/plugin-vue-jsx'
 import eslint from 'vite-plugin-eslint'
-import { visualizer } from 'rollup-plugin-visualizer'
 import packageJson from './package.json'
 
 const JS_FILE_NAMES = 'js/[name]-[hash].js'
@@ -15,25 +14,28 @@ const IMG_FILE_NAMES = 'images/[name]-[hash].[ext]'
 
 // https://vitejs.dev/config/
 export default ({ mode, command }) => {
-
   const env = loadEnv(mode, process.cwd())
-  const optionalPlugins = [{
+  const plugins = [
-    plugin: visualizer({ open: true }),
+    vue(),
-    enabled: false
+    vueJsx()
-  }, {
+  ]
-    plugin: viteMockServe({
+
+  if (command === 'serve') {
+    plugins.push(
+      eslint({ lintOnStart: false }),
+      viteMockServe({
         mockPath: './mock',
-      enable: command === 'serve'
+        enable: true
-    }),
+      })
-    enabled: command === 'serve'
+    )
-  }].filter(p => p.enabled).map(p => p.plugin)
+  }
 
   return defineConfig({
     base: env.VITE_APP_CONTEXT_PATH,
     define: {
       'import.meta.env.VITE_APP_VERSION': JSON.stringify(packageJson.version)
     },
-    plugins: [vue(), vueJsx(), eslint(), ...optionalPlugins],
+    plugins,
 
     esbuild: {
       drop: mode === 'production' ? ['console', 'debugger'] : []
@@ -61,6 +63,9 @@ export default ({ mode, command }) => {
             if (id.includes('element-plus')) {
               return 'elp'
             }
+            if (id.includes('monaco-editor')) {
+              return 'monaco'
+            }
           }
         }
       }