在css文件中导入图像以进行反应

Question

我正在尝试使用来自 public/assets/subtract.png 的图像，但无法解析

这是：

body {
  background-image: url("./assets/subtract.png");
}

问题是这样的：

./src/styles/index.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src/styles/index.css)
Error: Can't resolve './assets/subtract.png' in 'E:\xampp\htdocs\learning\my-app\src\styles'

即使我试图将它放在公共文件夹中而不是内部资产中，它也会给我错误

Answer 1

Error: Can't resolve './assets/subtract.png' in 'E:\xampp\htdocs\learning\my-app\src\styles'

正如您在此错误中看到的那样，css 尝试访问 /src/styles/assets/subtract.png 中的图像，我假设您的图片实际上位于 /assets/subtract.png 所以试试这个：

body {
  background-image: url("/assets/subtract.png");
}

Answer 2

请仔细检查文件路径，并根据文件位置重新映射路径。