Merge pull request #11 from JS-banana/feat-vite4.x

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

Author: JS-banana

.npmrc

@@ -5,3 +5,6 @@ shamefully-hoist = true
 
 # node-sass 下载问题
 # sass_binary_site="https://npm.taobao.org/mirrors/node-sass/"
+
+# peers
+strict-peer-dependencies=false

README.md

@@ -221,6 +221,10 @@ const refresh = () => ELRef.value?.refresh();
   - 详情见分支 [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版本
+- 2023.09.20
+  - vite相关工具链升级到4.x
+  - 详情见分支 feat-vite4.x
+  - 现在master主分支为最新的vite4.x版本
 
 ## 计划
 

config/vite/plugin/styleImport.ts

@@ -2,13 +2,13 @@
  *  Introduces component library styles on demand.
  * https://github.com/anncwb/vite-plugin-style-import
  */
-import styleImport from 'vite-plugin-style-import';
+import { createStyleImportPlugin } from 'vite-plugin-style-import';
 
 export function configStyleImportPlugin(isBuild: boolean) {
   if (!isBuild) {
     return [];
   }
-  const styleImportPlugin = styleImport({
+  const styleImportPlugin = createStyleImportPlugin({
     libs: [
       {
         libraryName: 'ant-design-vue',

config/vite/plugin/svgIcons.ts

@@ -3,11 +3,11 @@
  * https://github.com/anncwb/vite-plugin-svg-icons
  */
 
-import SvgIconsPlugin from 'vite-plugin-svg-icons';
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
 import path from 'path';
 
 export function configSvgIconsPlugin(isBuild: boolean) {
-  const svgIconsPlugin = SvgIconsPlugin({
+  const svgIconsPlugin = createSvgIconsPlugin({
     iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
     svgoOptions: isBuild,
     // default

package.json

@@ -60,12 +60,13 @@
     "@commitlint/config-conventional": "^15.0.0",
     "@faker-js/faker": "^7.3.0",
     "@types/lodash-es": "^4.17.5",
-    "@typescript-eslint/eslint-plugin": "^4.31.1",
-    "@typescript-eslint/parser": "^4.31.1",
-    "@vitejs/plugin-legacy": "^2.0.0",
-    "@vitejs/plugin-vue": "^3.0.1",
-    "@vitejs/plugin-vue-jsx": "^2.0.0",
+    "@typescript-eslint/eslint-plugin": "^6.7.2",
+    "@typescript-eslint/parser": "^6.7.2",
+    "@vitejs/plugin-legacy": "^4.1.1",
+    "@vitejs/plugin-vue": "^4.3.4",
+    "@vitejs/plugin-vue-jsx": "^3.0.2",
     "autoprefixer": "^10.4.0",
+    "consola": "^3.2.3",
     "conventional-changelog-cli": "^2.2.2",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
@@ -83,17 +84,16 @@
     "postcss-less": "^5.0.0",
     "prettier": "^2.4.1",
     "rimraf": "^3.0.2",
-    "rollup-plugin-visualizer": "^5.7.1",
-    "terser": "^5.14.2",
-    "typescript": "^4.4.3",
+    "rollup-plugin-visualizer": "^5.9.2",
+    "typescript": "^5.2.2",
     "unplugin-auto-import": "^0.4.20",
     "unplugin-vue-components": "^0.17.21",
-    "vite": "^3.0.4",
-    "vite-plugin-compression": "^0.3.6",
+    "vite": "^4.4.9",
+    "vite-plugin-compression": "^0.5.1",
     "vite-plugin-mock": "^2.9.6",
-    "vite-plugin-style-import": "^1.4.0",
-    "vite-plugin-svg-icons": "^1.0.5",
+    "vite-plugin-style-import": "^2.0.0",
+    "vite-plugin-svg-icons": "^2.0.1",
     "vue-eslint-parser": "^7.11.0",
-    "vue-tsc": "^0.3.0"
+    "vue-tsc": "^1.8.13"
   }
 }