diff --git a/packages/toolkits/pro/template/tinyvue/package.json b/packages/toolkits/pro/template/tinyvue/package.json index 4eb7634d..78a95284 100644 --- a/packages/toolkits/pro/template/tinyvue/package.json +++ b/packages/toolkits/pro/template/tinyvue/package.json @@ -10,6 +10,8 @@ "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", + "dev:rp": "rspack serve", + "build:rp": "rspack build", "report": "cross-env REPORT=true npm run build", "lint-staged": "npx lint-staged", "prepare": "git init && husky install", @@ -56,13 +58,16 @@ "vue": "^3.3.7", "vue-eslint-parser": "^9.3.2", "vue-i18n": "^9.6.2", - "vue-router": "^4.2.5" + "vue-router": "^4.2.5", + "vue-style-loader": "^4.1.3" }, "devDependencies": { "@babel/preset-env": "^7.25.3", "@babel/preset-typescript": "^7.24.7", "@commitlint/cli": "^11.0.0", "@commitlint/config-conventional": "^12.0.1", + "@rspack/cli": "^0.7.5", + "@rspack/core": "^0.7.5", "@types/lodash": "^4.14.177", "@types/nprogress": "^0.2.0", "@typescript-eslint/eslint-plugin": "^5.10.0", diff --git a/packages/toolkits/pro/template/tinyvue/rspack.config.js b/packages/toolkits/pro/template/tinyvue/rspack.config.js new file mode 100644 index 00000000..c0e1c721 --- /dev/null +++ b/packages/toolkits/pro/template/tinyvue/rspack.config.js @@ -0,0 +1,155 @@ +const {resolve} = require('path'); +const { VueLoaderPlugin } = require('vue-loader') +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const rspack = require('@rspack/core'); +const {configDotenv,parse} = require('dotenv'); +const { default: importMetaLoader } = require('import-meta-loader'); +configDotenv({ + path:'./.env' +}) + +/** @type {import('@rspack/cli').Configuration} */ +const config = { + context: __dirname, + entry: { + main: './src/main.ts', + }, + experiments: { + css: true + }, + plugins:[ + new VueLoaderPlugin(), + new rspack.HtmlRspackPlugin({ + template: './index.html', + }), + new rspack.DefinePlugin({ + __VUE_OPTIONS_API__: JSON.stringify(true), + __VUE_PROD_DEVTOOLS__: JSON.stringify(false), + '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"', + }) + ], + 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': '' + } + } + ] + }, + module: { + rules: [ + { + test: /\.vue$/, + loader: 'vue-loader', + options: { + experimentalInlineMatchResource: true, + }, + }, + { + test: /\.ts$/, + loader: 'builtin:swc-loader', + options: { + sourceMap: true, + jsc: { + parser: { + syntax: 'typescript', + }, + }, + }, + type: 'javascript/auto', + }, + { + test: /\.less$/, + loader: 'less-loader', + type: 'css', + }, + { + test: /\.svg$/, + type: 'asset/resource', + }, + { + test: /\.m?js/, + resolve: { + fullySpecified: false + } + }, + { + test: /\.less$/, + use: [ + { + loader: 'less-loader', + options:{ + additionalData: `@import "${resolve('./src/assets/style/breakpoint.less')}";` + } + }, + ], + type: "css" + }, + { + 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]', // 文件输出目录和命名 + }, + }, + ], + }, + 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'], + }, +} +module.exports = config; diff --git a/packages/toolkits/pro/template/tinyvue/src/router/guard/menu.ts b/packages/toolkits/pro/template/tinyvue/src/router/guard/menu.ts index a8b904ef..9a0f0d58 100644 --- a/packages/toolkits/pro/template/tinyvue/src/router/guard/menu.ts +++ b/packages/toolkits/pro/template/tinyvue/src/router/guard/menu.ts @@ -24,9 +24,9 @@ export interface ITreeNodeData { // 国际化 locale: string; } - -const views = import.meta.glob('../../views/**/*.vue'); - +const reg = /\.vue$/gim; +const views = import.meta.glob ? import.meta.glob('../../views/**/*.vue') : require.context('../../views', true, reg, 'sync'); +console.log(views) const toRoutes = (menus: ITreeNodeData[]) => { const router: RouteRecordRaw[] = []; for (let i=0;i { diff --git a/packages/toolkits/pro/template/tinyvue/src/views/login/components/login-mail.vue b/packages/toolkits/pro/template/tinyvue/src/views/login/components/login-mail.vue index 30523d42..40d82744 100644 --- a/packages/toolkits/pro/template/tinyvue/src/views/login/components/login-mail.vue +++ b/packages/toolkits/pro/template/tinyvue/src/views/login/components/login-mail.vue @@ -77,8 +77,6 @@ const userStore = useUserStore(); const loginFormMail = ref(); - const views = import.meta.glob('../../**/*.vue'); - const rules = computed(() => { return { mailname: [ diff --git a/packages/toolkits/pro/template/tinyvue/webpack.config.js b/packages/toolkits/pro/template/tinyvue/webpack.config.js index eb8659a1..260614df 100644 --- a/packages/toolkits/pro/template/tinyvue/webpack.config.js +++ b/packages/toolkits/pro/template/tinyvue/webpack.config.js @@ -128,7 +128,6 @@ module.exports = { '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: {