使用Browserify后仍然包含依赖项文件的原因

Question

所有

我对Gulp和Browserify很陌生，我所做的是将一些jsx代码转换为浏览器并将它们浏览到bundle.js文件中。

var gulp = require("gulp");
var browserify = require("browserify");
var source = require("vinyl-source-stream");
var reactify = require("reactify");

gulp.task("default", function(){
    browserify({
        entries: ["js/app.js"],
        debug: true
    })
    .transform(reactify)
    .bundle()
    .pipe(source("bundle.js"))
    .pipe(gulp.dest("dist/js/"));
});

在app.js中，我指定了一些需要依赖项（每个可能需要一些其他文件），我认为browserify会解析它们并编译成一个bundle.js文件，但是当我运行它时，即使我只是在index.html页面中包含bundle.js，当我在Chrome源标签中检查时，它仍然包含所有这些依赖项文件，我想知道这是否只是Chrome的解析捆绑文件的功能，它给了我一个列表依赖文件列表或它实际上也下载了那些依赖文件（我很困惑的是我实际上可以点击并打开那些依赖文件，所以我猜Chrome用bundle.js下载它们，但我不确定） ？

谢谢

Answer 1

如果我理解正确，那么您正在描述browserify为您提供的debug: true，即源地图。

  

- debug -d启用允许您单独调试文件的源映射。

和

  

当opts.debug为true时，将内联的源地图添加到   束。这使调试更容易，因为你可以看到所有   如果你在一个足够现代的浏览器中，原始文件。