Merge pull request #7 from JS-banana/feat-vite3.x

feat: vite2.x => vite3.x 工具链生态相关升级更新

Author: JS-banana

README.md

@@ -8,6 +8,8 @@
 
 相关文章：<https://juejin.cn/post/7041188884864040991>
 
+本项目相关改动及更新见【[更新记录](#更新记录)↓↓↓】
+
 ## 特性
 
 - ✨脚手架工具：高效、快速的 **Vite**
@@ -200,9 +202,11 @@ const refresh = () => ELRef.value?.refresh();
   - 路由模式由 hash调整为 history
 - 2022.05.07
   - 添加路由动效`transition`，优化用户体验，并抽离封装`Breadcrumb`组件
-  - 添加权限指令`v-role`，调整权限逻辑，`Table`相关组件有所改动（配合该篇文章食用[多级别权限设计思考及实战](https://ssscode.com/pages/ff7971/)）
+  - 添加权限指令`v-role`，调整权限逻辑，目前权限指令包括`v-role`/`v-auth`
+  - `Table`相关组件有所改动，同步迭代了一些功能点，包括优化项
+  - 建议配合该篇文章食用[多级别权限设计思考及实战](https://ssscode.com/pages/ff7971/)
 - 2022.06.21
-  - `ant-design-vue`升级到`3.x`版本
+  - `ant-design-vue`升级到`3.x`版本，同步更新改动了一些API
   - `dayjs`替换`moment`
 - 2022.07.24
   - ✔完善`Table`组件，更新了一些在项目中迭代的优化
@@ -215,12 +219,14 @@ const refresh = () => ELRef.value?.refresh();
   - vite相关工具链升级到3.x
   - 现在你必须使用 Node 14.18+ / 16+ 版本。
   - 详情见分支 [feat-vite3.x](https://github.com/JS-banana/vite-vue3-ts/tree/feat-vite3.x)
+  - 原有的vite2.x版本见分支 [feat-vite2.x](https://github.com/JS-banana/vite-vue3-ts/tree/feat-vite2.x)
+  - 现在master主分支为最新的vite3.x版本
 
 ## 计划
 
+- [x] `ant-design-vue` 升级到 3.x版本
 - [ ] 主题换肤功能
 - [ ] 引入 `tailwindcss`
-- [x] `ant-design-vue` 升级到 3.x版本
 
 ## 感谢star
 

config/constant.ts

@@ -24,7 +24,7 @@ export const MOCK_API_TARGET_URL = 'http://localhost:3000';
 export const ICONFONTURL = '//at.alicdn.com/t/font_3004192_9jmc1z9neiw.js'; // 去色版
 
 // 包依赖分析
-export const ANALYSIS = false;
+export const ANALYSIS = true;
 
 // 代码压缩
 export const COMPRESSION = true;

config/vite/optimizer.ts

@@ -14,7 +14,8 @@ const vendorLibs: { match: string[]; output: string }[] = [
   },
 ];
 
-// @ts-ignore
+// pnpm安装的依赖，获取到的路径名称是拼接而成且比较长的
+// vite-vue3-ts/node_modules/.pnpm/[email protected][email protected]/node_modules/ant-design-vue/es/card/style/index.js
 export const configManualChunk = (id: string) => {
   if (/[\\/]node_modules[\\/]/.test(id)) {
     const matchItem = vendorLibs.find((item) => {

package.json

@@ -44,15 +44,11 @@
   "dependencies": {
     "@ant-design/icons-vue": "^6.0.1",
     "@vueuse/core": "^6.8.0",
-    "@vueuse/head": "^0.6.0",
     "ant-design-vue": "^3.2.7",
     "axios": "^0.24.0",
-    "buffer": "^6.0.3",
-    "crypto-js": "^4.1.1",
     "dayjs": "^1.11.3",
     "echarts": "^5.2.2",
     "lodash-es": "^4.17.21",
-    "moment": "^2.29.1",
     "pinia": "^2.0.3",
     "sanitize.css": "^13.0.0",
     "vue": "^3.2.16",
@@ -66,9 +62,9 @@
     "@types/lodash-es": "^4.17.5",
     "@typescript-eslint/eslint-plugin": "^4.31.1",
     "@typescript-eslint/parser": "^4.31.1",
-    "@vitejs/plugin-legacy": "^1.6.2",
-    "@vitejs/plugin-vue": "^1.9.3",
-    "@vitejs/plugin-vue-jsx": "^1.2.0",
+    "@vitejs/plugin-legacy": "^2.0.0",
+    "@vitejs/plugin-vue": "^3.0.1",
+    "@vitejs/plugin-vue-jsx": "^2.0.0",
     "autoprefixer": "^10.4.0",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
@@ -86,14 +82,15 @@
     "postcss-less": "^5.0.0",
     "prettier": "^2.4.1",
     "rimraf": "^3.0.2",
-    "rollup-plugin-visualizer": "^5.5.2",
+    "rollup-plugin-visualizer": "^5.7.1",
+    "terser": "^5.14.2",
     "typescript": "^4.4.3",
-    "unplugin-auto-import": "^0.4.14",
-    "unplugin-vue-components": "^0.17.2",
-    "vite": "^2.6.4",
+    "unplugin-auto-import": "^0.4.20",
+    "unplugin-vue-components": "^0.17.21",
+    "vite": "^3.0.4",
     "vite-plugin-compression": "^0.3.6",
     "vite-plugin-mock": "^2.9.6",
-    "vite-plugin-style-import": "^1.3.0",
+    "vite-plugin-style-import": "^1.4.0",
     "vite-plugin-svg-icons": "^1.0.5",
     "vue-eslint-parser": "^7.11.0",
     "vue-tsc": "^0.3.0"