Browserify,Babel 6,Gulp – 传播运算符上的意外标记

我试图让我的Browserify / Babelify / Gulp在我的项目中工作,但它不会采用传播操作符。

我从我的gulpfile中得到这个错误:

[SyntaxError: /Users/mboutin2/Desktop/Todo-tutorial/src/reducers/grocery-list-reducers.js: Unexpected token (16:8) while parsing file: /Users/mboutin2/Desktop/Todo-tutorial/src/reducers/grocery-list-reducers.js] 

这是我的gulpfile.js

 var gulp = require('gulp'); var source = require('vinyl-source-stream'); var browserify = require('browserify'); var sourcemaps = require('gulp-sourcemaps'); var uglify = require('gulp-uglify'); var buffer = require('vinyl-buffer'); var babelify = require('babelify'); gulp.task('build', function () { return browserify({entries: './src/client/app.js', extensions: ['.js'], debug: true}) .transform(babelify, {presets: ['es2015', 'react']}) .bundle() .on('error', function (err) { console.error(err); this.emit('end'); }) .pipe(source('app.min.js')) .pipe(buffer()) .pipe(sourcemaps.init({loadMaps: true})) .pipe(uglify()) .pipe(sourcemaps.write('./')) .pipe(gulp.dest('./public/js')); }); gulp.task('default', ['build']); 

我试图创build一个.babelrc文件,但它做同样的事情。 而我的脚本工程,当我删除蔓延的运营商。

这是出现意外标记的文件(非常简单)。

 import utils from '../utils/consts'; const initialState = { itemList: [ {name: 'Apple', type: 'Fruit'}, {name: 'Beef', type: 'Meat'} ] }; export function groceryList(state = initialState, action = {}) { switch(action.type) { case utils.ACTIONS.ITEM_SUBMIT: return { ...state, itemList: [ ...state.itemList, {name: action.name, type: action.itemType} ] }; default: return state; } } 

我不知道什么是不行的,我在Github和Babel网站上的设置页面上看了一些问题,但是我不能使它正常工作。

任何人都可以告诉我如何正确处理? 谢谢

该语法是未来实验性提议的语法,它不是es2015一部分或react所以你需要启用它。

 npm install --save-dev babel-plugin-transform-object-rest-spread 

并添加

 "plugins": ["transform-object-rest-spread"] 

与您现有的presets一起。

或者:

 npm install --save-dev babel-preset-stage-3 

并在预设中使用stage-3来启用所有第三阶段的实验function。

我有同样的问题,安装stage-2插件,并修改我的package.json文件,如下所示

 "babel": { "presets": [ "es2015", "react", "stage-2" ] } 

正如一个侧面说明,一些文本编辑器(在我的情况下,Mac笔记本)将收缩...一个elepsis实体,这将validation失败,所以也要注意…