refactor!: vite-plugin-fake-server 替换 vite-plugin-mock

package.json

@@ -42,20 +42,21 @@
     "qs": "^6.11.2",
     "scule": "^1.1.1",
     "vconsole": "^3.15.1",
-    "vue": "^3.4.3",
+    "vue": "^3.4.4",
     "vue-m-message": "^4.0.2",
     "vue-router": "^4.2.5"
   },
   "devDependencies": {
     "@antfu/eslint-config": "2.6.1",
-    "@iconify/json": "^2.2.163",
+    "@iconify/json": "^2.2.164",
     "@iconify/vue": "^4.1.1",
     "@stylistic/stylelint-config": "^1.0.1",
     "@types/lodash-es": "^4.17.12",
+    "@types/mockjs": "^1.0.10",
     "@types/nprogress": "^0.2.3",
     "@types/path-browserify": "^1.0.2",
     "@types/qs": "^6.9.11",
-    "@unocss/eslint-plugin": "^0.58.2",
+    "@unocss/eslint-plugin": "^0.58.3",
     "@vitejs/plugin-legacy": "^5.2.0",
     "@vitejs/plugin-vue": "^5.0.2",
     "@vitejs/plugin-vue-jsx": "^3.1.0",
@@ -70,23 +71,23 @@
     "lint-staged": "^15.2.0",
     "npm-run-all": "^4.1.5",
     "plop": "^4.0.1",
-    "sass": "^1.69.6",
+    "sass": "^1.69.7",
     "simple-git-hooks": "^2.9.0",
     "stylelint": "^16.1.0",
     "stylelint-config-recess-order": "^4.4.0",
     "stylelint-config-standard-scss": "^12.0.0",
     "stylelint-config-standard-vue": "^1.0.0",
     "stylelint-scss": "^6.0.0",
-    "svgo": "^3.1.0",
+    "svgo": "^3.2.0",
     "terser": "^5.26.0",
     "typescript": "^5.3.3",
-    "unocss": "^0.58.2",
+    "unocss": "^0.58.3",
     "unplugin-auto-import": "^0.17.3",
     "unplugin-vue-components": "^0.26.0",
     "vite": "^5.0.10",
     "vite-plugin-banner": "^0.7.1",
     "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-mock": "^2.9.8",
+    "vite-plugin-fake-server": "^2.0.1",
     "vite-plugin-pages": "^0.32.0",
     "vite-plugin-svg-icons": "^2.0.1",
     "vite-plugin-vue-inspector": "^4.0.2",

src/mock/app.ts

@@ -1,4 +1,6 @@
-export default [
+import { defineFakeRoute } from 'vite-plugin-fake-server/client'
+
+export default defineFakeRoute([
   {
     url: '/mock/app/route/list',
     method: 'get',
@@ -149,4 +151,4 @@ export default [
       }
     },
   },
-]
+])

src/mock/user.ts

@@ -1,26 +1,29 @@
-export default [
+import { defineFakeRoute } from 'vite-plugin-fake-server/client'
+import Mock from 'mockjs'
+
+export default defineFakeRoute([
   {
     url: '/mock/user/login',
     method: 'post',
-    response: ({ body }: any) => {
+    response: ({ body }) => {
       return {
         error: '',
         status: 1,
-        data: {
+        data: Mock.mock({
           account: body.account,
           token: `${body.account}_@string`,
           failure_time: Math.ceil(new Date().getTime() / 1000) + 24 * 60 * 60,
           avatar: '',
-        },
+        }),
       }
     },
   },
   {
     url: '/mock/user/permission',
     method: 'get',
-    response: ({ headers }: any) => {
+    response: ({ headers }) => {
       let permissions: string[] = []
-      if (headers.token.indexOf('admin') === 0) {
+      if (headers.token?.indexOf('admin') === 0) {
         permissions = [
           'permission.browse',
           'permission.create',
@@ -28,7 +31,7 @@ export default [
           'permission.remove',
         ]
       }
-      else if (headers.token.indexOf('test') === 0) {
+      else if (headers.token?.indexOf('test') === 0) {
         permissions = [
           'permission.browse',
         ]
@@ -45,12 +48,14 @@ export default [
   {
     url: '/mock/user/password/edit',
     method: 'post',
-    response: {
-      error: '',
-      status: 1,
-      data: {
-        isSuccess: true,
-      },
+    response: () => {
+      return {
+        error: '',
+        status: 1,
+        data: {
+          isSuccess: true,
+        },
+      }
     },
   },
-]
+])

src/mockProdServer.ts

@@ -1,12 +0,0 @@
-import { createProdMockServer } from 'vite-plugin-mock/es/createProdMockServer'
-
-const mocks: any[] = []
-const mockContext = import.meta.glob('./mock/*.ts', { eager: true })
-
-Object.keys(mockContext).forEach((v) => {
-  mocks.push(...(mockContext[v] as any).default)
-})
-
-export function setupProdMockServer() {
-  createProdMockServer(mocks)
-}

vite/plugins/mock.ts

@@ -1,14 +1,11 @@
-import { viteMockServe } from 'vite-plugin-mock'
+import { vitePluginFakeServer } from 'vite-plugin-fake-server'
 
 export default function createMock(env, isBuild) {
   const { VITE_BUILD_MOCK } = env
-  return viteMockServe({
-    mockPath: 'src/mock',
-    localEnabled: !isBuild,
-    prodEnabled: isBuild && VITE_BUILD_MOCK === 'true',
-    injectCode: `
-import { setupProdMockServer } from './mockProdServer';
-setupProdMockServer();
-    `,
+  return vitePluginFakeServer({
+    logger: !isBuild,
+    include: 'src/mock',
+    infixName: false,
+    enableProd: isBuild && VITE_BUILD_MOCK === 'true',
   })
 }