From 0d1c24c536f9a8370ca1a63a94af87e3e0c1d3a8 Mon Sep 17 00:00:00 2001 From: MTrun <1262327911@qq.com> Date: Thu, 24 Mar 2022 09:19:14 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9mock=E6=96=B9=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pnpm-lock.yaml | 38 +++++++++---------- src/api/mock/index.ts | 21 +++++----- src/hooks/useChartDataFetch.hook.ts | 2 +- .../components/ChartDataAjax/index.vue | 4 +- vite.config.ts | 15 ++++++++ 5 files changed, 49 insertions(+), 31 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 93bb0d8b..cfda7007 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,7 +11,7 @@ specifiers: '@vue/compiler-sfc': ^3.2.20 '@vueuse/core': ^7.3.0 animate.css: ^4.1.1 - axios: ^0.23.0 + axios: 0.23.0 crypto-ts: ^1.0.2 default-passive-events: ^2.0.0 echarts: ^5.3.0 @@ -49,6 +49,7 @@ dependencies: axios: rg.cnpmjs.org/axios/0.23.0 crypto-ts: r2.cnpmjs.org/crypto-ts/1.0.2 highlight.js: registry.npmjs.org/highlight.js/11.5.0 + mockjs: registry.npmjs.org/mockjs/1.1.0 naive-ui: registry.npmjs.org/naive-ui/2.25.2_vue@3.2.24 pinia: rg.cnpmjs.org/pinia/2.0.6_typescript@4.5.2+vue@3.2.24 screenfull: rg.cnpmjs.org/screenfull/6.0.0 @@ -76,7 +77,6 @@ devDependencies: eslint-plugin-prettier: rg.cnpmjs.org/eslint-plugin-prettier/4.0.0_90bd2ba582f6d1348d73031482d782e2 eslint-plugin-vue: rg.cnpmjs.org/eslint-plugin-vue/8.2.0_eslint@8.4.1 lodash: rg.cnpmjs.org/lodash/4.17.21 - mockjs: rg.cnpmjs.org/mockjs/1.1.0 plop: r2.cnpmjs.org/plop/3.0.5 prettier: rg.cnpmjs.org/prettier/2.5.1 sass: rg.cnpmjs.org/sass/1.44.0 @@ -1870,6 +1870,13 @@ packages: name: color-name version: 1.1.4 + registry.npmjs.org/commander/9.1.0: + resolution: {integrity: sha512-i0/MaqBtdbnJ4XQs4Pmyb+oFQl+q0lsAmokVUH92SlSw4fkeAcG3bVon+Qt7hmtF+u3Het6o4VgrcY3qAoEB6w==, registry: https://skimdb.npmjs.com/registry/, tarball: https://registry.npmjs.org/commander/-/commander-9.1.0.tgz} + name: commander + version: 9.1.0 + engines: {node: ^12.20.0 || >=14} + dev: false + registry.npmjs.org/css-render/0.15.8: resolution: {integrity: sha512-k1gp1MgYDPrFZhzheQkSwm6dmP6nPe2XE6WYpJBPwEc3GbMANPJZfxl7ofZlTl8/+tpMRiGTTgUkTlXaVbLxog==, registry: https://skimdb.npmjs.com/registry/, tarball: https://registry.npmjs.org/css-render/-/css-render-0.15.8.tgz} name: css-render @@ -2185,6 +2192,15 @@ packages: graceful-fs: registry.npmjs.org/graceful-fs/4.2.8 dev: true + registry.npmjs.org/mockjs/1.1.0: + resolution: {integrity: sha512-eQsKcWzIaZzEZ07NuEyO4Nw65g0hdWAyurVol1IPl1gahRwY+svqzfgfey8U8dahLwG44d6/RwEzuK52rSa/JQ==, registry: https://skimdb.npmjs.com/registry/, tarball: https://registry.npmjs.org/mockjs/-/mockjs-1.1.0.tgz} + name: mockjs + version: 1.1.0 + hasBin: true + dependencies: + commander: registry.npmjs.org/commander/9.1.0 + dev: false + registry.npmjs.org/ms/2.0.0: resolution: {integrity: sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=, registry: https://skimdb.npmjs.com/registry/, tarball: https://registry.npmjs.org/ms/-/ms-2.0.0.tgz} name: ms @@ -3689,13 +3705,6 @@ packages: fsevents: registry.npmjs.org/fsevents/2.3.2 dev: true - rg.cnpmjs.org/commander/8.3.0: - resolution: {integrity: sha1-SDfqGy2me5xhamevuw+v7lZ7ymY=, registry: http://r.cnpmjs.org/, tarball: https://rg.cnpmjs.org/commander/download/commander-8.3.0.tgz} - name: commander - version: 8.3.0 - engines: {node: '>= 12'} - dev: true - rg.cnpmjs.org/concat-map/0.0.1: resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=, registry: http://r.cnpmjs.org/, tarball: https://rg.cnpmjs.org/concat-map/download/concat-map-0.0.1.tgz} name: concat-map @@ -5025,15 +5034,6 @@ packages: version: 1.2.5 dev: true - rg.cnpmjs.org/mockjs/1.1.0: - resolution: {integrity: sha1-5qDDeOkZBtuv8gkRzAJzs8fXWwY=, registry: http://r.cnpmjs.org/, tarball: https://rg.cnpmjs.org/mockjs/download/mockjs-1.1.0.tgz} - name: mockjs - version: 1.1.0 - hasBin: true - dependencies: - commander: rg.cnpmjs.org/commander/8.3.0 - dev: true - rg.cnpmjs.org/ms/2.1.2: resolution: {integrity: sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk=, registry: http://r.cnpmjs.org/, tarball: https://rg.cnpmjs.org/ms/download/ms-2.1.2.tgz} name: ms @@ -5943,7 +5943,7 @@ packages: debug: rg.cnpmjs.org/debug/4.3.3 esbuild: rg.cnpmjs.org/esbuild/0.11.3 fast-glob: rg.cnpmjs.org/fast-glob/3.2.7 - mockjs: rg.cnpmjs.org/mockjs/1.1.0 + mockjs: registry.npmjs.org/mockjs/1.1.0 path-to-regexp: rg.cnpmjs.org/path-to-regexp/6.2.0 vite: rg.cnpmjs.org/vite/2.7.1_sass@1.44.0 transitivePeerDependencies: diff --git a/src/api/mock/index.ts b/src/api/mock/index.ts index d9d4e23b..bdafb70a 100644 --- a/src/api/mock/index.ts +++ b/src/api/mock/index.ts @@ -1,13 +1,16 @@ -import Mock from 'mockjs' import test from './test.mock' -Mock.setup({ - timeout: '300-600' -}) +import { MockMethod } from 'vite-plugin-mock' +import { RequestHttpEnum } from '@/enums/httpEnum' // 单个X数据 -const featchMockData = '/api/mockData' -Mock.mock(/\/api\/mockData(|\?\S*)$/, 'get', test.featchMockData) +export const mockDataUrl = '/mock/mockData' -export { - featchMockData -} \ No newline at end of file +const mockObject: MockMethod[] =[{ + // 正则 + // url: /\/mock\/mockData(|\?\S*)$/, + url: '/mock/mockData', + method: RequestHttpEnum.GET, + response: () => test.featchMockData +}] + +export default mockObject \ No newline at end of file diff --git a/src/hooks/useChartDataFetch.hook.ts b/src/hooks/useChartDataFetch.hook.ts index 4d4b1db4..5584a026 100644 --- a/src/hooks/useChartDataFetch.hook.ts +++ b/src/hooks/useChartDataFetch.hook.ts @@ -9,7 +9,7 @@ import { RequestDataTypeEnum } from '@/enums/httpEnum' * @param chartConfig */ export const useChartDataFetch = (chartConfig: CreateComponentType) => { - let fetchInterval = 0 + let fetchInterval:any = 0 watchEffect(() => { clearInterval(fetchInterval) diff --git a/src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue b/src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue index f0d8aa5d..bf1ad358 100644 --- a/src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue +++ b/src/views/chart/ContentConfigurations/components/ChartData/components/ChartDataAjax/index.vue @@ -21,7 +21,7 @@ 开发环境使用 mock 数据，请输入【 - {{featchMockData}} + {{mockDataUrl}} 】 @@ -58,7 +58,7 @@ import { ref, toRefs } from 'vue' import { icon } from '@/plugins' import { SettingItemBox } from '@/components/ChartItemSetting/index' import { RequestHttpEnum } from '@/enums/httpEnum' -import { featchMockData } from '@/api/mock' +import { mockDataUrl } from '@/api/mock' import { http } from '@/api/http' import { SelectHttpType } from '../../index.d' import { ChartDataMatchingAndShow } from '../ChartDataMatchingAndShow' diff --git a/vite.config.ts b/vite.config.ts index f04f56b2..2c06b424 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -3,6 +3,7 @@ import vue from '@vitejs/plugin-vue' import { resolve } from 'path' import { OUTPUT_DIR, brotliSize, chunkSizeWarningLimit, terserOptions, rollupOptions } from './build/constant' import viteCompression from 'vite-plugin-compression' +import { viteMockServe} from "vite-plugin-mock"; function pathResolve(dir: string) { return resolve(process.cwd(), '.', dir) @@ -10,6 +11,7 @@ function pathResolve(dir: string) { export default defineConfig({ base: './', + // 路径重定向 resolve: { alias: [ { @@ -23,6 +25,7 @@ export default defineConfig({ ], dedupe: ['vue'] }, + // 全局 css 注册 css: { preprocessorOptions: { scss: { @@ -33,6 +36,18 @@ export default defineConfig({ }, plugins: [ vue(), + viteMockServe({ + mockPath: "/src/api/mock", + // 开发打包开关 + localEnabled: true, + // 生产打包开关 + prodEnabled: true, + // 打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件 + supportTs: true, + // 监视文件更改 + watchFiles: true, + }), + // 压缩 viteCompression({ verbose: true, disable: false,