2016-11-21 160 views
0

嘗試測試ES6傳播語法,但webpack給我一個錯誤。Webpack無法識別ES6傳播語法

的package.json

"devDependencies": { 
    "babel-core": "^6.18.2", 
    "babel-loader": "^6.2.8", 
    "babel-preset-latest": "^6.16.0", 
    "babel-preset-react": "^6.16.0", 
    "webpack": "^1.12.13" 
} 

webpack.config.js

loaders: [ 
      { 
       loader: 'babel-loader', 
       query: { 
        presets: ['react', 'latest'] 
       }, 
       test: /\.jsx?$/, 
       exclude: /(node_modules|bower_components)/ 
      } 
     ] 

app.jsx(的WebPack項文件)

var objOne = {name: 'Jussi', location: 'Interwebs'}; 
var objTwo = { 
    age: 28, 
    ...objOne 
}; 

控制檯

webpack 
Hash: 2a82a67f90f9aa05ab4a 
Version: webpack 1.12.13 
Time: 1409ms 
    + 1 hidden modules 

ERROR in ./app/app.jsx 
Module build failed: SyntaxError: Unexpected token (7:1) 

    5 | var objTwo = { 
    6 | age: 28, 
> 7 | ...objOne 
    |^

這個省略號符號應該可以,對不對?我在哪裏錯了?

+2

對象傳播不是ES2015規範的一部分。 – sdgluck

回答

3

這是無效的ES2015(或ES2016)代碼:

var objOne = {name: 'Jussi', location: 'Interwebs'}; 
var objTwo = { 
    age: 28, 
    ...objOne 
}; 

它依賴於object spread properties,這是第3階段的建議(在本文寫作在2016年11月的)。 (數組傳播是ES2015的一部分,但不是對象傳播。)這意味着該功能是完全定義和充實的,規範文本已準備就緒,但是它正在等待實現和實現反饋。 (詳細信息請見the process document。)所以它很快就會很快成爲一個規格(可能不是ES2017,雖然它可能仍然有可能取決於實現的程度,但幾乎可以肯定ES2018)。

巴別爾和其他類似的transpilers將與相關的選項集合(例如,對於Babel而言,它是stage-3 preset; example)。

+0

謝謝你們,這會清除它。 :-) – mylvinta

+0

@ T.J。那麼如何反應傳播的道具呢? – abhirathore2006

+0

@ abhirathore2006:大多數使用React的人使用瞭解對象傳播屬性(和JSX)的轉譯器。 –