Error Using PHPstorm's SASS File Watcher

Error using PHPStorm's SASS File Watcher

You have different PATH environment in Terminal and in PhpStorm, it's Mac OS specific.

Workarounds:

  • Run the IDE from Terminal: open -a /Applications/PhpStorm.app/
  • Edit Environment Variables directly in the File Watcher configuration.

PhpStorm File Watcher for SCSS stopped working

This issue has been resolved.

I just installed the latest version of Phpstorm (2016.2) with all new settings and config. The Sass File Watcher are now working perfectly.

PhpStorm seems to not allow scss file watching

Please disable Use "safe write" option at Settings/Preferences | Appearance & Behavior | System Settings.

  • With this option enabled, IDE writes into temp file first, then deletes original file and only then renames temp into original name. Your npm run watch does not see this as file modification: it must see it differently.

  • When disabled IDE writes new file content directly into the file (like Notepad does) hence proper "file modified" signals getting received by your watcher.

Sample Image

phpstorm - scss file watcher issue

A picture is worth a thousand words. Here is how you should set it.

Sample Image

PhpStorm: SCSS File Watcher Settings

The problem is that IDE is not able to find ruby in the PATH. Note that it may be different in terminal and in applications that you start from Ubuntu launchpad.

Use the Environment variables option in the file watcher configuration to specify custom PATH value with a directory containing the required executables.

PhpStorm SCSS file watcher: sass not found

OK, i figured it out.

I had to set this environment variable:

GEM_PATH : /Users/peter_goebel/.rvm/gems/ruby-1.9.3-p194

Phpstorm scss file watcher issue

As suggested in my comment: alter your path in "Output paths to refresh" to point to the actual output file (as in "Arguments" field) and not just folder: i.e. add /$FileNameWithoutExtension$.css at the end.



Related Topics



Leave a reply



Submit