Question

我尝试使用gulp和browserify构建我的反应项目。但每次我尝试构建捆绑包时都会收到此错误：

TypeError: dest.write is not a function

devDependencies": { "babel-preset-es2015": "^6.14.0", "babel-preset-react": "^6.11.1", "babel-preset-stage-0": "^6.5.0", "babelify": "^7.3.0", "bootstrap-sass": "^3.3.7", "browserify": "^13.1.0", "gulp": "^3.9.1", "gulp-autoprefixer": "^3.1.1", "gulp-pug": "^3.0.4", "gulp-sass": "^2.3.2", "react": "^15.3.1", "react-dom": "^15.3.1", "vinyl-buffer": "^1.0.0", "vinyl-source-stream": "^1.1.0" }。好的，这很奇怪。我无法找到任何解决方案。

package.json（仅限devDependencies）

const gulp = require('gulp');
const sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
const pug = require('gulp-pug');
const browserify = require('browserify');
const babelify = require('babelify');
const source = require('vinyl-source-stream');
const buffer = require('vinyl-buffer');

Bellow是我的gulpfile要求部分。

gulp.task('build', function() {
  return gulp.src('./react/index.jsx')
    .pipe(browserify({
      extensions: ['.jsx'],
      debug: true,
      cache: {},
      packageCache: {},
      fullPaths: true
    }))
    .pipe(babelify.configure({ presets: ['es2015', 'react', 'stage-0'] }))
    .pipe(source('bundle.js'))
    .pipe(buffer())
    .pipe(gulp.dest('./public/react/'));
});

这里是我用于捆绑的任务。

{{1}}

还有另一种方法来做捆绑吗？出了什么问题？

Answer 1

我花了一段时间（实际上是整天）来弄明白。整个配置都错了。这是正确的：

gulp.task('build', function() {
  return browserify({
      extensions: ['.jsx', '.js'],
      debug: true,
      cache: {},
      packageCache: {},
      fullPaths: true,
      entries: './react/index.js',
    })
    .transform(babelify.configure({ 
        presets: ['es2015', 'react', 'stage-0'],
        ignore: /(bower_components)|(node_modules)/
    }))
    .bundle()
    .on("error", function (err) { console.log("Error : " + err.message); })
    .pipe(source('bundle.js'))
    .pipe(gulp.dest('./public/react'));
});

Src：Using React with ES6 and Browserify by wecodetheweb.com

dest.write不是broswerify中的函数

1 个答案: