Angular 应用程序未在托管的 apache 服务器中加载图像

Question

我有一个 Angular 应用程序，我运行 ng build --prod 命令并将 dist 文件夹中的文件部署到 DigitalOcean 中 ubuntu VM 中的 apache 服务器 /www/html/mywebsite 文件夹。

Angular 应用程序构建完成后，CSS 文件中调用的图像已经到了最前面的目录，尽管它们最初位于 assets 目录中，如下图所示。

这些图像在网站上显示正常，没有任何问题，但在 HTML 文件中调用的所有图像都没有显示在网站上。我认为资产文件夹没有权限问题，因为资产文件夹中的 javascript 文件正在加载而没有任何问题。这里附上assets文件夹内文件的权限截图。

你能帮我解决这个问题吗？

Answer 1

由于您在 index.html 文件中设置基本 href 值，如下所示：

<base href="/sedsslweb/sedssl/">

在您的模板中，您需要访问不带前导斜杠的图像，如下所示，以便它们形成正确的路径：

<img class="rounded-circle mx-auto" src="assets/images/Projects/serendib.png">

我刚刚通过编辑没有前导斜杠的图像路径检查了开发工具，并且可以看到图像加载正常。