如何获取 gulp+babel+browserify+uglify 的 sourcemaps
How to get sourcemaps for gulp+babel+browserify+uglify
我正在使用 gulp 将 browserify+babelify 与 uglifyjs 捆绑在一起。欧
但是,从我的项目生成的 sourcemaps 只给我捆绑版本,而不是捆绑版本。
这是我的设置:
var gulp = require('gulp'),
source = require('vinyl-source-stream'),
browserify = require('browserify'),
gutil = require('gulp-util'),
buffer = require('vinyl-buffer'),
sourcemaps = require('gulp-sourcemaps'),
uglify = require('gulp-uglify'),
file = 'index.js';
gulp.task('build', function(){
return browserify({
entries: [file],
transform: ["babelify"]
})
.bundle()
.pipe(source(file))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./public/js'))
.pipe(gutil.noop())
})
有没有办法让我创建一个捆绑 babel=>browserify=>uglify 的构建,并且仍然 return 我映射到我的 pre-babel 文件?
我也不介意不使用 gulp(我实际上更喜欢 grunt,但这个设置过去对我有用)。
首先你需要通过将调试选项设置为 true 来设置 browserify 生成源映射,然后如果你想要 babelify 之前的源映射你需要配置 babelify 来生成源映射:
var gulp = require('gulp'),
source = require('vinyl-source-stream'),
browserify = require('browserify'),
gutil = require('gulp-util'),
buffer = require('vinyl-buffer'),
sourcemaps = require('gulp-sourcemaps'),
uglify = require('gulp-uglify'),
babelify = require('babelify')
file = 'index.js';
gulp.task('build', function(){
return browserify(file,{debug:true}).transform(babelify, {presets: ["es2015", "react"],sourceMaps:true})
.bundle()
.pipe(source(file))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./build/js'))
.pipe(gutil.noop())
})
我正在使用 gulp 将 browserify+babelify 与 uglifyjs 捆绑在一起。欧 但是,从我的项目生成的 sourcemaps 只给我捆绑版本,而不是捆绑版本。
这是我的设置:
var gulp = require('gulp'),
source = require('vinyl-source-stream'),
browserify = require('browserify'),
gutil = require('gulp-util'),
buffer = require('vinyl-buffer'),
sourcemaps = require('gulp-sourcemaps'),
uglify = require('gulp-uglify'),
file = 'index.js';
gulp.task('build', function(){
return browserify({
entries: [file],
transform: ["babelify"]
})
.bundle()
.pipe(source(file))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./public/js'))
.pipe(gutil.noop())
})
有没有办法让我创建一个捆绑 babel=>browserify=>uglify 的构建,并且仍然 return 我映射到我的 pre-babel 文件?
我也不介意不使用 gulp(我实际上更喜欢 grunt,但这个设置过去对我有用)。
首先你需要通过将调试选项设置为 true 来设置 browserify 生成源映射,然后如果你想要 babelify 之前的源映射你需要配置 babelify 来生成源映射:
var gulp = require('gulp'),
source = require('vinyl-source-stream'),
browserify = require('browserify'),
gutil = require('gulp-util'),
buffer = require('vinyl-buffer'),
sourcemaps = require('gulp-sourcemaps'),
uglify = require('gulp-uglify'),
babelify = require('babelify')
file = 'index.js';
gulp.task('build', function(){
return browserify(file,{debug:true}).transform(babelify, {presets: ["es2015", "react"],sourceMaps:true})
.bundle()
.pipe(source(file))
.pipe(buffer())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./build/js'))
.pipe(gutil.noop())
})