Search code examples
sassidephpstorm

PhpStorm and SCSS compile scss file into one css file

I'm taking my first steps in PhpStorm and SASS. I went to File > Settings > File Watcher and I added SCSS

This is my current configuration:

  • Program: C:\Ruby23\bin\scss.bat

  • Arguments: --no-cache --update $FileName$:$FileParentDir$\$FileNameWithoutExtension$.css

  • Working directory: $FileDir$

  • Output paths to refresh: $FileParentDir$\$FileNameWithoutExtension$.css

And it's working in the following way. Given the structure:

/mysite
    /sass
        1.scss
        2.scss
        3.scss

when I add a SCSS file to /sass it generates .css and .css.map files inside /mysite. However, I want to generate just one CSS file inside /mysite and avoid the map files. How can I do this?

Solution

    1. if you have a primary SCSS file that imports other files (partials, their names usually start with underscore), you just need to make sure that 'Track only root files' is enabled in File watcher settings to get the output merged into a single .css

    2. If you don't like .map files being created, pass --sourcemap=none to compiler