How can I configure a file watcher to work correctly with a Drupal 8 Bootstrap 3 sub theme?

I'm trying to configure a sass file watcher for my Drupal sub theme.

Judging from the default Sass file watcher variables, it expects a 1 to 1 relationship between the .scss file being edited and the .css file sass should output, correct?

The Drupal Bootstrap sub theme documentation says I should tell Sass to compile <subtheme root>/scss/_drupal-bootstrap.scss to <subtheme root>/css/style.css.

I've tried using absolute paths like this screenshot:

But when I edit and save /path/to/project/root/app_drupal/src/web/themes/custom/subtheme/scss/_drupal-bootstrap.scss nothing appears to happen.

If I run it from the command line, I get an error. So I'd expect PHPStorm to error as well.

[code]

$ sass _drupal-bootstrap.scss ../style.css
Error: Undefined variable.

10│ font-weight: $alert-link-font-weight;
│ ^^^^^^^^^^^^^^^^^^^^^^^

drupal-bootstrap/component/_alert.scss 10:16 @import
_drupal-bootstrap.scss 1:9 root stylesheet

[/code]

I don't believe it is anything to do with my set up of node/sass since I installed sass globally per https://www.jetbrains.com/help/phpstorm/transpiling-sass-less-and-scss-to-css.html#install_sass_scss

I'm running node 10.16.0 managed by nvm, I followed https://medium.com/@danielzen/using-nvm-with-webstorm-or-other-ide-d7d374a84eb1 to make sure PHPStorm uses the correct paths.

Am I just missing something? Any suggestions would be helpful.

In case it is useful:

Thanks in advance!

 

1 comment
Comment actions Permalink

Got past the compile error by manually compiling the correct file... style.scss, not _drupal-bootstrap.scss

```

sass scss/style.scss css/style.css

```

0

Please sign in to leave a comment.