记录一下我遇到过得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')            }        }    }}