元素$ variable仅按名称解析,而无需在Sass PhpStorm中使用显式

CSS

Gil

2020-03-24

我是Sass(SCSS)的新手。在Sass中,我遵循7-1 pattern,目前正在将Phpstorm用作IDE。

我将所有_<name>.scss文件导入一个名为main.scssfile的文件中。

问题

我在_variables.scss文件中定义了颜色变量,但是当我在其他.scss文件中使用它时,PhpStorm会给出如下错误

元素'gutter-horizo​​ntal'(变量名)仅按名称解析,而不使用显式导入。

我还提供了我的IDE的屏幕截图,因此,您知道我的文件夹的结构。

在此处输入图片说明

我检查了整个互联网,但找不到任何解决方案,这不是这个问题的重复问题,好!

当我将我_variables.scss的scss文件导入时,错误消失了。

在此处输入图片说明

那么,我需要导入vaiables.scss所有的scss文件还是做错了什么?

我不明白这个问题来自哪里?Sass还是PhpStorm?

variables.scss

// COLORS

$color-primary: #55c57a;
$color-primary-light: #7ed56f;
$color-primary-dark: #28b485;
$color-gray-dark: #777;

$color-black: #000;
$color-white: #fff;

// GRID

$grid-width: 114rem;
$gutter-vertical: 8rem;
$gutter-horizontal: 6rem;

main.scss

@charset "UTF-8";

@import 'abstracts/variables';
@import 'abstracts/functions';
@import 'abstracts/mixins';

@import 'base/animations';
@import 'base/base';
@import 'base/typography';
@import 'base/utilities';

@import 'components/buttons';

@import 'layout/header';
@import 'layout/grid';

@import 'pages/home';

第3362篇《元素$ variable仅按名称解析,而无需在Sass PhpStorm中使用显式》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android