vuex2中使用mapMutations/mapActions報錯解決方法 BabelLoaderError: SyntaxError: Unexpected token
阿新 • • 發佈：2017-10-31
int cte 使用 gin ets lin ade vue 編譯 在嘗鮮vuex2時，發現vuex2增加了 mapGetters 和 mapActions 的方法，借助stage2的 Object Rest Operator 特性,可以寫出下面代碼：
methods: {
marked,
...mapActions([
‘getArticles‘
])
}
但是在借助babel編譯轉換時發生了報錯： BabelLoaderError: SyntaxError: Unexpected token 。
解決方案
在vuex的repo issues中有人提過這樣的問題，後來是修改了eslint配置中對 Object Rest Operator 的支持解決了問題，然而我根本沒有使用eslint。
接著在babel的issues中搜索這樣的報錯，原來是我babel預置的轉換器是 babel-preset-es2015 ，並不能轉換 Object Rest Operator 特性。
解決方法很簡單了，可以安裝整個stage2的預置器或者安裝 Object Rest Operator 的babel插件 babel-plugin-transform-object-rest-spread 。
我選擇了安裝插件，接著在babel的配置文件 .babelrc 中應用插件：
{
"presets": [
["es2015", { "modules": false }]
],
"plugins": ["transform-object-rest-spread"]
} 或者
重啟webpack，就不會再有報錯了。
methods: {
marked,
...mapActions([
‘getArticles‘
])
}
但是在借助babel編譯轉換時發生了報錯： BabelLoaderError: SyntaxError: Unexpected token 。
解決方案
在vuex的repo issues中有人提過這樣的問題，後來是修改了eslint配置中對 Object Rest Operator 的支持解決了問題，然而我根本沒有使用eslint。
接著在babel的issues中搜索這樣的報錯，原來是我babel預置的轉換器是 babel-preset-es2015 ，並不能轉換 Object Rest Operator 特性。
解決方法很簡單了，可以安裝整個stage2的預置器或者安裝 Object Rest Operator 的babel插件 babel-plugin-transform-object-rest-spread 。
我選擇了安裝插件，接著在babel的配置文件 .babelrc 中應用插件：
{
"presets": [
["es2015", { "modules": false }]
],
"plugins": ["transform-object-rest-spread"]
} 或者
$ npm install babel-preset-stage-2 {
"presets": [
["es2015", { "modules": false }],"stage-2"
]
}
重啟webpack，就不會再有報錯了。
作者：W_I_S_E
鏈接：http://www.jianshu.com/p/0a71772dcd08
vuex2中使用mapMutations/mapActions報錯解決方法 BabelLoaderError: SyntaxError: Unexpected token