How to configure webstorm to use scss import from another path in the project

Question

I want to redefine several bootstrap scss files. The paths in my project are like this

Source code of my scss:

/src/client/sass/style.scss

Download Source Package:

/bower_components/bootstrap-scss

Now, if I edit style.scss in Webstorm, it will not be able to find the import

@import "bootstrap"

I use gulp, so I created a gulp task that generates css from bootstrap and my add-ons, so I do not use a WebStorm clock.

How can I set up a project so that @import is properly bound to bower components? I am currently using a symlink, but this seems like a hack.

Answer 1

/bower_components/ Resource Root (Mark directory as/Resource root) - WebStorm