Vue-cli3 webpack配置 vue.config.js （基础版本+进阶版本）_Eirice的博客

一：基础版本 不需要多于插件优化，可以提供基础配置服务即可 开箱即用

const path = require('path')
const isPro = process.env.NODE_ENV === 'production'   //环境标识
const resolve = dir => {
  return path.join(__dirname, dir)            
}

module.exports = {
  // 基本路径
  publicPath: './',
  // 打包输出文件目录
  outputDir: 'dist',
  // 打包静态资源目录 (js, css, img, fonts)
  assetsDir: 'assets',
  // index.html 输出路径
  indexPath: 'index.html',
  // 保存时检查代码
  lintOnSave: !isPro,
  // 生产环境 source map
  productionSourceMap: false,
  // webpack 链式操作
  chainWebpack: config => {
    config.resolve.alias
      .set('@', resolve('src'))
      .set('_view', resolve('src/views'))      //每个模块的vue页面
      .set('_com', resolve('src/components'))   //可以公用的子组件页面
      .set('_api', resolve('src/api'))    //不同模块放到对应的js中
      .set('_util', resolve('src/utils'))   //一些公用的方法
  },
  // webpack-dev-server 相关配置
  devServer: {
    open: false, // 自动打开浏览器
    host: '0.0.0.0',
    port: 8082,
    https: false,
    historyApiFallback: {
      index: '/index.html'
    },
    // 提供在服务器内部的其他中间件之前执行自定义中间件的能力
    before: app => {
    },
    overlay: {
      warnings: true,
      errors: true
    }
  }
}
con