最近在跟着webpack官方文檔練習,由于官方文檔并沒有及時更新,遇到了一些些問題,查了很多文檔…
這是我的一點小總結。
報錯資訊:
原因:
webpack在打包vue檔案時沒有成功轉換ES6的文法
解決辦法:
第一步:
加入babel-preset-es2015插件處理編譯問題
安裝依賴包:
$ npm install --save babel-preset-es2015
第二步:
webpack.config.js中加入代碼:
module: {
rules:[
{
test:/\.js$/,
loader:'babel-loader',
options:{
presets:['es2015']
}
}
]
}
第三步:
babelrc中配置:
{
"presets": [
[
"es2015",
{
"targets": {
"browsers": [
"> 1%",
"last 2 versions",
"not ie <= 8",
"iOS >= 6",
"safari >= 6",
"Firefox >= 20",
"Android > 4",
"android >= 4.4"
]
}
}
]
],
"plugins": ["transform-runtime"]
}
運作build後結果