私はSass(SCSS)の新人です。 Sassでは7-1 pattern
をフォローしており、現在、PhpstormをIDEとして使用しています。
すべての_<name>.scss
ファイルをmain.scss
ファイルという1つのメインファイルにインポートします。
問題
私は_variables.scss
ファイルで色変数を定義していますが、他の.scssファイルでそれを使用すると、PhpStormは次のようなエラーを出します
要素 'Gutter-horizontal'(variable name)は、明示的なインポートを使用せずに名前によってのみ解決されますmore ...
また、私のIDE=のスクリーンショットも提供しています。これで、私のフォルダの構造がわかります。
私はインターネット全体をチェックしましたが、解決策を見つけることができません。これはこれの重複した質問ではありません 質問 わかりました!!
_variables.scss
をscssファイルにインポートすると、エラーが発生します。
それで、すべてのscssファイルにvaiables.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';
いいえ、あなたはそれを正しくやっています。 main.scssファイルを1つ用意し、変数がfirstインポートするものであることを確認します(そうしないと、他のファイルで未定義の変数の問題が発生します)。それらがすべてmain.scssファイルに含まれている限り、各ファイルの変数を再インポートする必要はありません。
私は通常、このPhpStormエラーを無視しますが、オフにすることもできます。
File
-> Settings
に移動しますEditor
-> Inspections
Sass/SCSS
右パネルResolved by name only