Use scss in idea, and compile and generate css files in real time
Recently, ideas are often used for writing projects. I rely heavily on scss when writing styles, and it is very painful to modify styles without it. It feels a bit cumbersome to switch between vscode and idea. So I chose to configure scss in idea.
First install ruby
My computer is 64-bit, and the following is installed
During the installation process, be sure to check this item, and others directly next.
After the installation is complete, enter on the command line
ruby -v
Check whether the installation is successful, if the version number appears, the installation is successful.
After ruby is successfully installed, install compass and enter the command line
gem install compass
(This installation is a bit slow, you need to wait a minute or two)
Then compass -v checks whether the installation is successful and the version information
Install normalize, command line input
gem install compass-normalize
Install sass, command line input
gem install sass
Then sass -v checks whether the installation is successful and the version information
Then install the plug-in File Watcher in the idea
and the next step is to set
in:
Program选择步骤3中Ruby路径中,bin目录下的scss.bat文件。
Argument部分选择: --no-cache --update --watch $FileDir$
Output paths to refresh选择: $FileDir$:$FileNameWithoutExtension$.css
这三个参数不是一定需要这么写,因为$ $之间带不同的参数表示不同的意思。如果啊,我是说如果,你真的不想去理解$里面不同参数代表的意思,你用绝对路径也是能办到的。。当然这种就只能用在你这一个project中了。
这个是官方的new watchers的文档,里面都有记录,有兴趣的了解了解
https://www.jetbrains.com/help/idea/2020.2/new-watcher-dialog.html。
Conclusion:
After using it for the past two days, I feel that using scss in idea is really not as good as using it in VScode. The experience is not as good as vscode. In addition, in idea, I have to submit the project and the css file compiled by scss. It is also in the subdirectory of scss (this should be able to be set). In short, I think I might as well use VScode. Another trial and error experience.