如何确保 webpack-dev-server 在使用自定义 Sass 导入器时重新编译 Sass?



我正在使用自定义的 Sass 导入器,它可以让我将 JavaScript/JSON 文件导入我的 Sass 中。我遇到的问题是,当我保存一些导入到我的 Sass 中的 JavaScript 文件时,它在使用webpack-dev-server时不会触发热更新/重新加载。

如果我也在主应用程序的 JavaScript 中导入有问题的文件,保存它按预期工作(它将触发成功的重新编译(。

对于更多上下文,我有一个具有index.js文件的 UI 组件。在这个index.js文件中,我正在导入一个 Sass 文件。在这个 Sass 文件中,我正在导入我的 JavaScript 文件,该文件在保存时不会触发重新加载。

我不确定这是 Node-Sass 问题还是 Webpack 问题,但其他一切都按预期工作。我可以将其他 Sass 文件导入主 Sass 文件,保存这些文件将触发热重载/更新。

我深入了解了这一点。在我的自定义 Sass 导入器中,我返回时带有:

{ contents: "String" }

。根据 Node-Sass 文档。我应该返回:

{ 
file: "String",
contents: "String" 
}

file是导入文件的计算路径。如果不传递这个,Node/Webpack 将不会知道该文件,因此不会监视它的更改。

最新更新