reactjs 在React js中构建时不显示背景图像

wlp8pajw  于 2023-02-15  发布在  React
关注(0)|答案(3)|浏览(346)

嗨,我的应用程序运行良好的localhost,但当我创建构建然后背景图像不显示。我的代码是。

<div  style={{ backgroundImage:"url("+require("assets/img/bg.jpg")+")", height: "400px",
                      backgroundSize: "cover",
                      backgroundPosition: "center top"}}>

本地主机的结果如下x1c 0d1x
但在实时服务器中,路径为

的标头为空
当我检查这个路径,然后显示像这样. background-image:网址(./static/media/bg6.488bc24...jpg);请帮忙谢谢

ddhy6vgd

ddhy6vgd1#

您可以尝试在函数外部导入图像,而不是要求它。
附言:-你可以友好地附上你的构建文件夹的SS进一步的信息。

bxjv4tth

bxjv4tth2#

也许,在构建时,程序定义的路径被改变或指定到一个不需要的资源。你可以尝试修改你的DOM并应用css,通过添加一个专用的标记,如下所示:

<img
          id="background-image"
          src="./assets/img/bg.jpg"
          alt="background-image"
         />
wz3gfoph

wz3gfoph3#

把你的文件放到公共文件夹中,并将require替换为string with path。
例如,将文件放入public/assets/img/bg.jpg
并更改路径:

{
  backgroundImage: "url(/assets/img/bg.jpg)"
  ...
}

或者你可以使用import并把导入的图像放到img中(src prop)。

相关问题