5

有人熟悉Yabble或其他浏览器端 CommonJS 加载器吗？

我正在试验 Node.js，并且非常想创建可以在服务器端和客户端互换使用的 Javascript 模块。这最终可能更像是“因为它很棒”之类的东西，而不是“因为它实用且有用”之类的东西。

因此，我基本上试图让 CommonJSrequire()方法在浏览器端工作，这正是 Yabble 应该做的。我真的不知道从哪里开始。除了在Yabble 的 Github 自述文件中找到的内容之外，我似乎找不到任何文档，这并没有多大帮助。

基本上我所做的只是把它放在一个 HTML 页面中......

<script src="yabble.js"></script>

<!-- Uses require -->
<script>
    require.setModuleRoot('http://localhost:8030/')
    my_module = require('my_module')
</script>

但是每当我调用这个require()函数时，我都会Synchronous require() is not supported.抛出一个异常。

有人可以帮我开始吗？我应该在哪里加载我应该在yabble.js哪里调用require？有没有一种特殊的方式来运行我的 Javascript 模块？

4

2 回答 2

6

在将需要使用该require()函数的 Javascript 代码加载到浏览器中时，该代码的入口点必须是该require.run()函数。

例如，好：

<script src="yabble.js"></script>

<script>
    require.setModuleRoot('http://localhost:8030/')
    require.run('my_module') // <-- Uses require() function somewhere
</script>

例如，坏（会得到Synchronous require() is not supported错误）：

<script src="yabble.js"></script>
<script src="http://localhost:8030/my_module.js"></script> <!-- <== Use's require function somewhere -->

仅供参考，Yabble 如何做到这一点非常漂亮。它实际上会静态分析您的 Javascript 源代码，我认为基本上只是使用正则表达式来查找require()方法，然后尝试.js从服务器中提取该脚本，然后对该脚本进行相同的静态分析.js，等等.

.js这可能会特别令人困惑，因为即使控制逻辑意味着程序流永远不会到达require()函数，它也会实际加载这些脚本。例如，如果你有...

if (False) { require('some_module'); }

... Yabble仍然会加载这个模块。

于 2011-03-12T21:29:26.977 回答
2

在浏览器中同步加载模块是有问题的。像这样的构造：

var x = require('something_remote.js')

暗示浏览器将停止您的代码（即阻塞），去获取远程文件，解析它，然后将导出返回给您。但这与单线程浏览器环境不符——我们将暂停主要的 JavaScript 线程（以及用户的页面交互性），这会影响网络的性能。因此，浏览器已经针对这种情况进行了演变，以支持按照自己的时间表进行异步加载。这里有一些很好的讨论：

http://www.sitepen.com/blog/2010/07/16/asynchronous-commonjs-modules-for-the-browser-and-introducing-transporter/

一种可能在这里起作用的模式是 require() 实现确实同步阻塞，通过 XHR 获取文件然后对其进行评估，但这似乎与所有浏览器支持/基础架构运行，以进行基于文件的异步加载。我也很好奇这对浏览器安全的跨域原语有什么影响。

因此，为了适应浏览器异步加载模型，我们需要使用如下回调机制：

require("something.js", function () { // called later, after something.js has loaded! })

看起来 RequireJS 正在这样做：

http://requirejs.org/docs/start.html

也许试一试？

像 NodeJS 等 JavaScript 环境 - 提供从磁盘加载“本地”模块而不是外部网络主机 - 可以进行同步加载。

我将非常感谢 JS 专家的任何更正:-)

于 2011-03-09T20:58:06.820 回答