问题标签 [grunt-browserify]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
7981 浏览

reactjs - 如何在使用第三方东西的需求时保持 Browserify 包大小合理(如果重要,通过 grunt)

我正在尝试捆绑我自己的代码(A),该代码又使用 2 个第三方组件(B 和 C),其中 C 也需要 B。据我所知,所有内容都是使用 CommonJS 节点样式模块编写的。

捆绑时单独的 A 输出为 60K。

B 单独包含并假定为全局的,通过在我的构建步骤中进行一些肮脏的替换,将 require("B") 替换为 global.B,我可以正常工作

C 是什么导致了我的问题,它的大小意味着“只有 8K”,但是当我尝试将它与 A 捆绑在一起时,我的包会跳到 600K+,因为我认为它会吸引大量的依赖项?

这是不可接受的,但我不知道如何让它变得更小,因为我不知道它到底是什么(或更重要的是我可以排除什么以使其仍然有效)。我可以尝试使用排除法进行二元斩波,但我不知道这是否是一种安全的方式,甚至是明智的方式。

我怎样才能捆绑 C 并且只有我的捆绑包以 68.5K(两个代码块的总大小 60k + 8.5k)并且当然仍然可以工作?

我是 node 和 browserify 的新手,但我已经为此苦苦挣扎了一个多星期,所以公平地说,在举手之前我已经给了它一个很好的尝试。

附加信息(如果重要):

  • 它需要运行服务器端和客户端
  • B 实际上是 ReactJS
  • C 实际上是 React Router 组件
  • 通过 ReactJS.net 使用 windows 和 c#...嘿...等等...回来... tumbleweed
0 投票
1 回答
457 浏览

browserify - A bit confused with factor-bundle and grunt-browserify

a bit of a noob question -- I'd like to create two bundles -- app_bundle.js, and landing_bundle.js.

They will both share react, and a few other files, so I thought it would be a good idea to extract those out into a different, common bundle.

I found factor-bundle, but am having trouble getting it to work. This is what my config looks like for now:

I ran it, got no errors, but am not sure where the factored bundle js actually is, I think it didn't actually save anywhere.

The thing I'm not understanding is, where will factor-bundle save the file? how would I go about specifying that?

0 投票
1 回答
1030 浏览

javascript - Grunt-Browserify 扩展标志不起作用

我正在尝试使用 Grunt-browserify 和 reactify 来解析和捆绑用 jsx 编写的 React 组件。我想使用扩展标志,这样我就不必指定模块的文件扩展名,但我无法让它工作。这是一些测试代码:

一个 Grunt 文件:

主应用程序文件app.jsx

然后Test.jsx

当我尝试通过运行编译它时grunt,出现错误:

错误:无法从“/Users/****/Sites/grunt-test/src”中找到模块“./components/Test”

Grunt-browserify 文档说它从 v1.2.6 开始就支持扩展标志,我在整个网络上都看到了这样的例子,但我似乎无法让它在这里工作。如果我从命令行运行 browserify - 就像这样browserify -t reactify --extension=.jsx -o dest/app.js- 它可以工作。

有任何想法吗?

0 投票
0 回答
94 浏览

gruntjs - Browserify,在不同的 browserify 构建中填充不同的库

我正在使用 browserify + grunt 生成两个单独的 JS 输出,即我的应用程序的客户端和服务器端版本。例如。

gruntfile.js

一切正常,我得到了 2 个单独的文件。

现在我希望我的客户端应用程序使用 browserify-shim 从 CDN 引用一些常用库。

例如。

问题是这对客户端和服务器版本都进行了填充,在服务器上,这些东西在全局中不存在。

我想将此 shim 仅应用于客户端(而不是服务器)

我努力了

但我似乎无法弄清楚如何告诉 browserify 为每个文件使用一组单独的垫片。

0 投票
2 回答
2944 浏览

jsx - 让 reactify 和 browserify 与 ES6 一起工作

我有一个如下配置的 browserify 任务:

我尝试将其配置为以这种方式使用 es6:

这会导致错误:

错误:路径必须是字符串

鉴于我不想在我的 package.json 中配置转换,我无法从文档中了解如何执行此操作。任何帮助,将不胜感激。

0 投票
1 回答
74 浏览

javascript - React JSX + Titaniumifier

我们当前的基础设施依赖于 Titanium 来实现原生。我正在尝试使用https://www.npmjs.com/package/grunt-titaniumifier将我的节点项目转换为 CommonJS 。但是,它在 JSX 上失败了:

Browserify 工作正常,因为它使用如下变换:

对于钛化剂,我有以下内容:

但是运行grunt titaniumifier:module返回

致命错误:解析文件 /Users/rduckworth/Projects/titanium-d3/app/App.js:意外令牌 (23:6)

这是上面的 JSX 代码。

无论如何我可以让 Titaniumifier 像 browserify 那样编译 JSX 吗?

0 投票
1 回答
2575 浏览

javascript - Grunt-Browserify Ignore Option

I have a React app that I am transforming, uglifying and browserfying via Grunt. My grunt file looks like this...

You will notice the ignore property of the browserify task is telling it to ignore any file with -test.js in the filename, the reason being that my tests are stored in folders directly next to the file I am testing (as seems to be the convention when looking at the React Flux examples) and I don't want the test files being bundled in to my app.js file. Can anyone tell me if I am doing this wrong because so far it doesnt seem to be working at all? The test files get bundled into app.js and then I get console errors about jest not being defined.

0 投票
0 回答
979 浏览

javascript - 如何使用 grunt-browserify 创建供应商捆绑包

我正在开发一个需要多个第三方库的单页应用程序。为了减少构建时间,我尝试创建两个单独的包:一个用于库代码,一个用于应用程序代码。我的构建过程使用 grunt-browserify 来生成包。这是我的 browserify 任务(我正在使用 grunt-load-tasks 来模块化我的 Grunt 任务):

这成功地创建了两个单独的捆绑包,并且在页面上包含捆绑包后我的应用程序正常运行。但是,我注意到 Backbone 和 Handlebars 都包含在 libs.js 包和 app.js 包中,而我原本希望它们只包含在 libs.js 包中。知道我做错了什么吗?

0 投票
2 回答
1291 浏览

gruntjs - 在 React 组件上运行 grunt-browserify 时解析错误

我只是在玩弄 React,并使用 grunt 和 grunt-browserify 进行了基本设置,但我遇到了解析错误。有谁知道这个的解决方案?旁注 - 当我不使用 react/jsx 时,任务运行良好。

有一个基本组件:

我收到此错误:

这是繁重的任务:

0 投票
1 回答
1339 浏览

javascript - Proxyquire 找不到模块

我正在尝试使用 proxyquire 来模拟依赖项以进行测试。但我不断收到此错误Cannot find module

我尝试了完整的路径,但它仍然在抱怨。

我有一个 src 文件assets/js/src/lib和测试js-tests/specs

这是代码。

我收到了这个错误。

错误:在以下位置找不到模块“../../assets/js/src/lib/Mandrill”

我正在使用 Grunt 和 PhantomJs 来运行测试

这是我在 Gruntfile.js 中的 Browserify