部署到Github Pages后未显示角度图像

编程问答 2022-08-13

问题描述

我是Angular的新手。我最近将示例网页部署到了Github Pages。我已成功部署，但是未显示在本地主机上可见的图像。相反，我在控制台上登录了404。

这是包含img的组件：

home.component.html： 

<div>
    <img src='assets/images/birthday.jpg' alt='Happy Birthday' width="385px"/>
</div>

我的目录结构是：

   |src
   |--app
   |--assets
    |---images
     |----birthday.jpg

dist文件夹中的目录结构为：

   |dist
   |--happy-birthday
    |--assets
     |---images
      |----birthday.jpg

我正在使用angular-cli-ghpages软件包进行部署。我的Angular版本是10.0.14。

解决方法

尝试使用/assets/images/birthday.jpg。

,

尝试显式给出相对路径（img相对于home.component.html的路径） 下面给出一个示例，但是根据您的目录结构，它可能会更改。

<div><img src='../assets/images/birthday.jpg' alt='Happy Birthday' width="385px"/></div>

angulargithub-pagesjavascript