Javascript Ember.js 和 RequireJS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8776151/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ember.js and RequireJS
提问by Jonesy
Has anyone had much success with RequireJS and Ember.js? Seeing as Ember likes to have its structure assigned to a global object I'm finding that it can really butt heads with Requirejs. Would something like LAB.js work better for Ember?
有人在 RequireJS 和 Ember.js 方面取得了很大的成功吗？看到 Ember 喜欢将其结构分配给全局对象，我发现它确实可以与 Requirejs 对接。像 LAB.js 这样的东西会更适合 Ember 吗？
采纳答案by Claude Précourt
EDIT(2012-01-30): I pushed a more complete example in a repoon bitbucket.
编辑（2012-01-30）：我在一个关于 bitbucket的repo 中推送了一个更完整的例子。
I have successfully used RequireJS to load Ember.js as well as the datetime addon (github). The Ember namespace itself stays global, but all of my application's data, including my instance of Ember.Application, is kept within modules through RequireJS. I'm also loading the handlebars templates using the 'text!' plugin.
我已经成功地使用 RequireJS 来加载 Ember.js 以及日期时间插件 ( github)。Ember 命名空间本身保持全局，但我的应用程序的所有数据，包括我的 Ember.Application 实例，都通过 RequireJS 保存在模块中。我还使用“文本！”加载把手模板 插入。
I haven't had any issue yet, but this is not a complete application, more of a proof of concept. Here's how I made it work. I can load my application directly with Safari without the need of a server. You would still need a server to load it with Chrome, which doesn't let JavaScript load files from the filesystem.
我还没有遇到任何问题，但这不是一个完整的应用程序，更多的是概念证明。这是我如何使它工作。我可以直接使用 Safari 加载我的应用程序，而无需服务器。您仍然需要一个服务器来使用 Chrome 加载它，它不允许 JavaScript 从文件系统加载文件。
1)Because Ember.js uses BPM/Spade, I couldn't use a clone of the repo. Instead I'm wrapping the compiled version within a module:
1)因为 Ember.js 使用 BPM/Spade，所以我不能使用 repo 的克隆。相反，我将编译后的版本包装在一个模块中：
lib/ember.js:
库/ember.js：
define(['jquery',
'plugins/order!lib/ember-0.9.3.js',
'plugins/order!lib/ember-datetime.js'],
function() {
return Ember;
});
Note that this in itself doesn't hide Ember from the global scope. But I'm setting things up so that if, in the future, I'm able to do hide it, every other module which depends on this module will still work as-is.
请注意，这本身并没有在全局范围内隐藏 Ember。但是我正在设置这些东西，以便将来如果我能够隐藏它，依赖于该模块的每个其他模块仍将按原样工作。
2)Modules can refer to Ember like so:
2)模块可以像这样引用 Ember：
app/core.js:
应用程序/core.js：
define(['lib/ember'], function(Em) {
MyApp = Em.Application.create({
VERSION: "0.0.1"
});
return MyApp;
});
Here, "Em" could have been named something else; it doesn't refer directly to the global variable, but comes from the module defined in lib/ember.js.
在这里，“Em”可以被命名为别的东西；它不直接引用全局变量，而是来自lib/ember.js 中定义的模块。
3)To be accessible by Ember, handlebars have to be registered:
3）要被 Ember 访问，必须注册车把：
app/templates/my-template.handlebars:
app/templates/my-template.handlebars：
MyApp v{{MyApp.VERSION}}.
app/views/my-view.js:
app/views/my-view.js：
define(['lib/ember',
'plugins/text!app/templates/my-template.handlebars'],
function(Em, myTemplateSource) {
Em.TEMPLATES["my-template"] = Em.Handlebars.compile(myTemplateSource);
var myView = Em.View.create({
templateName: "my-template";
});
return myView;
});
4)I'm using require-jquery.js(jQuery and RequireJS bundled together).
4)我正在使用require-jquery.js（jQuery 和 RequireJS 捆绑在一起）。
回答by Rohan Chitambar
There is a better way to include a handlebar file which can have multiple template blocks. Which can get compiled and available in one include.
有一个更好的方法来包含一个可以有多个模板块的把手文件。可以在一个包含中编译和使用。
for eg: You have the following Handlebars template file:
例如：您有以下 Handlebars 模板文件：
../templates/sample.handlebars
../templates/sample.handlebars
<div><!-- just a filler html tag. Wont show up in your page -->
<script type="text/x-handlebars" data-template-name="template1">
Some Html or Template Content ...
</script>
<script type="text/x-handlebars" data-template-name="template2">
Some Html or Template Content ...
</script>
<script type="text/x-handlebars" data-template-name="template3">
Some Html or Template Content ...
</script>
</div>
../views/sampleView.js
../views/sampleView.js
define([
'jquery',
'lib/ember',
'plugins/text!../templates/sample.handlebars'],
function($, Em, myTemplateSource) {
// Bootstrap method accepts a context element under which all handlebars
// template blocks are defined. The filler <div> in this case.
// Compiles and assigns to the EM.TEMPLATES hash correctly.
Em.Handlebars.bootstrap($(myTemplateSource));
var myView = Em.View.create({
templateName: "template1";
});
return myView;
});
回答by Fernando Gm
I've just uploaded to github a starter-kit for EmberJS+RequireJS, You could check it https://github.com/fernandogmar/Emberjs-RequireJS
我刚刚将 EmberJS+RequireJS 的入门套件上传到 github，您可以查看https://github.com/fernandogmar/Emberjs-RequireJS
Any good suggestions will be highly appreciated. Have Fun!
任何好的建议将不胜感激。玩得开心！
回答by Christos
Ember CLI supports ES6 module syntax which transpiles to AMD. Seems like the community is getting behind Ember CLI as the preferred way to use Ember.
Ember CLI 支持转译为 AMD 的 ES6 模块语法。似乎社区正在支持 Ember CLI 作为使用 Ember 的首选方式。
回答by David Bashford
Mimosa has a few good example projects using Ember and Require.js. Here's one to checkout: https://github.com/dbashford/mimosa-ember-emblem-templates. The instructions to get it going it are in the README.
Mimosa 有一些使用 Ember 和 Require.js 的很好的示例项目。这里有一个结帐：https: //github.com/dbashford/mimosa-ember-emblem-templates。实现它的说明在自述文件中。
