ember.js - 使用 ember 清单插件答案

【问题标题】：ember.js - using the ember manifest pluginember.js - 使用 ember 清单插件
【发布时间】：2016-06-29 18:58:34
【问题描述】：

我想在我的 ember 应用中有一个清单，因为我想在移动设备上使用它并具有一些离线功能。

我找到了插件 ember-cli-deploy-manifest： https://github.com/ember-cli-deploy/ember-cli-deploy-manifest 它在自述文件中有详细记录，看起来很有希望。

但是我该如何使用这个插件呢？

我已经使用这个命令安装了它：

ember install ember-cli-deploy-manifest

我使用这个命令构建我的应用程序：

ember build -prod

没有创建清单。我可能错过了一些简单的步骤，但无法弄清楚。如何告诉 ember build 使用插件？

更新

我遵循了以下答案评论中的建议。我放弃了使用清单插件并手动创建了一个清单文件。然后挑战是在清单文件中获取正确的指纹文件名。

在我的 ember-cli-build.js 文件中，我有：

module.exports = function(defaults) {
    var app = new EmberApp(defaults, {
      fingerprint: {
        exclude: [],
        extensions: ['js', 'css', 'png', 'jpg', 'gif', 'map'],
        replaceExtensions: ['html','css','js', 'appcache']
      }
    });
 ...

我的清单文件名为 eea.appcache，位于 /public 文件夹中。它在构建期间被复制到 dist 文件夹。但是，文件的内容（文件名列表）不会被指纹识别。其他文件（html、css、js）中的文件名已正确识别。

这是我的public/eea.appcache:

CACHE MANIFEST
# 2016-03-15
# V 1.0

CACHE:
index.html
assets/vendor.css
assets/eea.css
assets/vendor.js
assets/eea.js
assets/img/Icon120x120.png

我的构建步骤仍然是：

ember build -prod

如何获取使用 MD5 指纹更新的清单文件中的文件名？

【问题讨论】：

ember-cli-deploy-manifest 与 ember-cli-deploy ember-cli.com/ember-cli-deploy 一起使用。

标签： ember.js ember-cli cache-manifest ember-cli-addons

【解决方案1】：

我终于让它工作了，但这个解决方案真的很hack'ish。我通过反复试验发现了这一点。

broccoli-assets-rev 在解析文件以查找文件名时有一些棘手的规则。清单文件中通常使用的格式，解析器找不到文件名。

但是，如果文件在文件的 cmets 中用引号列出并且使用了正确的路径，它将起作用。如果清单文件位于公共文件夹的根目录中，它将最终位于网页的根目录中。然后路径将如下所示。

我的文件如下所示：

CACHE MANIFEST
# 2016-03-15
# V 1.1
# '
# 'assets/vendor.css'
# 'assets/eea.css'
# 'assets/vendor.js'
# 'assets/eea.js'
# 'assets/img/Icon120x120.png'

CACHE:
index.html
assets/vendor.css
assets/eea.css
assets/vendor.js
assets/eea.js
assets/img/Icon120x120.png

NETWORK
*

那么生成的构建文件如下所示：

CACHE MANIFEST
# 2016-03-15
# V 1.1
# 
# 'assets/vendor-d41d8cd98f00b204e9800998ecf8427e.css'
# 'assets/eea-ddacde3bdf32d3f94c5a01a2054c6f72.css'
# 'assets/vendor-3229c2c849c3d52c0b362d9fee2106ad.js'
# 'assets/eea-4c760118f51f7402db2f0b6074b6960b.js'
# 'assets/img/Icon120x120-40b31b55211fb293dedf556a648aa47e.png'

CACHE:
index.html
assets/vendor-d41d8cd98f00b204e9800998ecf8427e.css
assets/eea-ddacde3bdf32d3f94c5a01a2054c6f72.css
assets/vendor-3229c2c849c3d52c0b362d9fee2106ad.js
assets/eea-4c760118f51f7402db2f0b6074b6960b.js
assets/img/Icon120x120-40b31b55211fb293dedf556a648aa47e.png

NETWORK
*

【讨论】：

【解决方案2】：

ember-cli-deploy-manifest 用于ember-cli-deploy。

因此，您需要在安装 ember deploy 后运行 ember deploy -production。

安装 ember-cli-deploy

ember install ember-cli-deploy

然后

ember deploy -production

【讨论】：

如果你真的想要一个清单，你可以在你的ember-cli-build.js文件中使用已经安装的github.com/rickharrison/broccoli-asset-rev，你可以添加fingerprint: { enabled: true, extensions: ['js', 'css', 'png', 'jpg', 'gif', 'map', 'svg'], generateAssetMap: true }