diff --git a/packages/toolkits/pro/template/tinyvue/.env b/packages/toolkits/pro/template/tinyvue/.env index 9de4842e..27a9a3e9 100644 --- a/packages/toolkits/pro/template/tinyvue/.env +++ b/packages/toolkits/pro/template/tinyvue/.env @@ -1,5 +1,8 @@ VITE_CONTEXT=/vue-pro/ VITE_BASE_API=/api VITE_SERVER_HOST= http://127.0.0.1:3000 +VITE_MOCK_HOST= http://127.0.0.1:8848 VITE_USE_MOCK= false VITE_MOCK_IGNORE= /api/user/userInfo,/api/user/login,/api/user/register,/api/employee/getEmployee + +VITE_MOCK_SERVER_HOST=/mock diff --git a/packages/toolkits/pro/template/tinyvue/babel.config.js b/packages/toolkits/pro/template/tinyvue/babel.config.js index dd6f53ce..3f7f17c9 100644 --- a/packages/toolkits/pro/template/tinyvue/babel.config.js +++ b/packages/toolkits/pro/template/tinyvue/babel.config.js @@ -1,3 +1,5 @@ module.exports = { - plugins: ['@vue/babel-plugin-jsx'], + plugins: [ + '@vue/babel-plugin-jsx', + ] }; diff --git a/packages/toolkits/pro/template/tinyvue/config/vite.config.base.ts b/packages/toolkits/pro/template/tinyvue/config/vite.config.base.ts index f1dce32f..b44c6b6f 100644 --- a/packages/toolkits/pro/template/tinyvue/config/vite.config.base.ts +++ b/packages/toolkits/pro/template/tinyvue/config/vite.config.base.ts @@ -3,25 +3,12 @@ import { defineConfig } from 'vite'; import vue from '@vitejs/plugin-vue'; import vueJsx from '@vitejs/plugin-vue-jsx'; import svgLoader from 'vite-svg-loader'; -import { viteMockServe } from 'vite-plugin-mock'; - -const useMock = !! process.env.VITE_USE_MOCK const config = { plugins: [ vue(), vueJsx(), svgLoader({ svgoConfig: {} }), - viteMockServe({ - mockPath: '../src/mock', // mock文件地址 - localEnabled:useMock, // 开发打包开关 - prodEnabled:true, // 生产打包开关 // 这样可以控制关闭mock的时候不让mock打包到最终代码内 - injectCode: ` import { setupProdMockServer } from '../src/mockProdServer'; setupProdMockServer(); `, - logger: true, // 是否在控制台显示请求日志 - supportTs: false, // 打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件 - watchFiles:true, - injectFile: resolve('../src/main.ts'), - }) ], build: { outDir: resolve(__dirname, '../dist'), diff --git a/packages/toolkits/pro/template/tinyvue/config/vite.config.dev.ts b/packages/toolkits/pro/template/tinyvue/config/vite.config.dev.ts index b18cbd3a..f6b5f207 100644 --- a/packages/toolkits/pro/template/tinyvue/config/vite.config.dev.ts +++ b/packages/toolkits/pro/template/tinyvue/config/vite.config.dev.ts @@ -13,6 +13,11 @@ const proxyConfig = { '' ), }, + [loadEnv('', process.cwd()).VITE_MOCK_SERVER_HOST]: { + target: loadEnv('', process.cwd()).VITE_MOCK_HOST, + changeOrigin: true, + rewrite: (path:string) => path.replace(/^\/mock/, '') + } }; export default mergeConfig( { diff --git a/packages/toolkits/pro/template/tinyvue/config/vite.config.preview.base.ts b/packages/toolkits/pro/template/tinyvue/config/vite.config.preview.base.ts index b815ab17..018e9924 100644 --- a/packages/toolkits/pro/template/tinyvue/config/vite.config.preview.base.ts +++ b/packages/toolkits/pro/template/tinyvue/config/vite.config.preview.base.ts @@ -3,23 +3,12 @@ import { defineConfig } from 'vite'; import vue from '@vitejs/plugin-vue'; import vueJsx from '@vitejs/plugin-vue-jsx'; import svgLoader from 'vite-svg-loader'; -import { viteMockServe } from 'vite-plugin-mock'; export default defineConfig({ plugins: [ vue(), vueJsx(), svgLoader({ svgoConfig: {} }), - viteMockServe({ - // 更多配置见最下方 - mockPath: '../src/mock', // mock文件地址 - localEnabled: true, // 开发打包开关 - prodEnabled: true, // 生产打包开关 // 这样可以控制关闭mock的时候不让mock打包到最终代码内 - injectCode: ` import { setupProdMockServer } from '../src/mockProdServer'; setupProdMockServer(); `, - logger: false, // 是否在控制台显示请求日志 - supportTs: false, // 打开后，可以读取 ts 文件模块。 请注意，打开后将无法监视.js 文件 - injectFile: resolve('../src/main.ts'), - }), ], build: { outDir: resolve(__dirname, '../dist/vue-pro/pages'), diff --git a/packages/toolkits/pro/template/tinyvue/config/vite.config.prod.ts b/packages/toolkits/pro/template/tinyvue/config/vite.config.prod.ts index a5ddb3af..abccb66c 100644 --- a/packages/toolkits/pro/template/tinyvue/config/vite.config.prod.ts +++ b/packages/toolkits/pro/template/tinyvue/config/vite.config.prod.ts @@ -1,12 +1,11 @@ import { mergeConfig } from 'vite'; -import baseConig from './vite.config.base'; +import baseConfig from './vite.config.base'; import configCompressPlugin from './plugin/compress'; import configVisualizerPlugin from './plugin/visualizer'; export default mergeConfig( { mode: 'production', - mock: true, plugins: [configCompressPlugin('gzip'), configVisualizerPlugin()], build: { rollupOptions: { @@ -19,5 +18,5 @@ export default mergeConfig( chunkSizeWarningLimit: 2000, }, }, - baseConig + baseConfig ); diff --git a/packages/toolkits/pro/template/tinyvue/dev.env b/packages/toolkits/pro/template/tinyvue/dev.env new file mode 100644 index 00000000..27a9a3e9 --- /dev/null +++ b/packages/toolkits/pro/template/tinyvue/dev.env @@ -0,0 +1,8 @@ +VITE_CONTEXT=/vue-pro/ +VITE_BASE_API=/api +VITE_SERVER_HOST= http://127.0.0.1:3000 +VITE_MOCK_HOST= http://127.0.0.1:8848 +VITE_USE_MOCK= false +VITE_MOCK_IGNORE= /api/user/userInfo,/api/user/login,/api/user/register,/api/employee/getEmployee + +VITE_MOCK_SERVER_HOST=/mock diff --git a/packages/toolkits/pro/template/tinyvue/index.html b/packages/toolkits/pro/template/tinyvue/index.html index 0b1d5c7f..3066b49c 100644 --- a/packages/toolkits/pro/template/tinyvue/index.html +++ b/packages/toolkits/pro/template/tinyvue/index.html @@ -8,6 +8,6 @@
- + diff --git a/packages/toolkits/pro/template/tinyvue/package.json b/packages/toolkits/pro/template/tinyvue/package.json index b5990ca4..4eb7634d 100644 --- a/packages/toolkits/pro/template/tinyvue/package.json +++ b/packages/toolkits/pro/template/tinyvue/package.json @@ -8,9 +8,12 @@ "scripts": { "start": "vite --config ./config/vite.config.dev.ts --port 3031", "build": "vite build --config ./config/vite.config.prod.ts", + "build:wp": "webpack --config webpack.config.js", + "dev:wp": "webpack-dev-server --progress --config webpack.config.js", "report": "cross-env REPORT=true npm run build", "lint-staged": "npx lint-staged", - "prepare": "git init && husky install" + "prepare": "git init && husky install", + "mock": "tsx ./src/mock/index.ts" }, "lint-staged": { "*.{js,ts,jsx,tsx}": [ @@ -28,9 +31,15 @@ ] }, "dependencies": { + "@babel/core": "^7.25.2", + "@gaonengwww/mock-server": "^1.0.5", "@opentiny/hwc-client": "^0.0.14", "@opentiny/vue": "^3.11.1", + "@opentiny/vue-icon": "^3.17.0", + "@opentiny/vue-locale": "^3.17.0", + "@opentiny/vue-theme": "^3.17.5", "@types/mockjs": "^1.0.9", + "@types/node": "^22.1.0", "@vueuse/core": "^10.5.0", "@vueuse/head": "^2.0.0", "axios": "^1.6.0", @@ -43,12 +52,15 @@ "nprogress": "^1.0.0-1", "pinia": "2.1.7", "query-string": "^8.1.0", + "style-resources-loader": "^1.5.0", "vue": "^3.3.7", "vue-eslint-parser": "^9.3.2", "vue-i18n": "^9.6.2", "vue-router": "^4.2.5" }, "devDependencies": { + "@babel/preset-env": "^7.25.3", + "@babel/preset-typescript": "^7.24.7", "@commitlint/cli": "^11.0.0", "@commitlint/config-conventional": "^12.0.1", "@types/lodash": "^4.14.177", @@ -57,8 +69,14 @@ "@typescript-eslint/parser": "^5.10.0", "@vitejs/plugin-vue": "^4.3.4", "@vitejs/plugin-vue-jsx": "^3.0.2", + "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0", "@vue/babel-plugin-jsx": "^1.1.5", + "@vue/babel-preset-jsx": "^1.4.0", + "babel-loader": "^9.1.3", + "core-js": "3", "cross-env": "^7.0.3", + "css-loader": "^7.1.2", + "dotenv": "^16.4.5", "eslint": "^7.2.0", "eslint-config-airbnb-base": "^14.2.1", "eslint-config-prettier": "^8.3.0", @@ -66,18 +84,25 @@ "eslint-plugin-import": "^2.22.1", "eslint-plugin-prettier": "^3.3.1", "eslint-plugin-vue": "^8.3.0", + "html-webpack-plugin": "^5.6.0", "husky": "^7.0.4", - "less": "^4.1.2", + "import-meta-loader": "^1.1.0", + "less": "^4.2.0", + "less-loader": "^12.2.0", "lint-staged": "^11.2.6", "mockjs": "^1.1.0", "prettier": "^3.0.3", "rollup-plugin-visualizer": "^5.9.2", + "style-loader": "^4.0.0", "stylelint": "^13.8.0", "stylelint-config-prettier": "^8.0.2", "stylelint-config-rational-order": "^0.1.2", "stylelint-config-standard": "^20.0.0", "stylelint-order": "^4.1.0", - "typescript": "^4.5.5", + "ts-loader": "^9.5.1", + "ts-node": "^10.9.2", + "tsx": "^4.17.0", + "typescript": "^4.9.5", "unplugin-vue-components": "^0.17.21", "vite": "^4.4.9", "vite-plugin-compression": "^0.5.1", @@ -86,14 +111,17 @@ "vite-plugin-mock": "^2.9.6", "vite-plugin-style-import": "2.0.0", "vite-svg-loader": "^4.0.0", - "vue-tsc": "^1.8.22" + "vue-loader": "^17.4.2", + "vue-tsc": "^1.8.22", + "webpack": "^5.65.0", + "webpack-cli": "^4.9.1", + "webpack-dev-server": "^4.7.1" }, "engines": { "node": ">=14.0.0" }, "resolutions": { "bin-wrapper": "npm:bin-wrapper-china", - "rollup": "^2.56.3", "gifsicle": "5.2.0" } } diff --git a/packages/toolkits/pro/template/tinyvue/src/api/board.ts b/packages/toolkits/pro/template/tinyvue/src/api/board.ts index 88fd4c49..ba116ece 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/board.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/board.ts @@ -1,19 +1,20 @@ import axios from 'axios'; +axios.defaults.timeout = 5000; // 获取select的option export function getUserData() { - return axios.get('/api/user/getdata'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/user/getdata`); } export function getUserPractic() { - return axios.get('/api/user/getrpractic'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/user/getrpractic`); } export function getUserTrain() { - return axios.get('/api/user/getrtrain'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/user/getrtrain`); } // 切换数据源 export function getUserChange(data: string) { - return axios.post('/api/user/getselect', data as any); + return axios.post(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/user/getselect`, data as any); } diff --git a/packages/toolkits/pro/template/tinyvue/src/api/form.ts b/packages/toolkits/pro/template/tinyvue/src/api/form.ts index 9f1eed04..be1b9bc3 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/form.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/form.ts @@ -22,15 +22,15 @@ export type UnitStepModel = PersonalModel & CompanyInfoModel; // 获取base表单的初始数据选项 export function getBaseData() { - return axios.get('/api/base/getdata'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/base/getdata`); } // 表单的数据提交&&校验 export function submitStepForm(data: UnitStepModel) { - return axios.post('/api/channel-form/submit', { data }); + return axios.post(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/channel-form/submit`, { data }); } // 获取step表单的初始数据选项 export function getStepData() { - return axios.get('/api/step/getdata'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/step/getdata`); } diff --git a/packages/toolkits/pro/template/tinyvue/src/api/interceptor.ts b/packages/toolkits/pro/template/tinyvue/src/api/interceptor.ts index 7601da09..02d84570 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/interceptor.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/interceptor.ts @@ -11,7 +11,7 @@ export interface HttpResponse { } const { VITE_API_BASE_URL, VITE_BASE_API, VITE_MOCK_IGNORE } = - import.meta.env || {}; + import.meta.env || {VITE_BASE_API:'', VITE_MOCK_IGNORE: ''}; if (VITE_API_BASE_URL) { axios.defaults.baseURL = VITE_API_BASE_URL; @@ -19,7 +19,7 @@ if (VITE_API_BASE_URL) { const ignoreMockApiList = VITE_MOCK_IGNORE?.split(',') || []; axios.interceptors.request.use( - (config: AxiosRequestConfig) => { + (config: AxiosRequestConfig): any => { const isProxy = ignoreMockApiList.includes(config.url); if (isProxy) { config.url = config.url?.replace(VITE_BASE_API, '/api/v1'); @@ -33,7 +33,7 @@ axios.interceptors.request.use( config.headers.Authorization = `Bearer ${token}`; } - config.headers = { ...config.headers }; + config.headers = { ...config.headers }; return config; }, @@ -49,6 +49,7 @@ axios.interceptors.response.use( return res; }, (error) => { + console.log(error) const { status, data } = error.response; if (status === 401) { clearToken(); diff --git a/packages/toolkits/pro/template/tinyvue/src/api/list.ts b/packages/toolkits/pro/template/tinyvue/src/api/list.ts index 2b714115..b82c4bb0 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/list.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/list.ts @@ -7,7 +7,7 @@ export interface QueryTaskParmas { } export function queryEmployeeList(params: QueryTaskParmas) { - return axios.post('/api/employee/getEmployee', params); + return axios.post(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/employee/getEmployee`, params); } export function deleteEmployee(id: string) { return axios.delete(`/api/employee/delete?id=${id}`); diff --git a/packages/toolkits/pro/template/tinyvue/src/api/profile.ts b/packages/toolkits/pro/template/tinyvue/src/api/profile.ts index 5feef072..bdf3aedf 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/profile.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/profile.ts @@ -2,5 +2,5 @@ import axios from 'axios'; // 获取detail表单的初始数据选项 export function getDetailData() { - return axios.get('/api/detail/getdata'); + return axios.get(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/detail/getdata`); } diff --git a/packages/toolkits/pro/template/tinyvue/src/api/user.ts b/packages/toolkits/pro/template/tinyvue/src/api/user.ts index 8d502da5..7de89ba5 100644 --- a/packages/toolkits/pro/template/tinyvue/src/api/user.ts +++ b/packages/toolkits/pro/template/tinyvue/src/api/user.ts @@ -68,7 +68,7 @@ export function updateUserInfo(data: any) { } export function getUserData(data?: UserData) { - return axios.post('/api/user/data', data); + return axios.post(`${import.meta.env.VITE_MOCK_SERVER_HOST}/api/user/data`, data); } export function registerUser(data: any) { diff --git a/packages/toolkits/pro/template/tinyvue/src/main.ts b/packages/toolkits/pro/template/tinyvue/src/main.ts index 9648d873..4b2ce0b3 100644 --- a/packages/toolkits/pro/template/tinyvue/src/main.ts +++ b/packages/toolkits/pro/template/tinyvue/src/main.ts @@ -6,15 +6,12 @@ import router from './router'; import store from './store'; import i18n from './locale'; import directive from './directive'; -import { setupProdMockServer } from './mockProdServer'; -import './mock'; import App from './App.vue'; import '@/api/interceptor'; import '@/assets/style/global.less'; import config from '../hwc-exports.json'; import chinaMap from './assets/chaina.json'; -if(import.meta.env.VITE_USE_MOCK) setupProdMockServer(); registerMap('china', chinaMap as any); const app = createApp(App); diff --git a/packages/toolkits/pro/template/tinyvue/src/mock/board.ts b/packages/toolkits/pro/template/tinyvue/src/mock/board.ts index c11ffadd..d36d488e 100644 --- a/packages/toolkits/pro/template/tinyvue/src/mock/board.ts +++ b/packages/toolkits/pro/template/tinyvue/src/mock/board.ts @@ -1,6 +1,5 @@ -import { MockMethod } from 'vite-plugin-mock'; import Mock from 'mockjs'; -import { successResponseWrap } from '@/utils/setup-mock'; +import { successResponseWrap } from '../utils/setup-mock'; const initData = Mock.mock({ options: [ @@ -95,4 +94,4 @@ export default [ return result; }, }, -] as MockMethod[]; +] as any; diff --git a/packages/toolkits/pro/template/tinyvue/src/mock/index.ts b/packages/toolkits/pro/template/tinyvue/src/mock/index.ts index 57b5ee67..a99cfb91 100644 --- a/packages/toolkits/pro/template/tinyvue/src/mock/index.ts +++ b/packages/toolkits/pro/template/tinyvue/src/mock/index.ts @@ -1,9 +1,24 @@ -import user from './user'; +import {createMockServer} from '@gaonengwww/mock-server'; import list from './list'; import froms from '../views/form/step/mock'; import profile from './profile'; import board from './board'; -const index = [...user, ...list, ...froms, ...profile, ...board]; +let mockData = [] as any +for(let i=0; i { + response: (params: { body: any; }) => { const { pageIndex = 1, pageSize = 10 } = JSON.parse( JSON.stringify(params.body) ); @@ -49,4 +48,4 @@ export default [ return successResponseWrap(data); }, }, -] as MockMethod[]; +] as any; diff --git a/packages/toolkits/pro/template/tinyvue/src/mock/profile.ts b/packages/toolkits/pro/template/tinyvue/src/mock/profile.ts index 2227ba97..8d520ea3 100644 --- a/packages/toolkits/pro/template/tinyvue/src/mock/profile.ts +++ b/packages/toolkits/pro/template/tinyvue/src/mock/profile.ts @@ -1,6 +1,5 @@ -import { MockMethod } from 'vite-plugin-mock'; import Mock from 'mockjs'; -import { successResponseWrap } from '@/utils/setup-mock'; +import { successResponseWrap } from '../utils/setup-mock'; const initData = Mock.mock({ Project: [ @@ -62,4 +61,4 @@ export default [ return successResponseWrap(initData); }, }, -] as MockMethod[]; +] as any; diff --git a/packages/toolkits/pro/template/tinyvue/src/mock/user.ts b/packages/toolkits/pro/template/tinyvue/src/mock/user.ts index 9aeb4573..cadaf001 100644 --- a/packages/toolkits/pro/template/tinyvue/src/mock/user.ts +++ b/packages/toolkits/pro/template/tinyvue/src/mock/user.ts @@ -1,10 +1,9 @@ -import { MockMethod } from 'vite-plugin-mock'; import { successResponseWrap, failResponseWrap, initData, -} from '@/utils/setup-mock'; -import { isLogin } from '@/utils/auth'; +} from '../utils/setup-mock'; +import { isLogin } from '../utils/auth'; const positive = JSON.parse(JSON.stringify(initData.tableData)); const negative = JSON.parse(JSON.stringify(initData.tableData.reverse())); @@ -15,7 +14,7 @@ export default [ { url: '/api/user/register', method: 'post', - response: (params) => { + response: (params: { body: any; }) => { localStorage.setItem('registerUser', JSON.stringify(params.body)); return successResponseWrap({ ...userInfo, role: 'admin' }); }, @@ -57,7 +56,7 @@ export default [ { url: '/api/user/login', method: 'post', - response: (params) => { + response: (params: { body: any; }) => { const registerUser = JSON.parse( localStorage.getItem('registerUser') || '{}' ); @@ -145,4 +144,4 @@ export default [ return successResponseWrap(initData); }, }, -] as MockMethod[]; +] as any; diff --git a/packages/toolkits/pro/template/tinyvue/src/mockProdServer.ts b/packages/toolkits/pro/template/tinyvue/src/mockProdServer.ts deleted file mode 100644 index 6d3a2750..00000000 --- a/packages/toolkits/pro/template/tinyvue/src/mockProdServer.ts +++ /dev/null @@ -1,7 +0,0 @@ -// mockProdServer.ts -import { createProdMockServer } from 'vite-plugin-mock/es/createProdMockServer'; -import index from './mock/index'; - -export function setupProdMockServer() { - createProdMockServer([...index]); -} diff --git a/packages/toolkits/pro/template/tinyvue/src/router/index.ts b/packages/toolkits/pro/template/tinyvue/src/router/index.ts index 3c5505e3..90ed0b13 100644 --- a/packages/toolkits/pro/template/tinyvue/src/router/index.ts +++ b/packages/toolkits/pro/template/tinyvue/src/router/index.ts @@ -7,6 +7,8 @@ import createRouteGuard from './guard'; NProgress.configure({ showSpinner: false }); // NProgress Configuration + + const router = createRouter({ history: createWebHistory(), routes: [ diff --git a/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts b/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts index 3847507c..6b9d02a6 100644 --- a/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts +++ b/packages/toolkits/pro/template/tinyvue/src/store/modules/user/index.ts @@ -89,10 +89,10 @@ const useUserStore = defineStore('user', { id: userRes.data.id, name:userRes.data.name, email:userRes.data.email, - role:userRes.data.role[0].name, + role:'', department: userRes.data.department, employeeType: userRes.data.employeeType, - job: userRes.data.role[0].name, + job: '', probationStart: userRes.data.probationStart, probationEnd: userRes.data.probationEnd, probationDuration: userRes.data.probationDuration, @@ -101,6 +101,10 @@ const useUserStore = defineStore('user', { address: userRes.data.address, status: userRes.data.status, } + if(userRes.data.role){ + userInfo.role = userRes.data.role[0].name; + userInfo.job = userRes.data.role[0].name; + } this.setInfo(userInfo); } catch (err) { clearToken(); diff --git a/packages/toolkits/pro/template/tinyvue/src/views/form/step/mock.ts b/packages/toolkits/pro/template/tinyvue/src/views/form/step/mock.ts index 2973171c..676b8321 100644 --- a/packages/toolkits/pro/template/tinyvue/src/views/form/step/mock.ts +++ b/packages/toolkits/pro/template/tinyvue/src/views/form/step/mock.ts @@ -1,6 +1,5 @@ -import { MockMethod } from 'vite-plugin-mock'; import Mock from 'mockjs'; -import { successResponseWrap } from '@/utils/setup-mock'; +import { successResponseWrap } from '../../../utils/setup-mock'; const initBase = Mock.mock({ Project: [ @@ -116,4 +115,4 @@ export default [ return successResponseWrap('ok'); }, }, -] as MockMethod[]; +] as any; diff --git a/packages/toolkits/pro/template/tinyvue/tsconfig.json b/packages/toolkits/pro/template/tinyvue/tsconfig.json index c031db91..bf6e9d69 100644 --- a/packages/toolkits/pro/template/tinyvue/tsconfig.json +++ b/packages/toolkits/pro/template/tinyvue/tsconfig.json @@ -3,9 +3,9 @@ "target": "ES2020", "module": "ES2020", "moduleResolution": "node", - "strict": true, /* 启用所有严格的类型检查选项。 */ - "jsx": "preserve", /* 指定生成什么JSX代码*/ - "sourceMap": true, /* 为生成的JavaScript文件创建源映射文件*/ + "strict": false, + "jsx": "preserve", + "sourceMap": true, "resolveJsonModule": true, "esModuleInterop": true, "baseUrl": ".", @@ -13,9 +13,9 @@ "@/*": ["src/*"] }, "lib": ["es2020", "dom"], - "skipLibCheck": true, /* 跳过类型检查所有.d.ts文件 */ - "types": ["vite/client"] /* vite ts支持 */ + "skipLibCheck": true, + "types": ["vite/client"] }, "include": ["src/**/*", "src/**/*.vue"], - "exclude": ["node_modules"] + "exclude": ["node_modules"], } diff --git a/packages/toolkits/pro/template/tinyvue/webpack.config.js b/packages/toolkits/pro/template/tinyvue/webpack.config.js new file mode 100644 index 00000000..eb8659a1 --- /dev/null +++ b/packages/toolkits/pro/template/tinyvue/webpack.config.js @@ -0,0 +1,167 @@ +const {resolve} = require('path'); +const { VueLoaderPlugin } = require('vue-loader') +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const {DefinePlugin} = require('webpack'); +const {configDotenv,parse} = require('dotenv'); +configDotenv({ + path:'./.env' +}) +module.exports = { + mode: 'production', + entry: { + main: './src/main.ts' + }, + output: { + path: resolve(__dirname, 'dist'), // 打包后的文件输出的目录 + filename: `js/[name]_[chunkhash:8].js`, // 设置打包后的 js 文件名，如果在文件名前增加文件路径，会将打包后的 js 文件放在指定的文件夹下 + publicPath: '/' + }, + module: { + rules: [ + { + test: /\.vue$/, + loader: 'vue-loader' + }, + { + test: /\.css$/, + use: ['style-loader', 'css-loader'] + }, + { + test: /\.(ts)$/, + use: [ + { + loader: 'ts-loader', + options: { + appendTsSuffixTo: [/\.vue$/], + transpileOnly: true + }, + }, + { + loader: 'import-meta-loader', + options: { + } + }, + ], + exclude: /node_modules/, + }, + { + test: /\.less$/, + use: [ + 'style-loader', + 'css-loader', + 'less-loader', + { + loader: 'style-resources-loader', + options: { + patterns: resolve(__dirname,'src/assets/style/breakpoint.less') + } + } + ], + }, + { + test: /\.m?js/, + resolve: { + fullySpecified: false + } + }, + { + test:/.(png|jpg|jpeg|gif|svg)$/, // 匹配图片文件 + type: "asset", // type选择asset + parser: { + dataUrlCondition: { + maxSize: 10 * 1024, // 小于10kb转base64位 + } + }, + generator:{ + filename:'static/images/[name].[contenthash:8][ext]', // 文件输出目录和命名 + }, + }, + { + test:/.(woff2?|eot|ttf|otf)$/, // 匹配字体图标文件 + type: "asset", // type选择asset + parser: { + dataUrlCondition: { + maxSize: 10 * 1024, // 小于10kb转base64位 + } + }, + generator:{ + filename:'static/fonts/[name].[contenthash:8][ext]', // 文件输出目录和命名 + }, + }, + { + test:/.(mp4|webm|ogg|mp3|wav|flac|aac)$/, // 匹配媒体文件 + type: "asset", // type选择asset + parser: { + dataUrlCondition: { + maxSize: 10 * 1024, // 小于10kb转base64位 + } + }, + generator:{ + filename:'static/media/[name].[contenthash:8][ext]', // 文件输出目录和命名 + }, + }, + ] + }, + plugins: [ + new VueLoaderPlugin(), + new HtmlWebpackPlugin({ + template: resolve(__dirname, 'index.html'), + filename: 'index.html', + chunks: ['main'], + inject: true, + minify: { + html5: true, + collapseWhitespace: true, + preserveLineBreaks: false, + minifyCSS: true, + minifyJS: true, + removeComments: false + } + }), + new DefinePlugin({ + 'process.env': JSON.stringify({ ...process.env }), + 'import.meta.env': '""', + 'import.meta.env.VITE_CONTEXT': '"/vue-pro/"', + 'import.meta.env.VITE_BASE_API': '"/api"', + 'import.meta.env.VITE_SERVER_HOST': '"http://127.0.0.1:3000"', + 'import.meta.env.VITE_MOCK_HOST': '"http://127.0.0.1:8848"', + 'import.meta.env.VITE_USE_MOCK': 'false', + 'import.meta.env.VITE_MOCK_IGNORE': '"/api/user/userInfo,/api/user/login,/api/user/register,/api/employee/getEmployee"', + 'import.meta.env.VITE_MOCK_SERVER_HOST': '"/mock"', + + }) + ], + resolve: { + alias: { + '@': resolve(__dirname, 'src'), + 'assets': resolve(__dirname, 'src/assets'), + 'vue-i18n$': 'vue-i18n/dist/vue-i18n.esm-bundler.js', + 'vue$': 'vue/dist/vue.esm-bundler.js' + }, + extensions: ['.ts', '.js', '.vue'], + }, + cache: { + type: 'filesystem', + }, + devServer: { + historyApiFallback: true, + proxy:[ + { + context: [process.env.VITE_BASE_API], + target: process.env.VITE_SERVER_HOST, + changeOrigin: true, + pathRewrite: { + '^/api': '' + } + }, + { + context: [process.env.VITE_MOCK_SERVER_HOST], + target: process.env.VITE_MOCK_HOST, + changeOrigin: true, + pathRewrite:{ + '^/mock': '' + } + } + ] + } +}