浏览器内的javascript需要节点式吗？ [英] Node-style require for in-browser javascript?

问题描述

是否存在任何用于浏览器内javascript的库，它们提供与Node的 require 相同的灵活性/模块性/易用性？

Are there any libraries for in-browser javascript that provide the same flexibility/modularity/ease of use as Node's require?

提供更多详细信息： require 的原因非常好：

To provide more detail: the reason require is so good is that it:

1. 允许代码从其他位置动态加载（在我看来，这比在HTML中链接所有代码更好）


2. 它提供了一致的界面构建模块


3. 模块很容易依赖于其他模块（所以我可以编写一个需要jQuery的API，所以我可以使用 jQuery.ajax （）


4. 加载的javascript是范围，这意味着我可以加载 var dsp = require（dsp .js）; 我可以访问 dsp.FFT ，这不会干扰我的本地 var FFT

1. Allows code to be dynamically loaded from other locations (which is stylistically better, in my opinion, than linking all your code in the HTML)
2. It provides a consistent interface for building modules
3. It is easy for modules to depend on other modules (so I could write, for instance, an API that requires jQuery so I can use jQuery.ajax()
4. Loaded javascript is scoped, meaning I could load with var dsp = require("dsp.js"); and I would be able to access dsp.FFT, which wouldn't interfere with my local var FFT

我还没有找到一个能够有效实现这一目标的库。我倾向于使用的解决方法e是：

I have yet to find a library that does this effectively. The workarounds I tend to use are:

• coffeescript-concat - 它很容易需要其他js，但你必须编译它，这意味着它不太适合快速开发（例如在测试中构建API）

• coffeescript-concat -- it's easy enough to require other js, but you have to compile it, which means it is less great for fast development (e.g. building APIs in-test)

RequireJS - - 它很受欢迎，直截了当，并解决了1-3，但缺乏范围是一个真正的交易破坏者（我相信 head.js 类似，因为它缺乏范围，但我从来没有任何机会使用它。同样， LABjs 可以加载和 .wait（）确实缓解了依赖性问题，但它仍然没有确定范围）

RequireJS -- It's popular, straightforward, and solves 1-3, but lack of scoping is a real deal-breaker (I believe head.js is similar in that it lacks scoping, though I've never had any occasion to use it. Similarly, LABjs can load and .wait() does mollify dependency issues, but it still doesn't do scoping)

据我所知，javascript的动态和/或异步加载似乎有很多解决方案，但它们往往具有与从HTML加载js相同的范围问题。最重要的是，我想要一种方法来加载根本不会污染全局命名空间的javascript，但仍允许我加载和使用库（就像节点的要求一样）。

As far as I can tell, there appear to be many solutions for dynamic and/or async loading of javascript, but they tend to have the same scoping issues as just loading the js from HTML. More than anything else, I would like a way to load javascript that does not pollute the global namespace at all, but still allows me to load and use libraries (just as node's require does).

编辑（我的答案）：自写这篇文章以来，我广泛使用了 RequireJS （现在有更清晰的文档）。在我看来，RequireJS确实是正确的选择。我想澄清一下系统如何适用于那些和我一样困惑的人：

EDIT (MY ANSWER): Since writing this, I have extensively used RequireJS (which now has much clearer documentation). RequireJS really was the right choice in my opinion. I'd like to clarify how the system works for people who are as confused as I was:

你可以使用 require 在日常发展中。模块可以是函数返回的任何内容（通常是对象或函数），并且作为参数确定范围。您还可以使用 r.js 将项目编译为单个文件进行部署（实际上，这几乎总是更快，即使 require 可以并行加载脚本。）

You can use require in everyday development. A module can be anything returned by a function (typically an object or a function) and is scoped as a parameter. You can also compile your project into a single file for deployment using r.js (in practice this is almost always faster, even though require can load scripts in parallel).

RequireJS和node-style之间的主要区别就像browserify（由tjameson建议的一个很酷的项目）使用的方式模块的设计和要求：

The primary difference between RequireJS and node-style require like browserify (a cool project suggested by tjameson) uses is the way modules are designed and required:

• RequireJS使用AMD（异步模块定义）。在AMD中， require 获取要加载的模块（javascript文件）列表和回调函数。当它加载了每个模块时，它会调用每个模块的回调作为回调的参数。因此它是真正的异步，因此非常适合网络。


• 节点使用CommonJS。在CommonJS中， require 是一个阻塞调用，它加载模块并将其作为对象返回。这适用于Node，因为文件从文件系统读取，这足够快，但在网络上运行不佳，因为同步加载文件可能需要更长的时间。

• RequireJS uses AMD (Async Module Definition). In AMD, require takes a list of modules (javascript files) to load and a callback function. When it has loaded each of the modules, it calls the callback with each module as a parameter to the callback. Thus it's truly asynchronous and therefore well-suited to the web.
• Node uses CommonJS. In CommonJS, require is a blocking call that loads a module and returns it as an object. This works fine for Node because files are read off the filesystem, which is fast enough, but works poorly on the web because loading files synchronously can take much longer.

在实践中，许多开发人员在看到AMD之前就使用过Node（因此也使用了CommonJS）。此外，许多库/模块是为CommonJS编写的（通过向 exports 对象添加内容而不是AMD）（通过从返回模块） define function）。因此，许多支持Node的Web开发人员希望在Web上使用CommonJS库。这是可能的，因为从< script> 标记加载是阻止的。像browserify这样的解决方案采用CommonJS（Node）模块并将它们包装起来，以便您可以使用脚本标记包含它们。

In practice, many developers have used Node (and therefore CommonJS) before they ever see AMD. In addition, many libraries/modules are written for CommonJS (by adding things to an exports object) rather than for AMD (by returning the module from the define function). Therefore, lots of Node-turned-web developers want to use CommonJS libraries on the web. This is possible, since loading from a <script> tag is blocking. Solutions like browserify take CommonJS (Node) modules and wrap them up so you can include them with script tags.

因此，如果您正在开发自己的多文件项目在网络上，我强烈推荐RequireJS，因为它确实是网络的模块系统（尽管在公平披露中，我发现AMD比CommonJS更自然）。最近，区别变得不那么重要了，因为RequireJS现在允许您基本上使用CommonJS语法。另外，RequireJS可用于在Node中加载AMD模块（虽然我更喜欢 node-amd-loader ）。

Therefore, if you are developing your own multi-file project for the web, I strongly recommend RequireJS, since it is truly a module system for the web (though in fair disclosure, I find AMD much more natural than CommonJS). Recently, the distinction has become less important, since RequireJS now allows you to essentially use CommonJS syntax. Additionally, RequireJS can be used to load AMD modules in Node (though I prefer node-amd-loader).

推荐答案

查看 ender 。它做了很多。

另外， browserify 非常好。我使用了 require-kiss 并且它有效。可能还有其他人。

Also, browserify is pretty good. I've used require-kiss and it works. There are probably others.

我不确定RequireJS。它与节点不同。从其他位置加载可能会遇到问题，但可能会有效。只要有提供方法或可以调用的东西。

I'm not sure about RequireJS. It's just not the same as node's. You may run into problems with loading from other locations, but it might work. As long as there's a provide method or something that can be called.

TL; DR - 我建议使用browserify或require-kiss。

TL;DR- I'd recommend browserify or require-kiss.

更新：

要求亲吻已经死了，作者已经删除它。我一直在使用RequireJS没有问题。 require-kiss的作者写了 pakmanager 和 pakman 。完全披露，我与开发人员合作。

require-kiss is now dead, and the author has removed it. I've since been using RequireJS without problems. The author of require-kiss wrote pakmanager and pakman. Full disclosure, I work with the developer.

我个人更喜欢RequireJS。它更容易调试（您可以在开发中使用单独的文件，在生产中使用单个部署的文件）并且构建在可靠的标准上。

Personally I like RequireJS better. It is much easier to debug (you can have separate files in development, and a single deployed file in production) and is built on a solid "standard".

这篇关于浏览器内的javascript需要节点式吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！