2
  • 源代码
    • 图片/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) 进行捆绑。

4

1 回答 1

2

编辑此答案还应考虑使用 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 并放在 public，那么 public 文件夹现在看起来像

src/
  sass/
    sass1.scss
    sass2.scss
public/
  images/
    image1.png
index.html
scss1.css
于 2017-03-30T11:14:41.763 回答