如何使用Gulp与来自Bower组件的Browserify创build单独的供应商捆绑包
我正在使用Gulp和Browserify将我的Javascript打包成2个独立的包： application.js和vendor.js 。
如果我的供应商库与Bower一起安装，我如何打包vendor软件包？
在我的大文件中，我使用了以下模块：
var gulp = require("gulp"); var browserify = require("browserify"); var debowerify = require("debowerify"); var source = require("vinyl-source-stream");
假设我只有安装了bower的Phaser框架 （在本例中），创buildapplication包的Gulp任务如下所示：
gulp.task("scripts-app", function () { browserify("./app/javascripts/index.js") .external("phaser") .pipe(source("application.js")) .pipe(gulp.dest("./tmp/assets")); });
同时， vendor任务如下所示：
gulp.task("scripts-vendor", function () { browserify() .transform(debowerify) .require("phaser") .pipe(source("vendor.js")) .pipe(gulp.dest("./tmp/assets")); });
当我运行这个Gulp任务，我得到一个错误，指出Error: Cannot find module 'phaser' from ，然后search它的所有目录（都不是bower_components目录）。
任何有关如何成功打包这些想法非常感谢。 谢谢！
回答我自己的问题：
在Gulp任务中使用require时，您需要提供文件的path，而不仅仅是名称。
gulp.task("scripts-vendor", function () { browserify() .transform(debowerify) .require("./bower_components/phaser/phaser.js") .pipe(source("vendor.js")) .pipe(gulp.dest("./tmp/assets")); });
注意require("phaser")变成require("./bower_components/phaser/phaser.js") 。
这样做虽然有效，但捆绑需要永久构build（大约20秒）。 您可能更好的方式是通过<script>标记直接将巨大的库/框架加载到您的应用程序中，然后使用Browserify Shim 。
这让你require() （在NodeJS / Browserify的意义上）全局variables（ 文档 ）。
似乎你想出了如何要求凉亭文件。 希望你最初只需要绑定一次，而不是每一次构build。 通过脚本标签包含库不是一个坏主意。 我正在使用的另一种技术是使用scriptjs （一个polyfill也可以），asynchronous加载任何我需要的供应商库，但确保在脚本加载后包含任何/所有require。 例如，你的index.js可能是这样的：
$script.('/assets/vendor', function() { var phaser = require('phaser'); //rest of code });
加载cdn文件特别好，或者有能力推迟加载某些不需要核心应用程序的库，或者在客户端路由之后加载库。