在使用Browserify和Babel构建bundle.js文件时,我遇到了问题。
Header.js:
import HeaderRT from './Header.rt';
Header.rt:
<div>Header></div>
错误:
Browserify Error
.../Header.rt:1
<div>Header</div>
^
ParseError: Unexpected token
据我所知,所有".rt“文件都需要由react处理--模板,而不是Browserify。但我该如何配置呢?
这是我的吞咽文件:
var gulp = require('gulp');
var fs = require("fs");
var browserify = require("browserify");
var babelify = require("babelify");
var source = require('vinyl-source-stream');
var gutil = require('gulp-util');
var inject = require('gulp-inject');
var rename = require('gulp-rename');
var clean = require('gulp-clean');
var debug = require('gulp-debug');
var watchify = require('watchify');
var assign = require('lodash.assign');
var sourcemaps = require('gulp-sourcemaps');
var rt = require('gulp-react-templates');
var customOpts = {
entries: ['./main.js'],
debug: true,
ignoreTransform: ['rt']
};
var opts = assign({}, watchify.args, customOpts);
var b = watchify(browserify(opts));
b.transform(babelify);
gulp.task('js', bundle);
b.on('update', bundle);
b.on('log', gutil.log);
gulp.task('default', ['js']);
function bundle() {
gulp.src('./dist/*.js', {read: false})
.pipe(clean());
var bundleFile = b.bundle()
.on('error', gutil.log.bind(gutil, 'Browserify Error'))
.pipe(source('./bundle.js'))
.pipe(rename('bundle_' + parseInt(Math.random() * 100000) + '.js'))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./dist'));
gulp.src('./index.html')
.pipe(inject(bundleFile))
.pipe(gulp.dest('./'));
return bundleFile;
}
提前谢谢!
发布于 2016-08-26 18:25:09
我将通过使用react-templatify.了解如何做到这一点。对于有同样问题的人,我们只需将这一行添加到browserify的配置:
transform: ['react-templatify']
因此,它的配置变成:
var customOpts = {
entries: ['./main.js'],
debug: true,
transform: ['react-templatify']
};
var opts = assign({}, watchify.args, customOpts);
https://stackoverflow.com/questions/39170015
复制相似问题