Angular 应用程序未在托管的 Apache 服务器中加载图像
Angular application not loading images in hosted apache server
我有一个 angular 应用程序,我 运行 ng build --prod
命令并将 dist 文件夹中的文件部署到 /www/html/mywebsite 文件夹中的 apache 服务器 ubuntu DigitalOcean 中的虚拟机。
构建 angular 应用程序后,在 CSS 文件中调用的图像已进入 front 目录,即使它们最初位于 assets 目录中,如下面的屏幕截图所示。
这些图片在网站上显示正常,没有任何问题,但是在 HTML 文件中调用的所有图片都没有在网站上显示。我认为 assets 文件夹没有权限问题,因为 assets 文件夹中的 javascript 文件正在加载而没有任何问题。附上assets文件夹内文件权限的截图。
你能帮我解决这个问题吗?
由于您在 index.html 文件中设置基本 href 值,如下所示:
<base href="/sedsslweb/sedssl/">
在您的模板中,您将需要访问没有前导斜杠的图像,就像这样,以便它们形成正确的路径:
<img class="rounded-circle mx-auto" src="assets/images/Projects/serendib.png">
我刚刚通过编辑不带前导斜杠的图像路径检查了开发工具,并且可以看到图像加载正常。
我有一个 angular 应用程序,我 运行 ng build --prod
命令并将 dist 文件夹中的文件部署到 /www/html/mywebsite 文件夹中的 apache 服务器 ubuntu DigitalOcean 中的虚拟机。
构建 angular 应用程序后,在 CSS 文件中调用的图像已进入 front 目录,即使它们最初位于 assets 目录中,如下面的屏幕截图所示。
这些图片在网站上显示正常,没有任何问题,但是在 HTML 文件中调用的所有图片都没有在网站上显示。我认为 assets 文件夹没有权限问题,因为 assets 文件夹中的 javascript 文件正在加载而没有任何问题。附上assets文件夹内文件权限的截图。
你能帮我解决这个问题吗?
由于您在 index.html 文件中设置基本 href 值,如下所示:
<base href="/sedsslweb/sedssl/">
在您的模板中,您将需要访问没有前导斜杠的图像,就像这样,以便它们形成正确的路径:
<img class="rounded-circle mx-auto" src="assets/images/Projects/serendib.png">
我刚刚通过编辑不带前导斜杠的图像路径检查了开发工具,并且可以看到图像加载正常。