Allow include Paths for SASS plugin

Currently i'm mocking a web and i'm using Grunt and grunt-sass for that reason my @imports in the .scss files are

 
@import "foundation";
  
my Gruntfile.js has something like 
 
 
module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    sass
: {
      options: {
        includePaths: [
            'bower_components/foundation/scss',
            'bower_components/foundation-icon-fonts'
        
]
      },
      dist
: {
        options: {
          outputStyle: 'compressed'
        
},
        files
: {
          'css/app.css': 'scss/app.scss'
        
}        
      }
    },
 
  ...
 
but webstorm mark this with a "Cannot resolve import...". This does not stop me to continue developing but this error is annoying


Attachment(s):
Captura de pantalla de 2014-11-20 09:53:34.png
8 comments
Comment actions Permalink

You can try marking 'bower_components/foundation/scss' as resource root (mark directory as/resource root) to get the paths resolved relative to this folder

1
Comment actions Permalink

Hi Elena, that does not work.

For example, given this directory structure is:

    a/main.scss
    b/dep.sss

And "b" is marked as a content root.

IntelliJ can resolve the following import (incorrect from the Sass perspective):

    @import "/dep";

But IntelliJ cannot resolve the following import (correct from the Sass perspective):

    @import "dep";

This is a show-stopping bug for Sass support.

0
Comment actions Permalink

Hi Gleb,

it does work. See screenshot:

as you can see, `errors/global.scss` imports `root/values.scss` (where `root` is marked as Resources root) via 

@import "values";

, and IDEA doesn't show errors and correctly navigates to the file

0
Comment actions Permalink

Could this be something that got fixed recently? I am using IntelliJ 2016.3.1 Ultimate.

I've also opened an issue about this on the tracker https://youtrack.jetbrains.com/issue/IDEA-167628

Also, my resource root is actually in another Module that is a "Compile" dependency of this module.

 

So my structure is somewhat like this:

/google3/a/b/c <- module A, depends on module B as "Compile"
/google3 <- module B, marked as resource root

Files:

* /google3/a/b/c/scss/a.scss

* /google3/a/b/c/scss/b.scss:
  

    import "a/b/c/scss/a"; <-- does not resolve! 

    import "/a/b/c/scss/a"; <-- does resolve, but is not valid from Sass perspective, so does not compile!

0
Comment actions Permalink

Different IDEA modules is likely the issue. What module types do you use (Java, etc.)? Any facets enabled?

0
Comment actions Permalink

No facets are enabled. I tried this with Java and Python module types. Posted this to the youtrack issue.

0
Comment actions Permalink

I've recreated the issue and attached test project to the ticket. Not sure if the structure I've used matches yours (from your description, your configuration looks rather weird - one module is deeply nested in another, nested module depends on outer one, and your scss files seems to belong to both modules?)

0
Comment actions Permalink

Thank you, Elena!

Yes, it's a weird configuration, and this has to do with our monorepo structure. We shouldn't really have a module structure like this but for the moment we do.

0

Please sign in to leave a comment.