Javascript 合并JS流时保留源映射(使用browserify bundle连接库依赖项)
在我当前的工作流程中,我需要创建browserify bundle,但也希望将非commonjs库连接到文件的开头,以公开全局变量,同时减少http请求的数量和js文件的大小。(其他捆绑包也可能需要其中一些库) 我目前有一个gulp任务,它创建browserify bundle并将所有必需的lib压缩到输出文件的开头,但是我发现在合并流时,我的源映射正在中断,并且在web检查器中;生成的映射只显示了预uglified browserify包,而不是单个js模块Javascript 合并JS流时保留源映射(使用browserify bundle连接库依赖项),javascript,gulp,browserify,gulp-concat,gulp-sourcemaps,Javascript,Gulp,Browserify,Gulp Concat,Gulp Sourcemaps,在我当前的工作流程中,我需要创建browserify bundle,但也希望将非commonjs库连接到文件的开头,以公开全局变量,同时减少http请求的数量和js文件的大小。(其他捆绑包也可能需要其中一些库) 我目前有一个gulp任务,它创建browserify bundle并将所有必需的lib压缩到输出文件的开头,但是我发现在合并流时,我的源映射正在中断,并且在web检查器中;生成的映射只显示了预uglified browserify包,而不是单个js模块 var gulp
var gulp = require("gulp"),
buffer = require('vinyl-buffer'),
gulpif = require("gulp-if"),
sourcemaps = require("gulp-sourcemaps"),
merge = require('merge-stream'),
concat = require('gulp-concat'),
uglify = require("gulp-uglify")
livereload = require("gulp-livereload");
// compile scripts
gulp.task("scripts", function() {
"use strict";
// Iterate over bundles
var tasks = config.browserifyBundles.map(function(item){
// Use entry file for output file name
var outputName = item.mainfile.replace(/^.*[\\\/]/, '');
var browserifyStream = browserify({
entries: item.mainfile,
debug: env !== "production"
}).bundle()
.on("error", notify.onError())
.pipe(source(outputName))
.pipe(buffer())
.pipe(gulpif(env !== "production", sourcemaps.init()))
.pipe(gulpif(env !== "production", sourcemaps.write()));
// Get files to concat stream from json array
var libStream = gulp.src(item.concat);
return merge(libStream, browserifyStream)
.pipe(gulpif(env !== "production", sourcemaps.init({loadMaps: true})))
.pipe(concat(outputName))
.pipe(uglify())
.pipe(gulpif(env !== "production", sourcemaps.write()))
.pipe(gulp.dest(config.projectDir + "js/"))
.pipe(notify("updated"))
.pipe(livereload());
});
// create a merged stream
es.merge.apply(null, tasks);
});
(注意,如果存在多个bundle,我的任务还会读取一个config json数组来构建多个bundle)
是否有一种方法可以保留预合并流中的源映射?loadmaps设置为true似乎不起作用
此外,作为一种理智的检查,我的方法是否明智?我是否错过了一些非常简单的方法来实现我想要的结果?请确保以下行位于管道的开头,这样可以正确地保留源地图
.pipe(gulpif(env !== "production", sourcemaps.init()))
请看,那里的共识是“不,他们不应该”!抱歉@Andreasniedermir-谢谢你的编辑我恐怕我已经从一年零七个月前开始有了很大的进步!当我有时间的时候,我会看看我是否可以检查它是否有效,但是非常感谢你的回答。如果它现在起作用,我会让你知道并接受你的答案:)哇!没想到是这个老家伙哈哈