gulp: browserify/babelify build script, unexpected token
I am currently trying to enhance my ReactJS application by adding https://github.com/wangzuo/input-moment I installed it via npm install input-moment --save and I am importing it using import InputMoment from 'input-moment' .
But it seems that my custom build script does not compile it, but tries to source the react-style version directly. [edit: Noticed by compile error "unexpected token" on React-style html tags)]
Can you help me fix my build script, so including un-transformed files works, too?
Here's my gulpfile.js:
// TODO: Get this to work.
require('app-module-path').addPath(__dirname);
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var browserify = require('browserify');
var babelify = require('babelify');
var watchify = require('watchify');
var sourcemaps = require('gulp-sourcemaps');
var streamify = require('gulp-streamify');
var uglify = require('gulp-uglify');
var sass = require('gulp-sass');
var gutil = require('gulp-util');
var notify = require('gulp-notify');
function handleErrors() {
var args = Array.prototype.slice.call(arguments);
notify.onError({
title: 'Compile Error',
message: '<%= error.message %>'
}).apply(this, args);
this.emit('end'); // Keep gulp from hanging on this task
}
function buildScript(file, watch) {
var props = {
entries: ['./app/'+file],
debug: true,
transform: [babelify],
cache: {},
packageCache: {},
fullPaths: true
};
// watchify() if watch requested, otherwise run browserify() once
var bundler = watch ? watchify(browserify(props)) : browserify(props);
function rebundle() {
var stream = bundler.bundle();
return stream
.on('error', handleErrors)
.pipe(source(file))
// .pipe(streamify(uglify()))
.pipe(gulp.dest('./build/'));
}
// listen for an update and run rebundle
bundler.on('update', function() {
rebundle();
gutil.log('Rebundle ...');
});
// run it once the first time buildScript is called
return rebundle();
};
gulp.task('scripts', function() {
return buildScript('app.jsx', true);
});
gulp.task('sass', function () {
gulp.src('./assets/sass/**/*.scss')
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(gulp.dest('./build'));
});
gulp.task('sass:watch', function () {
gulp.watch('./assets/sass/**/*.scss', ['sass']);
});
gulp.task('default', ['scripts', 'sass', 'sass:watch']);
Additionally, I'm using the following .babelrc:
{
"presets": ["es2015", "react"],
"plugins": [
"add-module-exports"
]
}
So far it worked fine and I have a lot of modules running, but this is the first that seems to be uncompiled in node_modules.
链接地址: http://www.djcxy.com/p/32968.html上一篇: Babel 6反应JSX变压器