Question

我有几个js模块，我在浏览器中捆绑了浏览器：

gulp.task('build:js', ['clean:js'], function () {
  browserify({
    debug: true,
    entries: paths.js.src
  })
    .transform('babelify', { presets: ['es2015'] })
    .bundle()
    .pipe(source('bundle.js'))
    .pipe(buffer())
    .pipe(gulp.dest(paths.js.dist));
});

它输出一个bundle.js。但是，当这样捆绑时，我可以在浏览器中require个别模块。我想做的，因为我不想总是启动每个模块（有些是特定于页面的）。而不是我希望能够在捆绑包旁边的页面上使用var someModule = require('some-module');。

现在我在文档中找不到任何相关内容，因为它只记录了命令行选项（而不是js api）。 This answer表明模块可以被需要并从gulp中暴露出来，但这会暴露我的整个包，而不是它所组成的模块。

解决方案是将所有模块分开捆绑，排除依赖关系（因此它们不会在bundle之间复制），然后将其连接起来。但这似乎并不是一个可行的解决方案，因为：

模块可能无法解析依赖关系，因为所有内容都是单独捆绑的，因此必须在浏览器中解析依赖关系。我认为不理想，容易破损。
由于我使用了大量模块，因此非常耗费人力，每个模块都需要手动导出，依赖项在我的模板中排除和引用。 There are ways to automate it，但这并不排除共享依赖项。

那么我该如何解决这个问题呢？如何在浏览器中单独组成我的js组成的包，供客户端使用？

Answer 1

所以我最终做的就是别的。我所要求的有点违背了浏览器的工作方式，即使它是可能的。也许最终当HTTP2导入和js modules可以在所有主流浏览器中使用时，这将更容易。

目前，我只有一个global捆绑包，用于在每个页面上运行的脚本，包括我的所有第三方库。然后对于每个页面，我都有一个单独的入口点，其中包含所需的本地模块。这是迄今为止最易维护的解决方案。

如何在浏览器中导出我的浏览器模块？

1 个答案: