Question

我在使用angular2在app中包含图片，脚本或css时遇到问题。我在/app-name/img/image.jpg文件夹中有图片，而<img>标签位于。{ /app-name/src/app/my-component/my-component.component.html：

<img src="../../../img/image.jpg">

当我加载页面时，我收到错误：获取http://localhost:4200/img/image.jpg 404（未找到）

如何在angular2中创建网址？同样的问题是当我在index.html中添加脚本URL时。

感谢您的建议。

Answer 1

如果您使用angular-cli来构建项目。

您需要将img目录包含在需要复制到输出（可部署）目录的资产列表中。

在.angular-cli.json文件中，将img目录添加到以下数组中：

apps[0].assets

然后你可以使用如下

<img src="img/image.jpg">

这就像是

"apps": [
{
  "root": "src",
  "outDir": "dist",
  "assets": [
    "assets",
    "img"
  ],

Answer 2

好像您没有将img文件夹包含在src文件夹中，因此，请尝试将其放在那里并将src属性值调整为/img/image.jpg

一般情况下：确保您要在应用程序中使用的所有内容都在src文件夹中。那里的内容（只有那些内容）最终会用于处理（转换，捆绑，缩小等），然后最终进入网络服务器。

src文件夹之外的所有其他文件用于其他目的，例如配置文件，node_modules，dist文件夹等