如何在没有模块支持的情况下使用 ember.js

Question

ember.js 的指南假设一个人拥有完整的 ES6 支持，例如http://guides.emberjs.com/v2.2.0/routing/specifying-a-routes-model/ 显示使用 export default 构造，但未指定任何替代方法来实现目标。但是，模块功能并未在 ember 支持的所有浏览器中实现。

如何在不支持模块的浏览器中使用这些功能？这些示例中的代码将如何转换为 ES5？

Answer 1

您应该考虑使用 Ember CLI http://ember-cli.com/

您用 ES6 编写代码，然后将其转换为 ES5。

Answer 2

文档假定您使用的是转译工具，因为推荐的工具 ember-cli 确实如此。除非你有充分的理由不使用它，否则你绝对应该研究一下。

但是，没有它也可以正常工作。例如，如果没有模块系统，Ember 会将 controller:posts.index 映射到 App.PostsIndexController。所以这应该适用于您 linked:

的示例

App.Router.map(function() {
  this.route('favorite-posts');
});

App.FavoritePostsRoute = Ember.Route.extend({
  model() {
    return this.store.query('post', { favorite: true });
  }
});

您也可以将 Ember 与您自己的模块支持结合使用。我成功地拥有了一个基于 rollup. It does require a bit more work though, to have the resolver 的 Ember 项目，找到了您的类（解析器 link 还记录了 ember 关联如何进行名称映射）。没什么难的，但是您必须构建一个简短的脚本来生成注册。

为 blessenm 编辑： Ember with rollup

不幸的是我不能分享这段代码，但它是这样工作的：

脚本扫描项目目录并通过在遇到的每个 .hbs 文件上调用 ember-template-compiler.js 来编译模板。
一个脚本（实际上是同一个脚本）扫描项目目录并生成主入口点。这很简单，如果它看到 gallery/models/collection.js 和 `gallery/routes/picture.js'，它会生成一个如下所示的主文件：
```
import r1 from 'gallery/models/collection.js';
import r2 from 'gallery/routes/picture/index.js';
// ...
Ember.Application.initializer({
    name: 'registrations',
    initialize: function (app) {
        app.register("model:collection", r1);
        app.register("route:picture.index", r2);
        // ...
    }
});
```
它应该只是将您的文件名映射到解析器名称。作为奖励，您可以控制目录的组织方式。
对生成的文件调用汇总。它将把所有东西整合在一起。我使用 IIFE 导出格式，跳过所有运行时间分辨率的混乱。我建议你设置 rollup to work with babel 以便你可以使用 ES6 语法。

我没有使用任何 ember 特定的模块，但添加它应该不会太难。我的猜测是，这主要是正确设置汇总导入解决方案的问题。据我所知，它可能开箱即用。

如何在没有模块支持的情况下使用 ember.js

How to use ember.js without module support

javascript

compatibility

ecmascript-5

ember.js

ecmascript-6