首页 > 解决方案 > 无法解析“E:\React\react-demo\src”中的“/images/img-2.jpg”

问题描述

这是我正在尝试添加图像的代码,但它显示错误

背景图片: url('/images/img-2.jpg');

编译失败。

./src/App.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src /App.css) 错误:无法解析“E:\React\react-demo\src”中的“/images/img-2.jpg”

标签: javascripthtmlcssreactjs

解决方案


因为您要求的图像不在src文件夹中!也许您正在尝试访问publicReact 项目文件夹中的图像。

我朋友的生活很简单,React - 使用 Webpack - 将 jpg/png..etc 图像转换为 base64,然后将 URL 替换为 base64 ......就像这样

在此处输入图像描述

因此,您需要在包含所有图像assets/images的文件夹内创建一个文件夹,然后在 CSS 中导入链接src

  background-image: url("./assets/images/logo512.png");

同样,React 会将图像转换为 base64!这将使图像不依赖于文件夹路径。


推荐阅读