我正在使用 npm、Gulp 和 browserify 为我的应用程序创建一个半自动构建管道。这就是我想要完成的事情:
- 拥有可以通过脚本标签包含的页面特定文件(即
page1.js
,,page2.js
...) - 将我在页面特定脚本之间共享的自定义代码分解为
common.js
. - 将通过 npm 安装的供应商库(即 bootstrap、jquery)提取到
vendor.js
.
我在为我的应用程序结合 browserify 和 browserify-shim 时遇到问题。在我的网页中,我包括vendor.js
、common.js
和page1.js
。当我尝试加载页面并且我的脚本尝试加载时require('bootstrap')
,此处会引发异常:
// Part of bootstrap.js
if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\'s JavaScript requires jQuery')
}
我希望必须告诉 browserify-shim bootstrap 依赖于 jquery,它希望 jquery 的导出绑定到 jQuery 变量。我试图在我的 package.json 中这样做。
我很难准确指出出了什么问题。我尝试了各种值的排列以进入引导程序的垫片(jquery:jQuery
, jquery:$
, jquery
),但无济于事。我还尝试在browser
路径中包含和省略各种值。我还尝试使用:通过命令行构建供应商包./node_modules/.bin/browserify -r jquery -r bootstrap > vendor.js
,但浏览器上出现了同样的错误。很多关于 browserify-shim 和 factor-bundle 的问题都被问到了,但没有一个能解决任何试图将两者结合起来的问题。
我创建了一个存储库来演示这里的问题。安装和重现的步骤在 README 中。https://github.com/linkleonard/browserify-shim-factor-bundle