Sass is used and configured in the Webstorm

My environment: Win7-64bit WEBSTORM9

Webstorm Installing the Sass Plugin

To have Webstorm automatically compile the sass file:

Open the Settings window->file watchers-> to the right of the green plus->scss

Click OK to finish compiling the Scss file.

Further configuration 1:

Always generate CSS and Css.map files

In ' Arguments ':--no-cache--update $FileName $: Add--sourcemap--watch $FileNameWithoutExtension $.css

i.e.:--no-cache--update--sourcemap--watch $FileName $: $FileNameWithoutExtension $.css

Added after ' Output paths to refresh ': $FileNameWithoutExtension $.css: $FileNameWithoutExtension $.css.map

namely: $FileNameWithoutExtension $.css: $FileNameWithoutExtension $.css.map

Click OK, at which time the. css file and. Css.map two files are generated, and the default is to generate a. css file.

Further configuration 2:

Modify the Build file location

Add a configuration path in ' Arguments ' $FileName $: back and before $filenamewithoutextension$.css

Example--no-cache--update--sourcemap--watch $FileName $: $FileParentDir $\css\ $FileNameWithoutExtension $.css/* This is the CSS folder in the parent directory of the directory where the Scss file is located, where the $fileparentdir$ represents the parent folder of the current folder */

If it does not, it must be where there is no right to write, carefully check under, note do not forget to plug in the middle of the colon.

In the Webstorm scss is still very useful, eliminating the need to manually compile the trouble.

If the use is not webstorm in here to recommend a software koala, this software can always compile koala, but this software can only compile files, cannot modify view files.

If you use sublime and other editors can consider the koala.

Sass is used and configured in the Webstorm