用于SCSS的PhpStorm File Watcher无法编译node_modules

我正在为本地WordPress网站设计自定义主题。我已经在PhpStorm中设置了一个File Watcher, 它将myTheme / scss /中的scss文件编译为myTheme / style.css。
【用于SCSS的PhpStorm File Watcher无法编译node_modules】这可以按预期工作, 我在_variables.scss中声明的变量可以在style.css或之后导入的任何文件中使用。
我现在的问题是@import’ ?foundation-sites / dist / css / foundation.min.css’ ; 正在被编译为@import’ ?foundation-sites / dist / css / foundation.min.css’ ; 而不是实际的CSS内容。

用于SCSS的PhpStorm File Watcher无法编译node_modules

文章图片
我试过使用@import’ ../node_modules/foundation-sites/dist/css/foundation.min.css’ ; 而是以相同的方式编译。
我究竟做错了什么?
#1 import语句中的.css扩展名告诉编译器生成纯CSS导入, 而不是将内容拉入其中。请参阅https://github.com/sass/sass/issues/556#issuecomment-397771726作为参考。我建议将你的导入更改为@import’ ../node_modules/foundation-sites/dist/css/foundation’ -这应该有所帮助。注意?前缀是SASS编译器不知道的Webpack功能。因此, 在文件监视程序中使用SASS时, 你必须将路径更改为相对路径, 或将– load-path node_modules /传递给编译器
#2 我遇到了这个问题, 这为我解决了。取消选中仅跟踪根文件, 默认情况下已选中。
用于SCSS的PhpStorm File Watcher无法编译node_modules

文章图片

    推荐阅读