vue.config.js的配置
const path = require('path')
const CompressionPlugin = require("compression-webpack-plugin")
const MomentLocalesPlugin = require('moment-locales-webpack-plugin')
const ProgressBarPlugin = require('progress-bar-webpack-plugin')
const chalk = require('chalk')
function resolve(dir) {
return path.join(__dirname, dir)
}
// vue.config.js
module.exports = {
/*
Vue-cli3:
Crashed when using Webpack `import()` #2463
https://github.com/vuejs/vue-cli/issues/2463
*/
// 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
//qiankuan打包时放开
//outputDir: "../dist/main",
// 多入口配置
// pages: {
// index: {
// entry: 'src/main.js',
// template: 'public/index.html',
// filename: 'index.html',
// }
// },
//打包app时放开该配置
publicPath: process.env.VUE_APP_STATIC_URL,
configureWebpack: config => {
//生产环境取消 console.log
if (process.env.NODE_ENV === 'production') {
config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true
// 不打包 tinymce
config.externals = {
"vxe-table": "vxeTable",
"vxe-table-plugin-antd": "vxeTablePluginAntd",
"xe-utils": "xeUtils",
}
// config.optimization = {
// splitChunks: {
// chunks: 'all',
// minSize: 0,
// minChunks: 1,
// cacheGroups: {
// vendors: {
// name: 'chunk-vendors',
// test: /[\\/]node_modules[\\/]/,
// priority: -10,
// reuseExistingChunk: true,
// chunks: 'all'
// },
// common: {
// name: 'chunk-common',
// minChunks: 2,
// priority: -20,
// reuseExistingChunk: true,
// chunks: 'all'
// },
// elementUI: {
// name: 'chunk-elementUI',
// priority: 20, // initial the weight needs to be larger than libs and app or it will be packaged into libs or app
// test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
// chunks: 'all'
// },
// echarts: {
// name: 'chunk-echarts',
// priority: 20,
// test: /[\\/]node_modules[\\/]_?echarts(.*)/,
// chunks: 'all'
// }
// // moment: {
// // priority: 20,
// // test: /[\\/]node_modules[\\/]_?moment(.*)/,
// // reuseExistingChunk: true
// // }
// }
// }
// }
}
// 使用绝对路径指明第三方模块存放的位置,以减少搜索步骤
// __diename 表示当前工作目录,也就是项目根目录
config.resolve.modules.unshift(resolve('node_modules'))
// 缩小查找后缀文件的范围
config.resolve.extensions = ['.js', '.vue', '.json']
// // mainFields设置尽量少的值,可以减少入口文件的搜索解析
// config.resolve.mainFields = ['main']
// 防止 webpack 解析那些任何与给定正则表达式相匹配的文件。忽略的文件中
// 不应该含有 import, require, define 的调用,或任何其他导入机制。忽略大型的 library 可以提高构建性能。
config.module.noParse = /^(vue|vue-router|vuex|vuex-router-sync|jquery|lodash|chartjs|echarts)$/
config.plugins.push(new ProgressBarPlugin({
format: ` :msg [:bar] ${chalk.green.bold(':percent')} (:elapsed s)`
}), new MomentLocalesPlugin({ localesToKeep: ['zh-cn'] }))
},
chainWebpack: (config) => {
config.resolve.alias
.set('@$', resolve('src'))
.set('@api', resolve('src/api'))
.set('@assets', resolve('src/assets'))
.set('@comp', resolve('src/components'))
.set('@views', resolve('src/views'))
//生产环境,开启js\css压缩
if (process.env.NODE_ENV === 'production') {
config.plugin('compressionPlugin').use(
new CompressionPlugin({
test: /\.(js|css|html)$/, // 匹配文件名
filename: '[path].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 1, // 压缩率小于1才会压缩
threshold: 10240,
deleteOriginalAssets: false //是否删除原文件
})
)
// config.plugin('compressionPlugin').use(new CompressionPlugin({
// test: /\.(js|css|less)$/, // 匹配文件名
// threshold: 10240, // 对超过10k的数据压缩
// deleteOriginalAssets: false // 不删除源文件
// }))
}
// 修改处理js
config.module.rule('js')
.test(/\.m?jsx?$/)
.use('babel-loader')
.loader('babel-loader')
.options({
cacheDirectory: true
})
.end()
.include
.add(resolve('src'))
.end()
.exclude
.add(resolve('node_modules'))
.end()
// 配置 webpack 识别 markdown 为普通的文件
config.module
.rule('markdown')
.test(/\.md$/)
.use()
.loader('file-loader')
.end()
// 编译vxe-table包里的es6代码,解决IE11兼容问题
config.module
.rule('vxe')
.test(/\.js$/)
.include
.add(resolve('node_modules/vxe-table'))
.add(resolve('node_modules/vxe-table-plugin-antd'))
.end()
.use('cache-loader')
.loader('cache-loader')
.options({
cacheDirectory: resolve('node_modules/.cache/babel-loader')
})
.end()
.use('babel-loader')
.loader('babel-loader')
.options({
cacheDirectory: true
})
.end()
},
css: {
loaderOptions: {
less: {
modifyVars: {
/* less 变量覆盖,用于自定义 ant design 主题 */
'primary-color': '#1890FF',
'link-color': '#1890FF',
'border-radius-base': '4px',
},
javascriptEnabled: true,
}
}
},
devServer: {
port: 3000,
// hot: true,
// disableHostCheck: true,
// overlay: {
// warnings: false,
// errors: true,
// },
// headers: {
// 'Access-Control-Allow-Origin': '*',
// },
proxy: {
/* '/api': {
target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro', //mock API接口系统
ws: false,
changeOrigin: true,
pathRewrite: {
'/jeecg-boot': '' //默认所有请求都加了jeecg-boot前缀,需要去掉
}
},*/
'/jeecg-boot': {
target: 'http://localhost:8080', //请求本地 需要jeecg-boot后台项目
ws: false,
changeOrigin: true
},
}
},
lintOnSave: undefined
}