當我們需要和後臺分離部署的時候，必須配置config/index.js:

用vue-cli 自動構建的目錄裡面  （環境變數及其基本變數的配置）

在'build'部分，我們有以下選項：

build.index

必須是本地檔案系統上的絕對路徑。

index.html (帶著插入的資源路徑) 會被生成。

如果你在後臺框架中使用此模板，你可以編輯index.html路徑指定到你的後臺程式生成的檔案。例如Rails程式，可以是app/views/layouts/application.html.erb，或者Laravel程式，可以是resources/views/index.blade.php。

build.assetsRoot

必須是本地檔案系統上的絕對路徑。

應該指向包含應用程式的所有靜態資產的根目錄。public/ 對應Rails/Laravel。

build.assetsSubDirectory

被webpack編譯處理過的資原始檔都會在這個build.assetsRoot

每次編譯前，這個目錄會被清空，所以這個只能放編譯出來的資原始檔。

static/目錄的檔案會直接被在構建過程中，直接拷貝到這個目錄。這意味著是如果你改變這個規則，所有你依賴於static/中檔案的絕對地址，都需要改變。

build.assetsPublicPath【資源的根目錄】

這個是通過http伺服器執行的url路徑。在大多數情況下，這個是根目錄(/)。如果你的後臺框架對靜態資源url字首要求，你僅需要改變這個引數。在內部，這個是被webpack當做output.publicPath來處理的。

後臺有要求的話一般要加上./ 或者根據具體目錄新增，不然引用不到靜態資源

build.productionSourceMap

在構建生產環境版本時是否開啟source map。

dev.port

開發伺服器監聽的特定埠

dev.proxyTable

定義開發伺服器的代理規則。

 專案中配置的config/index.js，有dev和production兩種環境的配置 以下介紹的是production環境下的webpack配置的理解

 1 var path = require('path')
 2 
 3 module.exports = {
 4   build: { // production 環境
 5     env: require('./prod.env'), // 使用 config/prod.env.js 中定義的編譯環境
 6     index: path.resolve(__dirname, '../dist/index.html'), // 編譯輸入的 index.html 檔案
 7     assetsRoot: path.resolve(__dirname, '../dist'), // 編譯輸出的靜態資源路徑
 8     assetsSubDirectory: 'static', // 編譯輸出的二級目錄
 9     assetsPublicPath: '/', // 編譯釋出的根目錄，可配置為資源伺服器域名或 CDN 域名
10     productionSourceMap: true, // 是否開啟 cssSourceMap
11     // Gzip off by default as many popular static hosts such as
12     // Surge or Netlify already gzip all static assets for you.
13     // Before setting to `true`, make sure to:
14     // npm install --save-dev compression-webpack-plugin
15     productionGzip: false, // 是否開啟 gzip
16     productionGzipExtensions: ['js', 'css'] // 需要使用 gzip 壓縮的副檔名
17   },
18   dev: { // dev 環境
19     env: require('./dev.env'), // 使用 config/dev.env.js 中定義的編譯環境
20     port: 8080, // 執行測試頁面的埠
21     assetsSubDirectory: 'static', // 編譯輸出的二級目錄
22     assetsPublicPath: '/', // 編譯釋出的根目錄，可配置為資源伺服器域名或 CDN 域名
23     proxyTable: {}, // 需要 proxyTable 代理的介面（可跨域）
24     // CSS Sourcemaps off by default because relative paths are "buggy"
25     // with this option, according to the CSS-Loader README
26     // (https://github.com/webpack/css-loader#sourcemaps)
27     // In our experience, they generally work as expected,
28     // just be aware of this issue when enabling this option.
29     cssSourceMap: false // 是否開啟 cssSourceMap
30   }
31 }

下面是vue中的build/webpack.base.conf.js