我正在尝试让我的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']);
我试图创建一个.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所以你需要启用它。
es2015
react
npm install --save-dev babel-plugin-transform-object-rest-spread
并添加
"plugins": ["transform-object-rest-spread"]
为.babelrc在保留现有presets。
.babelrc
presets
或者:
npm install --save-dev babel-preset-stage-3
并stage-3在您的预设中使用以启用所有第3阶段实验功能。
stage-3