跨域處理暫時先只介紹用proxy解決跨域問題，先上代碼：
devServer:{ //開發服務器配置
...
proxy: {
'/api': {
target: 'http://www.xxx.com',
pathRewrite: {
'^/api': ''//需要rewrite重寫
}
},
}
...
},
代理的意思是，遇到/api開頭的接口則向http://www.xxx.com服務器上去找，這個/api地方可以是任意其他前端自己拼在后端給的實際接口前面，根據實際情況進行rewrite重寫即可。
舉個例子：后端給的接口是/api/user,則此時的重寫應該不變：
pathRewrite: {
'^/api': '/api'
}
最終請求后臺是http://www.xxx.com/api/user
如果后端給的接口是/user,前端可以在接口的前面自己拼一個/api,則此時的重寫應該是這樣：
pathRewrite: {
'^/api': ''
}
最終請求后臺是http://www.xxx.com/user
自己拼上的，最終要rewrite掉。
resolve:
配置模塊如何解析。例如，當在 ES2015 中調用 import 'lodash'，resolve 選項能夠對 webpack 查找 'lodash' 的方式去做修改。列幾個比較常用的選項：
module.exports = {
...
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'@': path.resolve(__dirname,'./src'),
},
modules:['node_modules'],
mainFields: ['browser', 'module', 'main']
}
...
}
alias：
創建 import 或 require 的別名，來確保模塊引入變得更簡單。如果之前這樣寫：
import validate from '../../src/validate'
現在可以這樣寫：
import validate from '@/validate'
@符就代表了src的路徑。
也可以在給定對象的鍵后的末尾添加 $，以表示精準匹配：
alias: {
xyz$: path.resolve(__dirname, 'path/to/file.js')
}
這將產生以下結果：
import Test1 from 'xyz'; // 精確匹配，所以 path/to/file.js 被解析和導入
import Test2 from 'xyz/file.js'; // 非精確匹配，觸發普通解析
mainFields：
當從 npm 包中導入模塊時,此選項將決定在package.json(導入模塊中的) 中使用哪個字段導入模塊。
例如，考慮任意一個名為 upstream 的 library，其 package.json 包含以下字段：
{
"browser": "build/upstream.js",
"module": "index"
}
在我們 import * as Upstream from 'upstream' 時，這實際上會從 browser 屬性解析文件。在這里 browser 屬性是最優先選擇的，因為它是 mainFields 的第一項。同時，由 webpack 打包的 Node.js 應用程序首先會嘗試從 module 字段中解析文件。
extensions:
這個選項是擴展名的意思，用來解決省略后綴名的，默認值：
module.exports = {
//...
resolve: {
extensions: ['.wasm', '.mjs', '.js', '.json']
}
};
比如當你寫vue，引用一個vue組件import xxx from '@/components/Header'不帶后綴名，則可以這樣配置：
module.exports = {
//...
resolve: {
extensions: ['.js','.css' ,'.json','.vue']
}
};
按照順序依次解析。
modules：
告訴 webpack 解析模塊時應該搜索的目錄。不加這個選項的話，webpack會一直向上搜索。
