fix(projects): add prod mockjs switch [添加生产模式的mockjs的开关]

.env.production

@@ -6,3 +6,5 @@ VITE_COMPRESS=N
 VITE_COMPRESS_TYPE=gzip
 
 VITE_PWA=N
+
+VITE_PROD_MOCK=Y

build/plugins/index.ts

@@ -24,7 +24,7 @@ export function setupVitePlugins(viteEnv: ImportMetaEnv): (PluginOption | Plugin
     vueJsx(),
     ...unplugin(viteEnv),
     unocss(),
-    mock,
+    mock(viteEnv),
     progress(),
     pageRoute()
   ];

build/plugins/mock.ts

@@ -1,9 +1,14 @@
 import { viteMockServe } from 'vite-plugin-mock';
 
-export default viteMockServe({
-  mockPath: 'mock',
-  injectCode: `
-		import { setupMockServer } from '../mock';
-		setupMockServer();
-	`
-});
+export default (viteEnv: ImportMetaEnv) => {
+  const prodMock = viteEnv.VITE_PROD_MOCK === 'Y';
+
+  return viteMockServe({
+    mockPath: 'mock',
+    prodEnabled: prodMock,
+    injectCode: `
+			import { setupMockServer } from '../mock';
+			setupMockServer();
+		`
+  });
+};

mock/api/management.ts

@@ -1,4 +1,4 @@
-import betterMock from 'better-mock';
+import { mock } from 'mockjs';
 import type { MockMethod } from 'vite-plugin-mock';
 
 const apis: MockMethod[] = [
@@ -6,7 +6,7 @@ const apis: MockMethod[] = [
     url: '/mock/getAllUserList',
     method: 'post',
     response: (): Service.MockServiceResult<ApiUserManagement.User[]> => {
-      const data = betterMock.mock({
+      const data = mock({
         'list|1000': [
           {
             id: '@id',

package.json

@@ -99,12 +99,12 @@
     "@unocss/vite": "^0.51.13",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vitejs/plugin-vue-jsx": "^3.0.1",
-    "better-mock": "^0.3.6",
     "conventional-changelog": "^3.1.25",
     "cross-env": "^7.0.3",
     "eslint": "^8.40.0",
     "eslint-config-soybeanjs": "^0.3.7",
     "lint-staged": "13.2.2",
+    "mockjs": "^1.1.0",
     "rollup-plugin-visualizer": "^5.9.0",
     "sass": "^1.62.1",
     "simple-git-hooks": "^2.8.1",

src/typings/env.d.ts

@@ -59,6 +59,11 @@ interface ImportMetaEnv {
   readonly VITE_COMPRESS_TYPE?: 'gzip' | 'brotliCompress' | 'deflate' | 'deflateRaw';
   /** 是否应用pwa */
   readonly VITE_PWA?: 'Y' | 'N';
+  /**
+   * 是否开启生产模式下的mock
+   * @description 生产模式下会拦截XHR，导致无法获取response，不使用mock请求时设置为N
+   */
+  readonly VITE_PROD_MOCK?: 'Y' | 'N';
   /** hash路由模式 */
   readonly VITE_HASH_ROUTE?: 'Y' | 'N';
   /** 是否是部署的vercel */