css在吞咽
我正在使用gulp + browserify来使用ES2015并对jsx做出反应。 我想添加一些像这样的外部反应组件：DataPicker。
这是第一次在我的项目中添加外部反应组件，所以我不知道该CSS也需要导入。
但我不使用webpack，我只是使用gulp。 这些是我的gulp节点模块：
这是我的gulpfile：
gulp.task('build', function() {
return browserify('./app.js')
.transform(babelify, { presets: ["es2015", "react"] }
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(gulp.dest('./dist'));
});
我发现在javascript中使用import / require css需要“browserify-css”，所以我添加了“npm install browserify-css”。 然后我将变换方法添加到我的gulp文件中，如下所示：
gulp.task('build', function() {
return browserify('./app.js')
.transform(babelify, { presets: ["es2015", "react"] }
.transform(require('browserify-css'))
.bundle()
.pipe(source('app.js'))
.pipe(buffer())
.pipe(gulp.dest('./dist'));
});
但它只是抛出这样的错误：
events.js：154，扔呃; //未处理的'错误'事件，SyntaxError：意外的标记
我使用browserify-css进入我的gulp文件有问题吗？ 我做什么？ 这将非常感激，给我一些建议。
.transform(babelify, { presets: ["es2015", "react"] }
.transform(require('browserify-css'))
这只是一个语法问题，因为你试图在对象文字上使用点运算符。
也许尝试这样的事情...
var appBundler = browserify({
entries: ['./app.js'],
transform: [
['babelify', {
"presets": ['es2015', 'react']
}
],
['browserify-css']
]
});
appBundler.bundle()
.pipe(buffer())
.pipe(gulp.dest('./dist'));
上一篇: css in gulp