Bourbon with webpack：WebStorm 抱怨没有在 IDE 中解析 bourbon

Question

我已经成功配置并开始使用 webpack 工作 bourbon。我刚刚在 sass loader

中添加了以下内容

&includePaths[]=' + bbPath

在 SCSS 文件中我只是做

 @import "bourbon";

我现在可以正常工作了，因为我正在通过 scss 文件调用 mixins 并且我看到了输出，而且 webpack 也没有抱怨。

问题是在 WebStorm IDE 中指出上面的 @import 行无法解析 bourbon。

我试过

@import "~bourbon";

这让 WebStorm 很高兴，但是 webpack 失败了

Module build failed:
var path = require('path');
^
      Invalid CSS after "v": expected 1 selector or at-rule, was "var path = require("
      in /Users/test/node_modules/bourbon/index.js (line 1, column 1)

也许这里的错误是 WebStorm，有什么方法可以强制 WebStorm 理解@import bourbon 是有效的吗？

Answer 1

我相信你可以通过告诉 Webstorm 根资源路径来控制所有 scss 文件的路径。

WebStorm 文件菜单 --> 首选项 --> 目录 --> 右键单击您的 node_modules 目录并选中 Resource Root 选项。

设置后，WebStorm IDE 将知道您导入@'bla-bla' 文件。

Bourbon with webpack：WebStorm 抱怨没有在 IDE 中解析 bourbon

Bourbon with webpack: WebStorm complains about not resolving bourbon in IDE

sass

webstorm

bourbon

webpack

sass-loader