Html 带有SCSS的背景图像不'；t工作-`WebPackageMissingModule`错误

我使用带有网页包的SCS。我想用背景图像填充一个div。当我用HTML硬编码时：

<div class="plus-icon"
  style="background-image: url('graphics/plus-icon.png');">
</div>

我犯了这样的错误：

Uncaught Error: Cannot find module "./graphics/plus-icon.png"
>    webpackMissingModule @

/* ... */

./~/css-loader!./~/sass-loader!./src/stylesheets/main.scss
Module not found: Error: Cannot resolve 'file' or 'directory'
./graphics/plus-icon.png in /home/karol/GitProjects/monterail-test/src/stylesheets
resolve file
/home/karol/GitProjects/monterail-test/src/stylesheets/graphics/plus-icon.png
doesn't exist

/* ... */

正如我们所看到的，Webpack试图过早地加载我的PNG，并且错误地解释了给定的路径

---

如何修复它？

您需要使其相对于SCSS文件的路径，而不是相对于HTML文件

你见过这个解决方案吗？谢谢-但这并不能解决我的问题。我不想在编译时链接到我的图片，只是让它像用于CSS解释一样，这很好。当我将我的图标副本添加到location

stylesheets/graphics/plus icon.png

时，我在解释过程中遇到另一个奇怪的错误：./src/stylesheets/graphics/plus-icon.png模块解析失败：/home/karol/GitProjects/monterail test/src/stylesheets/graphics/plus-icon.png意外字符'�' （1:0）您可能需要适当的加载程序来处理此文件类型。SyntaxError:意外字符'�' （1:0）举个小例子可能会有所帮助。

Uncaught Error: Cannot find module "./graphics/plus-icon.png"
>    webpackMissingModule @

/* ... */

./~/css-loader!./~/sass-loader!./src/stylesheets/main.scss
Module not found: Error: Cannot resolve 'file' or 'directory'
./graphics/plus-icon.png in /home/karol/GitProjects/monterail-test/src/stylesheets
resolve file
/home/karol/GitProjects/monterail-test/src/stylesheets/graphics/plus-icon.png
doesn't exist

/* ... */