Autoprefixer with file watcher

Avatar
Ares Catalin
Created

Hello!

As already many times mentioned and discussed, I need a solution for a prefixer. I am using SCSS, compiling it using a watcher. I have then installed globally (project limitations, I can not add it locally) postcss-cli and autoprefixer.

I have tried this proposed workaround but without any luck:
https://intellij-support.jetbrains.com/hc/en-us/community/posts/4413840713106-Valid-option-for-scss-autoprefixer-at-the-moment

What I have tested using the CLI and works as intended, is to create a postcss.config.js whith this command
postcss assets/styling.css -o assets/styling-with-prefixes.css --config postcss.config.js

I want to achieve something similar by using a second watcher after SCSS compilation. This is what I have so far:

And this is the error that I am getting:


I really banged my head with this and I refuse to use another editor just for this :) Elena Pogorelova 

Thanks

Votes

0

Share

6 comments
Avatar
Elena Pogorelova
Created

What is a result of running /home/catalin/.nvm/versions/node/v.18.17.1/bin/postcss styling.css -o assets/styling-with-prefixes.css --config postcss.config.js in terminal in the folder where the styling.css file is located? 

0
Avatar
Ares Catalin
Created

Elena Pogorelova I see a typo in path you have provided around the node version, instead of v.18.17.1 it's  v18.17.1. 
Using the correct version, generates the vendor prefixes as it should. 
/home/catalin/.nvm/versions/node/v18.17.1/bin/postcss styling.css -o assets/styling-with-prefixes.css --config postcss.config.js

0
Avatar
Elena Pogorelova
Created

Weird. All the file watcher does is running exactly the same command in the same directory. Can't imagine why the module is found when running in terminal but fails when using a file watcher.

Does the issue persist if you start the IDE from the same terminal instance?

0
Avatar
Ares Catalin
Created

Elena Pogorelova One thing I forgot to mention. Initially I had the same error when running this command from the IDE's terminal just like the one from the watcher. In order to fix the issue, I had to export this variable in the .zshrc config export NODE_PATH=$NODE_PATH:`npm root -g`. I am assuming the wather has maybe the same issue where it doesn't find the global install

0
Avatar
Elena Pogorelova
Created

Yes, it must be the issue.

Try starting PhpStorm from terminal using bin/phpstorm.sh - does the issue persist?

When being launched from desktop/System menu/Toolbox, WebStorm only sees environment variables configured in login shell, but not in interactive shell configuration files (like .bashrc or .zshrc). Possible solutions:

  • Workaround 1: make required variables available in a login shell by moving them to the corresponding shell profile config
  • Workaround 2: run IDE from a terminal to make it inherit terminal environment

see also https://youtrack.jetbrains.com/issue/IDEABKL-7589

0
Avatar
Ares Catalin
Created

Elena Pogorelova I have tried 2nd method and it works well indeed. Thank you so much. 
The 1st method doesn't seem to work for me or maybe I haven't done it properly. What I have done:
- created a .zprofile file inside the home directory
- added this line . ~/.profile and saved the file
- logged out
 

0

Please sign in to leave a comment.