Let’s talk about webstorm sass compilation issues

This article is provided by the webstorm usage tutorial column to introduce you to the sass compilation issues under webstorm. It has certain reference value and I hope it can help everyone.

Sass compilation problem under webstorm

saas needs to run in ruby ​​environment, so ruby ​​32 / 64 needs to be installed

1. Install ruby

2. In the DOS command, test whether ruby ​​is installed: ruby ​​-v (Press enter, if the version number appears, ruby ​​is installed successfully)

3. Install sass command: gem install sass

4. Test whether sass is installed successfully: sass -v (Press Enter, if the version number appears, the sass installation is successful)

Method 1: DOS command sass conversion to ask css file monitoring

1. In the file directory, how to open the dos command line: shift right-click

2. Enter the sass command in the command line to compile the sass file into a css file

sass style.scss mystyle.css
sass style.scss ../css/mystyle.css

Monitoring and compilation: When sass is modified, the css file will be modified simultaneously

sass --watch style.scss:../css/mystyle.css

3. Exit monitoring ctrl c and select y

Method 2: webstorm comes with built-in monitoring

1. Once and for all: Configure IDE environment:

IDE configuration (location: setting --> Tools --> File watchers)

If sass and css are The two folders store scss and css respectively:

Arguments：--style expanded --no-cache --update $FileName$:../css/$FileNameWithoutExtension$.css

Chinese compilation error: [Cannot use any file names and remarks with Chinese characters] Find the file

1, lib\ruby\gems\2.3. Line 87 of 0\gems\sass-3.4.22\lib\sass\importers\filesystem.rb

if name.index(@root + "/") == 0 修改为 if name.encode("utf-8",'gbk').index(@root + "/") == 0

2. Add the following sentence @charset "UTF- 8"

The above is the detailed content of Let’s talk about webstorm sass compilation issues. For more information, please follow other related articles on the PHP Chinese website!