Fix linting errors for SCSS files where global variables are used

I've generally followed the "import variables at the top of the file" workflow for working with SCSS files in PHPStorm, mainly to quieten the linting errors that PHPStorm shows.

However, I've just joined a project where they're using a master import list in "main.scss" and all imported / child files are presumed to find the globals available.

However, this causes PHPStorm to have a field day with warnings squigglies!

Is there a way to configure PHPStorm to determine global variables already imported / defined in the main.scss file, and have all the other files behave as normal?

6 comments
Comment actions Permalink

They're separate issues TBH:

  • This one is about global variables.
  • The other is about getting PHPStorm to understand that compass mixins like `breakpoint()` mixin should come from the local `node_modules` folder not the configured (Ruby) Compass folder  
0
Comment actions Permalink

What warnings do you see? Smth like 'Variable resolved by name only'? PhpStorm uses the following approach for elements resolving in SASS:

1. If element can be resolved to declaration from current file or from explicitly imported files, then it is just resolved


2. If element has not be resolved after the first step (declaration is not found in current file/files explicitly imported into current file) then it is be resolved just by name no matter which file it's declared in ('global' elements). Resolved element is marked by weak-warning inspection 'Resolved by name only'. You can disable this inspection if you don't like to see these warnings.


3. If element still not resolved it is marked with warning 'Unresolved something'.

0
Comment actions Permalink

OK, I see.

Does that mean if it a) sees a variable / mixin reference and b) detects a same-named source anywhere in the project it assumes it's going to otherwise be declared as a global?

Will it still hyperlink?

Happy to disabled warnings if warnings are just being over-sensitive :)

Also, regarding warning messages, I seem to have quietened them already - perhaps by marking folders as resource routes.

FYI: I generally find this kind of setup stuff takes longer than I would like, as it only comes up when starting new projects, which could be once every few months, or less, depending on the length of contract (so thanks for your help!)

0
Comment actions Permalink

>Does that mean if it a) sees a variable / mixin reference and b) detects a same-named source anywhere in the project it assumes it's going to otherwise be declared as a global?

If it detects an element that is not available through imports chain (not explicitly imported), but defined in one of project SASS files, it still resolves it, allows navigating to declaration, renaming, etc. But, as we can't know if this element is 'global' or just not imported by mistake, it shows a weak warning

>Will it still hyperlink?

yes - see above

0
Comment actions Permalink

Brilliant. Thanks for helping me understand this :)

0

Please sign in to leave a comment.