vue-vben-admin 首页加载慢优化 升级vite2到vite3
我的vben-admin是2.8版本的,首次首页加载太慢了,升级下vite,原来1分钟,现在20s左右
1.修改package.json
添加
"terser": "^5.14.2",
修改
"@vitejs/plugin-legacy": "^2.0.0",
"@vitejs/plugin-vue": "^3.0.1",
"vite": "^3.0.2",
"vite-plugin-mkcert": "^1.9.0",
"vite-plugin-purge-icons": "^0.8.2",
"vite-plugin-pwa": "^0.12.3",
"vite-plugin-windicss": "^1.8.7",
2.删除 pnpm-lock.yaml
3.执行下pnpm install
4.更改其他文件
mock/_createProductionServer.ts
const modules = import.meta.glob('./**/*.ts', { eager: true });
mockModules.push(...(modules as Recordable)[key].default);
src/locales/lang/en.ts
const modules = import.meta.glob('./en/**/*.ts', { eager: true });
...genMessage(modules as Recordable<Recordable>, 'en'),
src/locales/lang/zh_CN.ts
const modules = import.meta.glob('./zh-CN/**/*.ts', { eager: true });
...genMessage(modules as Recordable<Recordable>, 'zh-CN'),
src/router/menus/index.ts
const mod = (modules as Recordable)[key].default || {};
src/router/routes/index.ts
// import.meta.glob('*', { eager: true }) 直接引入所有的模块 Vite 独有的功能
const modules = import.meta.glob('./modules/**/*.ts', { eager: true });
const mod = (modules as Recordable)[key].default || {};
vite.config.ts
brotliSize: false 更改成 reportCompressedSize: false,
define: {
...
//新增以下变量
__COLOR_PLUGIN_OUTPUT_FILE_NAME__: undefined,
__PROD__: true,
__COLOR_PLUGIN_OPTIONS__: {},
},
参考链接
github-vben-admin-commit
报错处理