Yabble入门 - 浏览器端CommonJS模块加载

Question

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

我正在尝试使用Node.js，非常想创建可在服务器端和客户端交互使用的Javascript模块。这可能最终变成“因为它很棒”而非“实际而有用”的东西。

因此，基本上，我试图让CommonJS的require()方法对浏览器端的工作，而这正是Yabble是应该做的。但我不知道从哪里开始。我似乎无法找到除Yabble's Github readme中发现的文档以外的任何文档，这并没有什么帮助。

基本上所有我所做的就是把这个在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模块？

Answer 1

当加载JavaScript代码，将需要使用require()功能到浏览器中，进入点代码必须是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脚本的相同的静态分析和开始和结束。

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

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

... Yabble将仍然装载该模块。

Answer 2

在浏览器中同步加载模块是有问题的。的构建，如：

var x = require('something_remote.js') 

意味着浏览器将停止你的代码（即块），去获取远程文件，分析它，然后返回到您的出口。但是，这并不会影响单线程浏览器环境 - 我们会停止主要的JavaScript线程（并因此为用户提供页面交互性）来提高网络的性能。因此，浏览器已经演变成这种情况，以支持他们自己的时间表上的异步加载。有一些很好的讨论在这里：这可能会在这里工作是一个需要（）实现不同步块，获取通过XHR文件，然后evals它

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

一种模式，但似乎对所有运行用于基于文件的异步加载的浏览器支持/基础结构。另外，我很好奇浏览器安全性的跨域原语会带来什么样的影响。

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

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

看起来RequireJS是这样做的：

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

也许给一个镜头？

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

我将不胜感激从JS专家的更正:-)