使用 Browserify 和分离公共库时找不到 jquery
Can't find jquery when using Browserify and separating common libs
我在 Express 应用程序中继承了一个大型 Gulpfile,我正在使用它有两个步骤:
build-common-lib - 合并和缩小公共库,例如 jQuery 和下划线到 "common.min.js"
build - 浏览 "js/modules/*.js" glob 中的 js 文件,排除 "build-common-lib" 步骤中的任何模块,例如"contact.js"
此时所有 contact.js
包含在 browserification 之前是:
var $ = require('jquery');
我在结束正文标记之前添加了 common.min.js
,然后是 contact.min.js
。我 运行 遇到的问题是:
Uncaught Error: Cannot find module 'jquery'
如果我自己浏览 contact.js:
browserify -e contact.js -o contact.min.js
问题解决了,但是完全违背了公用库分离的目的
如何在 contact.js
中正确引用 jQuery?
Gulpfile比较大,这里省略了。 运行 任务时我没有收到任何错误,但如果您需要查看任何部分,请告诉我。
我认为你面临的问题是 browserify 会将 bundle 上的每个文件包装到它自己的 IIFE(立即调用函数表达式)中,因此,这个 var $ = require('jquery');
将只对它自己有效上下文(在 build-common-lib IIFE 中产生的 IIFE)。
要解决此问题,请将 jQuery 显式添加到 window 对象,以便其他 IIFE 可以访问它。
尝试这样的事情(也取决于您要使用的别名):
window.$ = window.jQuery = require( 'jquery' );
我在 Express 应用程序中继承了一个大型 Gulpfile,我正在使用它有两个步骤:
build-common-lib - 合并和缩小公共库,例如 jQuery 和下划线到 "common.min.js"
build - 浏览 "js/modules/*.js" glob 中的 js 文件,排除 "build-common-lib" 步骤中的任何模块,例如"contact.js"
此时所有 contact.js
包含在 browserification 之前是:
var $ = require('jquery');
我在结束正文标记之前添加了 common.min.js
,然后是 contact.min.js
。我 运行 遇到的问题是:
Uncaught Error: Cannot find module 'jquery'
如果我自己浏览 contact.js:
browserify -e contact.js -o contact.min.js
问题解决了,但是完全违背了公用库分离的目的
如何在 contact.js
中正确引用 jQuery?
Gulpfile比较大,这里省略了。 运行 任务时我没有收到任何错误,但如果您需要查看任何部分,请告诉我。
我认为你面临的问题是 browserify 会将 bundle 上的每个文件包装到它自己的 IIFE(立即调用函数表达式)中,因此,这个 var $ = require('jquery');
将只对它自己有效上下文(在 build-common-lib IIFE 中产生的 IIFE)。
要解决此问题,请将 jQuery 显式添加到 window 对象,以便其他 IIFE 可以访问它。
尝试这样的事情(也取决于您要使用的别名):
window.$ = window.jQuery = require( 'jquery' );