From 3bf6028aee54fe6ae01e57143623fc4d3ed95a8a Mon Sep 17 00:00:00 2001 From: From-wh Date: Mon, 31 Mar 2025 10:06:25 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E9=85=8D?= =?UTF-8?q?=E7=BD=AE=E6=96=87=E4=BB=B6=E5=92=8C=E6=A0=B7=E5=BC=8F=E4=BB=A3?= =?UTF-8?q?=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除App.vue中未使用的CSS动画代码 - 重构vue.config.js，简化配置逻辑并优化生产环境构建 --- template/admin/src/App.vue | 26 ------- template/admin/vue.config.js | 143 +++++++++++++++-------------------- 2 files changed, 61 insertions(+), 108 deletions(-) diff --git a/template/admin/src/App.vue b/template/admin/src/App.vue index 48a2fcf89..de9ab3b46 100644 --- a/template/admin/src/App.vue +++ b/template/admin/src/App.vue @@ -133,32 +133,6 @@ body { height: 100%; font-family: PingFang SC, Arial, Microsoft YaHei, sans-serif; } -// .dialog-fade-enter-active { -// animation: anim-open 0.3s; -// } -// .dialog-fade-leave-active { -// animation: anim-close 0.3s; -// } -// @keyframes anim-open { -// 0% { -// transform: translate3d(100%, 0, 0); -// opacity: 0; -// } -// 100% { -// transform: translate3d(0, 0, 0); -// opacity: 1; -// } -// } -// @keyframes anim-close { -// 0% { -// transform: translate3d(0, 0, 0); -// opacity: 1; -// } -// 100% { -// transform: translate3d(100%, 0, 0); -// opacity: 0; -// } -// } .ivu-modal-wrap ::v-deep .connect_customerServer_img { display: none; } diff --git a/template/admin/vue.config.js b/template/admin/vue.config.js index 2d8598557..4b215a518 100644 --- a/template/admin/vue.config.js +++ b/template/admin/vue.config.js @@ -1,107 +1,86 @@ const path = require('path'); const Setting = require('./src/setting.env'); -// 引入js打包工具 const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); - const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); -const resolve = (dir) => { - return path.join(__dirname, dir); -}; -// 项目部署基础 -// 默认情况下，我们假设你的应用将被部署在域的根目录下, -// 例如：https://www.my-app.com/ -// 默认：'/' -// 如果您的应用程序部署在子路径中，则需要在这指定子路径 -// 例如：https://www.foobar.com/my-app/ -// 需要将它改为'/my-app/' -// iview-admin线上演示打包路径： https://file.iviewui.com/admin-dist/ -const BASE_URL = process.env.NODE_ENV === 'production' ? '/' : '/'; -const env = process.env.NODE_ENV; +// 路径解析辅助函数 +const resolve = (dir) => path.join(__dirname, dir); + +// 环境变量 +const isProd = process.env.NODE_ENV === 'production'; module.exports = { - // Project deployment base - // By default we assume your app will be deployed at the root of a domain, - // e.g. https://www.my-app.com/ - // If your app is deployed at a sub-path, you will need to specify that - // sub-path here. For example, if your app is deployed at - // https://www.foobar.com/my-app/ - // then change this to '/my-app/' + // 基础配置 outputDir: Setting.outputDir, runtimeCompiler: true, - productionSourceMap: false, //关闭生产环境下的SourceMap映射文件 - baseUrl: BASE_URL, - // tweak internal webpack configuration. - // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md - // 如果你不需要使用eslint，把lintOnSave设为false即可 + productionSourceMap: false, // 关闭生产环境下的SourceMap映射文件 + publicPath: '/admin', + assetsDir: 'system_static', + indexPath: 'index.html', lintOnSave: false, - // 打包优化 + // 开发服务器配置 + devServer: { + port: 1617, + }, + // webpack配置 configureWebpack: (config) => { - const pluginsPro = []; - pluginsPro.push( - // js文件压缩 - new UglifyJsPlugin({ - uglifyOptions: { - compress: { - drop_debugger: true, - drop_console: true, //生产环境自动删除console - pure_funcs: ['console.log'], //移除console + // 生产环境特定配置 + if (isProd) { + // JS文件压缩配置 + config.plugins.push( + new UglifyJsPlugin({ + uglifyOptions: { + compress: { + drop_debugger: true, + drop_console: true, // 生产环境自动删除console + pure_funcs: ['console.log'], // 移除console.log + }, + }, + sourceMap: false, + parallel: true, // 使用多进程并行运行来提高构建速度 + }), + ); + // 代码分割配置（已注释，如需启用可取消注释） + /* + config.optimization = { + runtimeChunk: 'single', + splitChunks: { + chunks: 'all', + maxInitialRequests: Infinity, + minSize: 20000, + cacheGroups: { + vendor: { + test: /[\\/]node_modules[\\/]/, + name(module) { + const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1]; + return `npm.${packageName.replace('@', '')}`; + }, + }, }, }, - sourceMap: false, - parallel: true, //使用多进程并行运行来提高构建速度。默认并发运行数：os.cpus().length - 1。 - }), - ); - if (process.env.NODE_ENV === 'production') { - config.plugins = [...config.plugins, ...pluginsPro]; - } - if (process.env.NODE_ENV === 'production') { - // 开启分离js - // config.optimization = { - // runtimeChunk: 'single', - // splitChunks: { - // chunks: 'all', - // maxInitialRequests: Infinity, - // minSize: 20000, - // cacheGroups: { - // vendor: { - // test: /[\\/]node_modules[\\/]/, - // name(module) { - // // get the name. E.g. node_modules/packageName/not/this/part.js - // // or node_modules/packageName - // const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1]; - // // npm package names are URL-safe, but some servers don't like @ symbols - // return `npm.${packageName.replace('@', '')}`; - // }, - // }, - // }, - // }, - // }; + }; + */ } }, + + // webpack链式配置 chainWebpack: (config) => { + // 删除预加载 config.plugins.delete('prefetch'); - config.resolve.alias - .set('@', resolve('src')) // key,value自行定义，比如.set('@@', resolve('src/components')) - .set('_c', resolve('src/components')); + + // 设置路径别名 + config.resolve.alias.set('@', resolve('src')).set('_c', resolve('src/components')).set('@api', resolve('src/api')); + + // Vue文件规则配置 config.module .rule('vue') .test(/\.vue$/) .end(); - // 重新设置 alias - config.resolve.alias.set('@api', resolve('src/api')); - // node + + // Node配置 config.node.set('__dirname', true).set('__filename', true); + + // Monaco编辑器插件 config.plugin('monaco').use(new MonacoWebpackPlugin()); }, - - // 设为false打包时不生成.map文件 - productionSourceMap: false, - // 这里写你调用接口的基础路径，来解决跨域，如果设置了代理，那你本地开发环境的axios的baseUrl要写为 '' ，即空字符串 - devServer: { - port: 1617, // 端口 - }, - publicPath: '/admin', - assetsDir: 'system_static', - indexPath: 'index.html', };