【问题标题】:AngularJS: Bundle all partial views/templates for productionAngularJS:捆绑所有部分视图/模板以进行生产
【发布时间】:2014-11-15 09:15:39
【问题描述】:

我希望尽可能保持视图模块化。在实践中,这意味着我有很多小的通用 HTML sn-ps,实际的 HTML 页面是由它们组成的。现在ng-include 和带有templateUrl 的自定义指令非常适合我,但只是在开发中,因为每个 HTML sn-p 都是单独请求的。

在生产中,但是,我希望单页应用程序,嗯,在一个单页中,全部捆绑和缩小 - 就像 JavaScript 模块加载器(RequireJS、Component、Browserify、DuoJS等)对模块化 JavaScript 文件有作用。不接受用于加载 HTML 块的额外 HTTP 流量。

现在我很确定 AngularJS 不会进行开箱即用的捆绑(我现在已经找到了),但也许你们已经想出了一些办法来解决这个问题?

附:需要注意的是,我不是在寻找缓存相关的解决方案。

【问题讨论】:

  • 看看$templateCache。使用 grunt,您可以将所有模板合并到 JS 文件中。这样,当您的应用程序加载时,它不必通过 http 重新获取您的模板
  • FWIW,我最终将 Browserify 与 brfs 一起使用,因为这种工作流方式更方便。

标签: html angularjs views production-environment


【解决方案1】:

你可以使用grunt-angularjs-template

它确实将所有模板连接到一个文件中。根据其文档

Grunt 构建任务以连接和注册您的 AngularJS 模板 $templateCache

如果你正在使用 gulp,它的 gulp 等效项是 gulp-angular-templatecache

【讨论】:

    【解决方案2】:

    如果您使用的是 gulp,那么gulp-angular-embed-templates

    是一个不错的选择

    【讨论】:

    • 同意这样做更好
    猜你喜欢
    • 2019-05-01
    • 2012-06-30
    • 2018-06-03
    • 1970-01-01
    • 1970-01-01
    • 2016-10-04
    • 2019-11-15
    • 2016-10-09
    • 2023-03-06
    相关资源
    最近更新 更多