Javascript 将组件资产放在其自己的目录中

我用的是角度6

我知道如何通过以下方式访问图像：

http://localhost.com:4200/assets/image.png

通过将该图像放在路径上：

/src/assets/image1.png

/src/app/components/mycomp

但现在我正在做一个组件，它正在运行：

/src/assets/image1.png

/src/app/components/mycomp

然后我想使用另一个

image2.png

，它将仅由该组件使用。然后我不想像第一个案例那样把这个图像放在一个全局目录中。相反，我想将该图像放在以下位置：

/src/app/components/mycomp/assets/image2.png

目标是使该组件易于移植

另外，在文件中：

mycop.component.css

我将引用该文件

到底是怎么做的

在这个项目中，我将有许多单独的组件，每个组件都有多个不同的资产，我不想混合所有这些资产。我希望每个组件都有自己的空间/目录

---

是否仍要实现此目标？

您可以通过使用base64转换器（例如）对图像进行编码来解决任务。 如果您的图像可以转换为SVG，您还可以将它们嵌入到模板中。

---

希望这能对您有所帮助。

最简单的方法就是将它们放在

assets

中的子目录中，因此

src/assets/mycomp/image2.png

就是一个例子，但是如果我使用：

src/assets/mycomp/image2.png

那么我就不会将组件资产包装到它自己的目录中，这会破坏这个组件的可移植性。还有其他想法吗？在这种情况下，对于包含静态资产的每个目录，您需要将它们添加到angular.json（或angular-cli.json，具体取决于您的版本）