Question

我通常在这里寻找答案，但我终于到了无法找到答案的地步。

我希望构建一个ember应用程序，它最初仅加载它所需要的东西才能启动并打开主路径。所有其他控制器，视图，模板等将在特定路径被触发时延迟加载。

我找到了一个如何在这里完成这个的好例子： http://madhatted.com/2013/6/29/lazy-loading-with-ember

我的主要问题是确定哪些构建工具支持这种延迟加载应用程序代码的理论？到目前为止，我已经看到Brunch，Yeoman和Ember App Kit似乎缩小并连接了所有脚本和模板。我很擅长缩小，但需要将这些文件分开。我已经考虑过将这些代码放入app / assets位置，以便在没有concat的情况下将其复制，但不会缩小。

有没有人有解决方案？谢谢！

Answer 1

您可以通过将以下内容添加到您的早午餐配置

来实现早午餐

files: {
    javascripts: {
        joinTo: {
            'javascripts/app.js': /^app(\/|\\)(?!admin)/, // concat everything in app, except /app/admin
            'javascripts/vendor.js': /^vendor/,
            'javascripts/admin.js': /^app(\/|\\)admin/ // concat only /app/admin
        }
    }
}

Grunt（在yeoman和ember app kit中使用）非常灵活，所以我相信你可以通过潜入Gruntfile.js来设置相同的东西

Answer 2

问题是：“我正在构建一个ember应用程序，该应用程序最初只需要启动并打开主要路径所需的东西。所有其他控制器，视图，模板等将在懒惰时加载特定路线被触发。“。

当页面加载时，Ember希望在那里有任何需要的东西。我不会错，但延迟加载路线似乎不是Ember的特征。 Ember CLI是一样的。它使用捆绑和缩小来减少过载。但是一切都应该在那里使它发挥作用。

相反，像我这样的人只想在需要时加载东西。

当您尝试在Ember中实现延迟加载时，所有内容都应该由模块（file.js）表示：路由，模块;控制器，模块;等等。您应该遵循一个模式（如POD），应用一种机制来查找它们应该存在的位置。每个模块都应该知道它的依赖关系。但其中一些非常频繁（路线，控制器，模板）。您应该为浏览器使用模块加载器。它可以是requirejs或任何你喜欢的。但是ES6就在门口。让我们考虑一下。

许多人使用beforeModel钩子来实现结果。我做了它，如果你不使用link-to组件，它就可以了。否则一切都会崩溃。为什么？由于href计算属性。插入link-to后，会为其计算href。因此，Ember会查找链接所指向的路线。如果路由不存在，则从route:basic创建一个。

解决方案可以是预加载页面中插入的所有link-tos所代表的所有路由。太贵了！

可以在Lazy loading route definitions in Ember.js

找到与此答案的集成

对于在POD中组织的路由延迟加载的初始解决方案，请查看https://github.com/ricottatosta/ember-wiz。它是一种基于ES6的方法，它在SystemJS上作为模块加载器进行中继。

懒惰加载的灰烬应用程序

2 个答案: