vue.config.js 配置参考

// vue.config.js
module.exports = {

  <!--所有的資源都會被鏈接為相對路徑, 此屬性相當於2.x中的 assetsPublicPath-->
  publicPath: './',

  <!--生產環境構建文件的目錄-->
  outputDir: 'dist', 

  <!--放置生成的靜態資源 (js、css、img、fonts) 的 (相對於 outputDir 的) 目錄。-->
  assetsDir: 'static', 

  <!--是否在開發環境下通過 eslint-loader 在每次保存時 lint 代碼。-->
  <!--這個值會在 @vue/cli-plugin-eslint 被安裝之後生效。-->
  lintOnSave: process.env.NODE_ENV === 'development',

  <!--如果你不需要生產環境的 source map，可以將其設置為 false 以加速生產環境構建。-->
  productionSourceMap: false, 

  <!--所有 webpack-dev-server 的選項-->
  devServer:{
    <!--端口號-->
    port: process.env.port || 9527,

    <!--dev-server在服務器啟動後打開默認瀏覽器-->
    open: true，

    <!--出現編譯器錯誤或警告時，在瀏覽器中顯示全屏覆蓋。-->
    overlay: {
      <!--不顯示警告-->
      warnings: false,

      <!--顯示錯誤-->
      errors: true
    },

    <!--如果你的前端應用和後端 API 服務器沒有運行在同一個主機上，
    你需要在開發環境下將 API 請求代理到 API 服務器。-->
    proxy: {
      '/api': {
        target: 'http:www.baidu.com', // 要代理的API地址
        changeOrigin: true, // 允許跨域
        pathRewrite: {
            <!--這裡理解成用'/api'代替target裡面的地址，後面組件中我們掉接口時直接用api代替--> 
            <!--比如我要調用'http://www.abc.com/user/add'，直接寫'/api/user/add'即可'-->
            '^/api' : ''
        }
      },
      '/foo': {
        target: '<other_url>'
        ......
      }
    }
  },
  configureWebpack: {
    name: name,
    resolve: {
      <!--設置別名-->
      alias: {
        '@': resolve('src')
      }
    }
  }
}

Vue CLI3.x 配置指南
vue-cli3.0入门-配置vue.config.js和优化
publicPath
devServer.before