Ember没有在生产中加载一些图像 [英] Ember isn't loading some images in production

问题描述

我有一个Ember-cli 1.13应用程序，其中有很多图像存储在公共目录中。现在，它将正确加载除特定组件中的图像之外的所有图像。

I have an Ember-cli 1.13 app that has a lot of images stored in the public directory. Now, it will correctly load all images except those in a particular component.

该组件的调用如下：

{{list-item url="list-url" name="List Name" price="240"}}

在内部，组件是这样的：

Internally, the component is this:

<a href="http://example.com/{{url}}">
  <img src="/{{url}}.png" alt='Picture of the {{name}}' />
  <p class="item-name">{{name}}</p>
  ...
</a>

当我构建应用程序并启动到heroku时，损坏的路径是

When I build the application and launch to heroku the broken path is

https://ridiculous-name-123123.herokuapp.com/list-item.png

除了明显不同的域外，其与localhost路径相同。

Which is the same as the localhost path except with a different domain obviously.

所有其他图像在不与组件一起使用时有效。

All of the other images work when not used with components.

我哪里错了？

推荐答案

当你构建时一个生产环境你的资产经历了一个名为指纹识别的东西。

When you build with a production env your assets undergo something called fingerprinting.

这里的问题似乎是你的内置网址链接到非指纹文件，一种解决方案是将这些图像移动到一个文件夹中并将它们从在 ember-cli-build.js中进行指纹识别：

What appears to be the problem here is that your "built" url links to the un-fingerprinted file, one solution would be to move these images into a folder and exclude them from being fingerprinted, in your ember-cli-build.js:

var app = new EmberApp({
  fingerprint: {
    exclude: ['myComponentImages/']
  }
});

更好的解决方案是拥有完整的网址或传递更改显示图像的类，因为它看起来这些是静态资产，而不是用户上传的内容。

A better solution would be to have the full url or pass a class that changes the image displayed since it looks like these are static assets and not user uploaded content.

这篇关于Ember没有在生产中加载一些图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！