Question

我的目录结构如下：

example/
├── css/
│     ├── styles.css
├── img/
│     ├── background.jpg
└── src/
    ├── scss/
    │   ├── app.scss
    └── app.js

当我在app.scss中为背景图片指定绝对URL（例如background-image: url("/img/background.jpg");）时，它将正常工作。

但是，如果我指定相对URL，例如background-image: url("../img/background.jpg");，则构建过程将失败。

是否有一种方法可以强制Webpack忽略此类错误？

如果只是继续构建我的styles.css文件，那么它当然会通过相对URL正确加载背景，但是我无法做到这一点。

解决此问题很重要，因为否则您将被迫将网站部署到webroot中，并且不能使用子目录，因为绝对URL会在生产中中断。

感谢您的帮助。

Answer 1

忽略webpack中的文件解析错误是没有意义的，而且我认为没有办法。

但是从您的应用程序结构中，相对路径应为../../img/background.jpg

更新：

对不起，一开始出现了错误，我可以用sass和sass-loader重现您的问题，事实证明这是一个常见问题，sass-loader中有一个section ，他们提到了2个解决方案：

使用resolve-url-loader添加缺少的url重写。将其放在加载程序链中的sass-loader之前。



图书馆作者通常提供一个变量来修改资产路径。例如，bootstrap-sass具有$ icon-font-path