问题标签 [browserify-shim]

我正在尝试使用 browserify 将我的 Angular js 打包到一个脚本中。require当我在我的主文件中使用它时效果很好app.js，但是当其中一个所需的模块app.js包含它自己require时，依赖项不包含在我的包中。

回顾一下，在app.js（链接到 repo 中的行）：

splashHeader.js：

socialButtons.js没有依赖项。

browserify --list app.js未按应有的方式列出splashHeader.js，并且通过生成的捆绑包browserify app.js -o bundle.js不包含 socialButton 的 javascript。所以当然，如果我尝试加载网站，我会Uncaught Error: Cannot find module 'social-button-directive'在 splashHeader 的require('social-button-directive').

同样重要的是要注意，我使用 中的“浏览器”选项将模块名称映射到文件位置package.json，并使用 browerify-shim，因为我的模块都不兼容 common-js。

package.json的相关部分：

我整个早上都在做这个，完全被难住了。我已经削减了有问题的项目，以作为问题的最小示例。要进行测试，只需克隆和 npm 安装。如果您正在查看详细信息，这里是工作/不工作版本 diff。

我已经尝试通过相对路径（require('./ng-modules/socialButtons/socialButtons.js）`）加载子模块，但没有运气。也许我错误地填充了东西？我的方法来自这篇文章。

编辑：这肯定是我的 browserify-shim 配置。将模块转换为 commonjs 并从 package.json 中删除 browserfy-shim 选项后一切正常。我想我只需要把这一切都写出来才能确定。=/

我需要对我的一些 browserify 依赖项使用 browserify-shim，但我无法编辑我的 package.json。我在 gulp 中使用 browserify。是否可以仅从 API 中指定所有 package.json 部分？我正在设想这样的事情：

然后，我的输出替换var $ = require('jquery');为var $ = jQuery;，因为我们现在将 jQuery 用作全局。这可能吗？时间

我在 Angular 中使用 ngMock 进行单元测试。我现在有一个 browserify \w Angular 设置。我有一些奇怪的行为。require('angular-mocks'); 当我只是用我的测试和应用程序加载角度模拟时 。但是，如果我随后将它作为依赖项加载到我的 Angular 应用程序模块中，它将不再加载我的 Angular 应用程序，但我的业力测试仍然有效：

如果我取消注释 ngMock，我的应用程序将不再加载

我的浏览器化垫片：

我的测试：

我的应用程序在仅将“ngMock”注释掉时确实可以工作，但我只是觉得有点奇怪，因为 Angular 文档确实使用angular.module('app', ['ngMock']).. 加载它。是因为 browserify 以某种方式包装了模块吗？

亲切的问候，尼尔斯

根据browserify-shim文档，您可以使用以下语法指定 browserify-shim 需要从遗留模块中公开哪些全局变量package.json：

我希望可以通过require('legacyModule')和访问旧模块window.myVar。

根据我的经验，如果我尝试填充的非 commonjs 模块使用window.myVar = xor just myVar = x，则该模块将在全球范围内公开，并且可以require()按预期通过。

但是，当使用遗留模块时var myVar = x，这就是导致问题的原因，因为该模块只能通过 viarequire('legacyModule')而不是 via访问window.myVar。

browserify -shim 文档指出：

此外，它还处理以下现实世界的边缘情况：

• 仅在脚本级别声明 avar foo = ...并假设它附加到window对象的模块。因为它们运行的​​唯一方式是在全球范围内——“咳咳，……不？！”

我正在通过脚本标签下载谷歌地图 API v3，并使用以下（相关） package.json配置将依赖项添加到我的模块中：

我可以使用以下内容在我的文件中添加依赖项：

当我在浏览器中运行我的代码时，它工作正常。问题是，当我用 Jest 运行测试时，它告诉我找不到“google”模块：

笔记：

我正在测试的文件中需要这种依赖关系，而不是测试本身。我觉得这很令人困惑，因为我认为 Jest 会模拟所有依赖项，除非另有说明，但据我所知，它首先需要在模拟之前正确满足依赖项。

关于我缺少什么或应该采取什么方法的任何想法？

我尝试使用 Browserify 实现angular- gird。

我使用了这样的配置：

但后来我得到了错误：

“未捕获的 TypeError：require.config 不是函数”（main.js）。

有人能帮我吗？angularGrid使用 Browserify实现的最佳方法是什么？

我有使用 requirejs 并需要使用文本文件的 requirejs 3rd 方模块require("text!somefile.txt")

如何将其转换为 browserify 可以在不更改任何代码的情况下作为其 3rd 方库读取的内容？

我browserify在一个Backbone项目中使用并填充owlCarousel ，因为它不是一个commonJS类似的模块。shim转换似乎有效，但在我真正需要的时候无效。

我的app.js文件看起来像：

和我的settingsView

我在哪里package.json

它给我的错误：

未捕获的类型错误：this.$el.find(...).owlCarousel 不是函数

在运行时。但是，如果我$("div").owlCarousel在 dom 准备好后在控制台中运行，它就可以工作。

解决方案后编辑

这是一个 Yeoman 生成器，用于使用 Foundation 和 Browserify 搭建一个项目：https ://github.com/dougmacklin/generator-foundation-browserify

我试图弄清楚如何正确地将基础框架js 与browserify捆绑在一起。

在我的项目文件夹中，我将它与 jQuery（它依赖于它）一起安装：

然后在我的main.js我有以下内容：

我包括，$ = jQuery = ...因为如果我不这样做，我会收到jQuery is not defined错误。

但是，js 组件不起作用。例如，警报元素无法正确关闭。

如果有帮助，这里有一个plunkr，其中包括 my index.html、main.js、bundle.js和.package.jsongulpfile.js

我仍然对browserify感到困惑，我应该为此使用browserify-shim还是我做错了什么？

我在我的项目中使用 browserify 并尝试需要一个需要jQuery作为全局变量的模块。我使用browserify-shim了一次设置为其中之一

"jquery": "global:$"

"jquery": "global:jQuery"

"jquery": "$"

"jquery": "jQuery"

似乎仍然没有任何效果。使用全局 jQuery 的库也在 shim 中并设置为"depends": ["jquery"]

Browserify 正确地制作了连接的 Javascript 包，但Uncaught ReferenceError: jQuery is not defined 在运行业力测试时出现此错误。我在 karma.conf.js 中指定了相同的 browserify-shim 配置。如何将 jQuery 设置为全局的，以便它可以访问它而不抛出此错误。