IntelliJ IDEA自动编译.scss为.css全流程

目录

1、IntelliJ IDEA中安装File Watchers

2、Ruby安装

        2.1 为啥要安装Ruby？

        2.2 安装流程

3、SASS安装

4、File Watchers配置

5、不需要File Watchers的自动转换

补充：官方文档.scss转.css流程。

https://www.jetbrains.com/help/idea/transpiling-sass-less-and-scss-to-css.html#sass_scss_less_before_you_start

---

        安装流程都是我个人的亲自实现的，找了比较多的方法，也参考了许多博客和官方文档。供大家参考学习。我的IDEA版本是2020.1 Ultimate Edition。

1、IntelliJ IDEA中安装File Watchers

        一般情况下，是在IDEA中的左上角，File --> settings --> plugins，或者直接按ctrl+shift+s，在插件中搜索File Watchers，直接安装即可。

---

        当然，有时候出于某些原因，plugins中加载不出来插件，这里给出另外一种方法下载File Watchers。

        首先就是IntelliJ IDEA的官方插件网站https://plugins.jetbrains.com/。在官方的网站中搜索File Watchers。

         我最开始是在version中查找适合自己IDEA版本的File Watchers。如果你下载的File Watchers.jar跟你的IDEA版本不合适，IDEA会报错。

        提示错误：Plugin 'File Watchers' is incompatible with this installation

---

        当然如果右侧有如图所示的蓝色部分Install to IntelliJ IDEA 2020.1，直接点击蓝色部分，官方网站会自动匹配适合你的IDEA的插件。要是没有官方匹配，就只能自己在Versions中找到适合自己IDEA版本的插件，下载.jar文件自行安装。

        如果是自己下载插件&#