Bourbon with webpack:WebStorm 抱怨无法在 IDE 中解析 Bourbon [英] Bourbon with webpack: WebStorm complains about not resolving bourbon in IDE

问题描述

我已经设法使用 webpack 配置和使用波旁威士忌.我只是在 sass 加载器中包含了以下内容

I have managed to configure and get working bourbon with webpack. I just included the following on sass loader

&includePaths[]=' + bbPath

在 SCSS 文件中，我只做

In a SCSS file I just do

 @import "bourbon";

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

I now its working because I am calling mixins via scss files and I see the output, also webpack doesn't complain.

问题在于，在 WebStorm IDE 中，它指出上述 @import 行无法解析 bourbon.

Problem is that in WebStorm IDE it states that the above @import line that bourbon cannot be resolved.

我尝试过

@import "~bourbon";

这让 WebStorm 开心，但 webpack 失败了

which makes WebStorm happy but the webpack fails with

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 是有效的吗?

maybe the fault here is WebStorm, is there some way to force WebStorm to understand that the @import bourbon is valid ?

推荐答案

我相信你可以通过告诉 Webstorm Root Resource Path 来控制所有 scss 文件的路径.

I believe you can control the path of all scss files by telling Webstorm of the Root Resource Path.

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

WebStorm File Menu --> Preferences --> Directories --> Right click on your node_modules directory and check Resource Root option.

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

Once this is set then WebStorm IDE will know of your import @'bla-bla' files.

这篇关于Bourbon with webpack:WebStorm 抱怨无法在 IDE 中解析 Bourbon的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！