Html css背景图像中公用文件夹的反应路径

我正在使用Create React应用程序，我想为我的标题部分添加背景图像，我是这样做的：

background-image: url('~/Screenshot_11.png');

在此之后，我得到了以下错误：

./src/styles/main.scss （./node_modules/css loader/dist/cjs.js？？ref--6-oneOf-5-1！。/node_modules/postss loader/src？？postss！。/node_modules/sass loader/lib/loader.js？？ref--6-oneOf-5-3！。/src/styles/main.scss） 未找到模块：您试图导入 ../../../../../../../Screenshot_11.png位于 项目src/目录。src/之外的相对导入不是 支持

我已经在package.json中设置了主页

"homepage": "http://localhost:3000",

---

在我以前的项目中，它可以正常工作，但今天我无法正确导入它。

他们已经改变了这一点，但我不知道为什么。工作路径：

background-image: url('/Screenshot_11.png');

编辑2021

对于认为它不起作用的人：

---

您可以将该图像作为

import Background from './Screenshot_11.png'

和使用

background-image: `url(${Background})`

---

对于公用文件夹中的图像，这仍然不适用

于2021年3月19日更新

关于使用in.css文件

在CreateReact应用程序（react脚本）包v4.x中，这似乎是一个突破性的更改（将被视为bug？）。
更准确地说，是在“css加载器”v4.x包中。
3.x分支机构可以正常工作

以下是github回购协议的相应问题：

（事实上，没有更多的了）

还没有修复。（将是？）
但这里提到了一些变通办法。 使用哪一个。。。我想这取决于你的项目

一些变通办法：

• 降级到反应脚本3.4.x

• 不要在CSS文件中使用url:）您仍然可以在.JSX（内联样式）中使用。或者放入.html。它们显然不是由css加载器处理的

• 重新配置网页包以将url:false添加到css加载程序选项（弹出CRA或使用this:或this: （您可以在github问题页面上找到示例配置）

• 使用css加载器的这个新特性 （在5.1.0中发布，当前的最新版本是5.1.3；要使用该版本，您可以将以下内容添加到package.json：“resolutions”：{“css loader”：“5.1.3”}（在根级别））

---

~

通常指向操作系统上的默认位置（我想）。您是否尝试过：

背景图像：url（'./Screenshot\u 11.png'））

不工作您保存了我的一天。Thx。这对我处理公用文件夹中的图像仍然不起作用。您需要查看“开发工具”中的“网络”选项卡，看看您请求的路径可能会对您有所帮助。对于像我这样努力在SRC文件夹中制作CSS的人，要处理公用文件夹中的图像，请参阅e此处建议将图像移动到SRC文件夹的解释，如链接中所述，“您不应该公开需要图像；构建过程将在编译时将图像从SRC/复制到build/（并相应地更新路径）。”@JamesHubert请向我们发送一个例子，当这不起作用时帮助我使用react脚本v4和样式化组件。谢谢。