Reactjs Sass图像url引用错误，链接导入 src images/image1.jpg sass/sass1.scss（背景图像：url（'../images/image1.jpg'）） folder1/folder2/sass2.scss（@import'../../sass/sass1'）

这是我的文件夹结构。当我尝试将sass1导入sass2时，图像的路径没有解析，因为sass加载程序希望图像路径与最终文件（即本例中的sass2）相对

sass加载程序搜索图像的路径是-'folder1/images/image1.jpg'，而不是'src/images/image1.jpg'

---

我使用webpack（v1）进行捆绑。

编辑此答案还应说明使用src/image1的webpack或捆绑之前的任何图像。 您需要确保图像的最终css路径相对于服务器上的css文件路径。（见下文最后一节）

给定文件夹目录

src/
  sass/
    sass1.scss
    sass2.scss
public/
  images/
    image1.png

scss2

@import "scss1"

scss1

.class {
  background: url("./images/image1.png")
 }

如果输出scss1.css被编译成css并置于公共位置，那么公共文件夹现在看起来像

src/
  sass/
    sass1.scss
    sass2.scss
public/
  images/
    image1.png
index.html
scss1.css 

---

图像应放在公用文件夹的“资产”文件夹中。。。又名“公共/资产”。这意味着，如果编译了样式，URL将相对于URL路径而不是项目文件夹。您还需要提供捆绑文件夹路径。图像将加载到公用文件夹中。但是，sass加载程序无法解决问题所在的路径。不是“sass/sass1.scss（背景图像：url（'images/image1.jpg'））”成功吗？是sass/sass1.scss成功了。但是，当我试图将sass1导入sass2时，sass2会搜索与其自身路径相关的图像。向上投票，因为它通常会工作，但我的情况有所不同。我们采取了新的方法@谢谢你的帮助。