vuecli3.x config

module.exports = {

  // 基本路徑
  baseUrl: process.env.NODE_ENV === 'production'
    ? '/'
    : '/',
  // 輸出文件目錄
  outputDir: 'dist', // 默認dist
  // 用於嵌套生成的靜態資產（js,css,img,fonts）目錄
  // assetsDir: '',
  // 指定生成的 index.html 的輸出路徑 (相對於 outputDir)。也能夠是一個絕對路徑
  indexPath: 'index.html', // Default: 'index.html'
  filenameHashing: true,
  // 構建多頁時使用
  pages: undefined,
  // eslint-loader是否在保存的時候檢查
  lintOnSave: true,
  // 是否使用包含運行時編譯器的Vue核心的構建
  runtimeCompiler: false,
  // 默認狀況下 babel-loader 會忽略全部 node_modules 中的文件。若是你想要經過 Babel 顯式轉譯一個依賴，能夠在這個選項中列出來
  transpileDependencies: [],
  // 若是你不須要生產環境的 source map，能夠將其設置爲 false 以加速生產環境構建。
  productionSourceMap: false,
  // 若是這個值是一個對象，則會經過 webpack-merge 合併到最終的配置中。若是這個值是一個函數，則會接收被解析的配置做爲參數。該函數及能夠修改配置並不返回任何東西，也能夠返回一個被克隆或合併過的配置版本。
  configureWebpack: config => {
    if (process.env.NODE_ENV === 'production') {
      // 爲生產環境修改配置...
    } else {
      // 爲開發環境修改配置...
    }
  },
  // 是一個函數，會接收一個基於 webpack-chain 的 ChainableConfig 實例。容許對內部的 webpack 配置進行更細粒度的修改。
  chainWebpack: config => {
    /*config.module
      .rule('images')
      .use('url-loader')
        .loader('url-loader')
        .tap(options => {
          // 修改它的選項...
          return options
        })*/
  },
  // css相關配置
  css: {
    // 啓用 CSS modules
    modules: false,
    // 是否使用css分離插件
    extract: true,
    // 開啓 CSS source maps?
    sourceMap: false,
    // css預設器配置項
    loaderOptions: {},
  },
  // webpack-dev-server 相關配置
  devServer: {
    host: '0.0.0.0',
    port: 8080,
    https: false,
    open: true,
    hotOnly: false,
    proxy: null, // 設置代理
    before: app => {},
  },
  // PWA 插件相關配置
  pwa: {},
  // 第三方插件配置
  pluginOptions: {
  // ...
  }
}