时间戳

首页 > 解决方案 > 不显示图像

reactjs - 不显示图像

问题描述

我正在使用 create-react-app，当我为生产目的构建项目时，在显示从 SCSS 文件调用的资产时遇到问题。

这是我的构建层次结构：

    - index.html
    - assets/
        - arrow2.svg
    - static/
        - css/
        - js/

样式.scss：

&.card {
    background: $green700;
    border-color: $green700;
    color: #fff;
    &:after{
        background-image: url("/assets/arrow2.svg");
    }

package.json 包含"homepage": "."

使用当前background-image值，我没有错误，它在本地工作，但不在我的服务器上。

很确定我在某个地方的设置搞砸了。

编辑：我想更好地指出问题。目前，服务器正在从这个 url 询问图像： http://server.com/assets/arrow2.svg 但实际的应用程序位于，/react-app因此图像应该相对取自： http://server.com/react-app/assets/arrow2.svg

当我尝试./assets/arrow2.svg在 style.scss 中使用时，我收到一个错误，即无法找到该文件并且无法运行构建。

标签： reactjs

解决方案

如果您使用 Git 或 Heroku，照片需要位于“公共”文件夹中。

推荐阅读