| 提交 | 用户 | 时间 | ||
| a6316e | 1 | 'use strict' |
| A | 2 | const path = require('path') |
| 3 | ||
| 4 | function resolve(dir) { | |
| 5 | return path.join(__dirname, dir) | |
| 6 | } | |
| 7 | ||
| 8 | const CompressionPlugin = require('compression-webpack-plugin') | |
| 9 | ||
| 10 | const name = process.env.VUE_APP_TITLE || 'BillionMes管理系统' // 网页标题 | |
| 11 | ||
| 12 | const port = process.env.port || process.env.npm_config_port || 80 // 端口 | |
| 13 | ||
| 14 | // vue.config.js 配置说明 | |
| 15 | //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions | |
| 16 | // 这里只列一部分，具体配置参考文档 | |
| 17 | module.exports = { | |
| 18 | // 部署生产环境和开发环境下的URL。 | |
| 19 | // 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上 | |
| 20 | // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。 | |
| 21 | publicPath: process.env.NODE_ENV === "production" ? "/" : "/", | |
| 22 | // 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist） | |
| 23 | outputDir: 'dist', | |
| 24 | // 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下） | |
| 25 | assetsDir: 'static', | |
| 26 | // 是否开启eslint保存检测，有效值：ture | false | 'error' | |
| 27 | lintOnSave: process.env.NODE_ENV === 'development', | |
| 28 | // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。 | |
| 29 | productionSourceMap: false, | |
| 30 | transpileDependencies: ['quill'], | |
| 31 | // webpack-dev-server 相关配置 | |
| 32 | devServer: { | |
| 33 | host: '0.0.0.0', | |
| 34 | port: port, | |
| 35 | open: true, | |
| 36 | proxy: { | |
| 37 | // detail: https://cli.vuejs.org/config/#devserver-proxy | |
| 38 | [process.env.VUE_APP_BASE_API]: { | |
| 8b3c4b | 39 | target: `http://localhost:8083`, |
| a6316e | 40 | changeOrigin: true, |
| A | 41 | pathRewrite: { |
| 42 | ['^' + process.env.VUE_APP_BASE_API]: '' | |
| 43 | } | |
| 44 | } | |
| 45 | }, | |
| 46 | disableHostCheck: true | |
| 47 | }, | |
| 48 | css: { | |
| 49 | loaderOptions: { | |
| 50 | sass: { | |
| 51 | sassOptions: { outputStyle: "expanded" } | |
| 52 | } | |
| 53 | } | |
| 54 | }, | |
| 55 | configureWebpack: { | |
| 56 | name: name, | |
| 57 | resolve: { | |
| 58 | alias: { | |
| 59 | '@': resolve('src') | |
| 60 | } | |
| 61 | }, | |
| 62 | plugins: [ | |
| 63 | // http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件 | |
| 64 | new CompressionPlugin({ | |
| 65 | cache: false, // 不启用文件缓存 | |
| 66 | test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式 | |
| 67 | filename: '[path][base].gz[query]', // 压缩后的文件名 | |
| 68 | algorithm: 'gzip', // 使用gzip压缩 | |
| 69 | minRatio: 0.8, // 压缩比例，小于 80% 的文件不会被压缩 | |
| 70 | deleteOriginalAssets: false // 压缩后删除原文件 | |
| 71 | }) | |
| 72 | ], | |
| 73 | }, | |
| 74 | chainWebpack(config) { | |
| 75 | config.plugins.delete('preload') // TODO: need test | |
| 76 | config.plugins.delete('prefetch') // TODO: need test | |
| 77 | ||
| 78 | // set svg-sprite-loader | |
| 79 | config.module | |
| 80 | .rule('svg') | |
| 81 | .exclude.add(resolve('src/assets/icons')) | |
| 82 | .end() | |
| 83 | config.module | |
| 84 | .rule('icons') | |
| 85 | .test(/\.svg$/) | |
| 86 | .include.add(resolve('src/assets/icons')) | |
| 87 | .end() | |
| 88 | .use('svg-sprite-loader') | |
| 89 | .loader('svg-sprite-loader') | |
| 90 | .options({ | |
| 91 | symbolId: 'icon-[name]' | |
| 92 | }) | |
| 93 | .end() | |
| 94 | ||
| 95 | config.when(process.env.NODE_ENV !== 'development', config => { | |
| 96 | config | |
| 97 | .plugin('ScriptExtHtmlWebpackPlugin') | |
| 98 | .after('html') | |
| 99 | .use('script-ext-html-webpack-plugin', [{ | |
| 100 | // `runtime` must same as runtimeChunk name. default is `runtime` | |
| 101 | inline: /runtime\..*\.js$/ | |
| 102 | }]) | |
| 103 | .end() | |
| 104 | ||
| 105 | config.optimization.splitChunks({ | |
| 106 | chunks: 'all', | |
| 107 | cacheGroups: { | |
| 108 | libs: { | |
| 109 | name: 'chunk-libs', | |
| 110 | test: /[\\/]node_modules[\\/]/, | |
| 111 | priority: 10, | |
| 112 | chunks: 'initial' // only package third parties that are initially dependent | |
| 113 | }, | |
| 114 | elementUI: { | |
| 115 | name: 'chunk-elementUI', // split elementUI into a single package | |
| 116 | test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm | |
| 117 | priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app | |
| 118 | }, | |
| 119 | commons: { | |
| 120 | name: 'chunk-commons', | |
| 121 | test: resolve('src/components'), // can customize your rules | |
| 122 | minChunks: 3, // minimum common number | |
| 123 | priority: 5, | |
| 124 | reuseExistingChunk: true | |
| 125 | } | |
| 126 | } | |
| 127 | }) | |
| 128 | config.optimization.runtimeChunk('single') | |
| 129 | }) | |
| 130 | } | |
| 131 | } | |
