browserify怎么生成sourcemap

Question

刚开始使用gulp-babel编译es6，很多问题不清楚：

gulp.task('browserify', function () {
    browserify({
            entries: './build/view/index.js',
            debug: true
        })
        .transform(babelify, {
            presets: ['es2015', 'stage-0', 'stage-1'],
            plugins: ['transform-decorators-legacy']
        }).bundle()
        .pipe(vinylSource('index.js'))
        .pipe(gulp.dest('./build'));
});

请问怎么配置生成sourcemap?
另外，现在gulp-browserify是不是不推荐使用，而是都用browserify了?

Answer 1

看我写的 https://github.com/hjzheng/es6-practice/blob/master/gulpfile.js
配置 debug为true 就会启用 sourcemap，但是好像是inline-sourcemap
如果要使用 生成独立的sourcemap文件，请使用 exorcist

//README.md中的例子
var browserify = require('browserify')
  , path       = require('path')
  , fs         = require('fs')
  , exorcist   = require('exorcist')
  , mapfile    = path.join(__dirname, 'bundle.js.map')

browserify()
  .require(require.resolve('./main'), { entry: true })
  .bundle({ debug: true })
  .pipe(exorcist(mapfile))
  .pipe(fs.createWriteStream(path.join(__dirname, 'bundle.js'), 'utf8'))

gulp-browserify就是用gulp插件方式包了一下browserify，直接用browserify就行啦！
另外关于 gulp 其他资料可以看一看这个 https://github.com/Platform-CUF/use-gulp

但是我还是建议使用 webpack 去玩ES6，下面链接中有两个ES6的练习环境，一个就是webpack

https://github.com/ShuyunXIANFESchool/newcomer#es6