2016-11-21 2 views
0

Пытается проверить синтаксис ES6 Spread, но 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 года). (Array спрэд является частью ES2015, но не распространяется на объект.) Это означает, что функция полностью определена и хорошо сглажена, а текст спецификации готов, но он ожидает реализации и обратной связи с реализацией. (Подробности в the process document.) Таким образом, это действительно далеко вперед и, скорее всего, скоро превратится в спецификацию (возможно, не ES2017, хотя это все еще возможно в зависимости от того, насколько далеко продвинуты реализации, но почти наверняка ES2018).

Вавилон и другие подобные трансформаторы переведут его соответствующим набором параметров (например, для Вавилона это stage-3 preset; example).

+0

Спасибо, ребята, это очищает его. :-) – mylvinta

+0

@ T.J. как реагировать на распространение реквизит? – abhirathore2006

+0

@ abhirathore2006: Большинство людей, использующих React, используют транспилятор, который понимает свойства распространения объекта (и JSX). –