记录一下我遇到过得vue.config.js配置项,以及过后用到它们的起因。
publicPath
module.exports = { publicPath: process.env.NODE_ENV === 'production' ? '/vue/' : '/',}
如果你的域名为 https://www.iicoom.top,如果生成环境 https://www.iicoom.top/ 这个门路曾经被其余我的项目占用,想要从
https://www.iicoom.top/vue/ 这个门路拜访,那么进行下面的配置就能够实现。
configureWebpack
remove log
平时我的项目开发调试的时候免不了会有一些调试,打印一些log。当我的项目上线时去手动移除这些log可能是比拟麻烦的事件,有了上面这个配置,当咱们应用
npm run build// oryarn build
之后,编译后的代码部署到线上环境,关上控制台就是清清爽爽的样子。
module.exports = { configureWebpack: config => { // 生产环境勾销 console.log if (process.env.NODE_ENV === 'production') { config.optimization.minimizer[0].options.terserOptions.compress.warnings = false config.optimization.minimizer[0].options.terserOptions.compress.drop_console = true config.optimization.minimizer[0].options.terserOptions.compress.drop_debugger = true config.optimization.minimizer[0].options.terserOptions.compress.pure_funcs = ['console.log'] } }}
resolve
过后我的项目中引入了一个富文本编辑器,叫 summernote。它依赖 bootstrap 和 jQuery,装置依赖后依然提醒 jquery 没有装置,于是进行了上面的配置,问题解决。
const path = require('path');module.exports = { // 选项... configureWebpack: { resolve: { alias: { 'jquery': path.resolve(__dirname, './node_modules/jquery/src/jquery'), 'jQuery': path.resolve(__dirname, './node_modules/jquery/src/jquery') } } }}