“无法找到模块’jquery’” – 使用Gulp在browserify中处理JQuery和AngularJS的全局变量

我一直在尝试使用AngularJS,browserify和Gulp创建一个项目,以获得出色的开发人员体验,该项目可生成可分发的“模块”(以Angular的说法).我们的想法是拥有一个自我记录的项目,如Angular Bootstrap,它还可以生成用于其他应用程序的耗材分发.

我们与Gulp取得了很好的成绩,但我们在使用browserify / browserify-shim时遇到了麻烦.此外,遗憾的是,大多数示例都没有使用gulp,或使用gulp-browserify,已被列入黑名单/已结束.

我们将来自Google CDN的AngularJS和JQuery包含为< script>标签并在package.json中的browserify-shim配置中声明了“angular”：“global：angular”和“jquery”：“global：$”,但是当我们尝试用户var时,我们得到“找不到模块”我们的浏览器化代码中的angular = require(‘angular’)和var $= require(‘jquery’)(一旦在浏览器中运行).

我创建了一个示例项目,将其提炼到接近最小值.

A sample repository of the code is available at

克隆后,您将运行’npm install’,然后运行’bower install’,然后从multi-browserify文件夹的根目录运行’gulp’以生成文件并运行测试服务器.

随着gulp的运行,您可以访问http：//：4000 / gulp.html上的实时HTML

任何帮助将不胜感激 – 我想知道我们是否遇到过gulp,browserify,vinyl-source-stream等的错误/问题,或者更可能的是,我们还没有得到它.

...
  "dependencies": {
    "jquery": "^1.11.1"
  },...

var $= require('jquery');

$('<div>Hello World,I\'m using JQuery!</div>').appendTo('body');