webstorm如何配置sass ，scss，less等css预处理器！

ゞ浴缸里的玫瑰 2021-09-18 13:26 325阅读 0赞

参考文档：[https://www.cnblogs.com/congxueda/p/7086575.html][https_www.cnblogs.com_congxueda_p_7086575.html]

参考中文翻译文档：[https://www.sass.hk/install/][https_www.sass.hk_install]

第一步安装Ruby ：[http://rubyinstaller.org/downloads][http_rubyinstaller.org_downloads]

ruby -v
    gem -v

第二步安装sass：

gem install sass

第三步配置webstorm：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70 1][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70 2][]

[https_www.cnblogs.com_congxueda_p_7086575.html]: https://www.cnblogs.com/congxueda/p/7086575.html
[https_www.sass.hk_install]: https://www.sass.hk/install/
[http_rubyinstaller.org_downloads]: http://rubyinstaller.org/downloads
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70]: /images/20210812/e6466d8da85b46cf82cf3ee1a7456711.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70 1]: /images/20210812/a1564f320e9d482bb51730444b47c368.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzM0MzE0NA_size_16_color_FFFFFF_t_70 2]: /images/20210812/ceefa56730ac4ceabaeefed25bbbf5aa.png

发表评论取消回复

表情：

评论列表（有 0 条评论，325人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS预处理器之sass的用法

过css的肯定知道`层叠样式表 (Cascading Style Sheets，缩写为 CSS）`，是一种`样式表`语言，用来描述 HTML 或 XML（包括如 SVG、...

﹏ヽ暗。殇╰゛Y/ 2024年04月17日 14:57/ 0 赞/ 9 阅读

相关 CSS - 预处理器SCSS

目录 SCSS简介 SCSS 编译环境安装 Live Sass Compiler 编辑 npm包 sass SCSS语法概览嵌套语法选择器嵌套选择器嵌套

淡淡的烟草味﹌/ 2023年09月27日 08:48/ 0 赞/ 69 阅读

相关 CSS 即将支持嵌套，SASS/LESS 等预处理器已无用武之地？

最近，有一则非常振奋人心的消息，CSS 即将原生支持嵌套 -- Agenda+ to publish FPWD of Nesting\[1\]，表示 CSS 嵌套规范即将进入规

以你之姓@/ 2022年09月04日 12:49/ 0 赞/ 151 阅读

相关浅谈CSS预处理器SASS、LESS、Stylus

1、背景 CSS不是一种编程语言，可以用它开发网页样式，但是没法用它编程，它没有自己的变量、简单的逻辑程序、函数及其他编程语法，只是一行行单纯的属性描述，写起来相当费事，而且

ゞ浴缸里的玫瑰/ 2022年06月17日 21:59/ 0 赞/ 187 阅读

相关 windows下webstorm配置sass

1、安装Ruby环境网上百度如何安装 2、Ruby自带一个叫做RubyGems的系统，我们使用这个系统来安装Sass和Compass。命令如下：

桃扇骨/ 2022年05月21日 09:51/ 0 赞/ 172 阅读

相关 CSS预处理器 -- stylus 、sass、less

在写CSS的时候我们会发现，为了兼容浏览器等原因，我们往往需要写很多冗余的代码，CSS预处理器就是为了解决CSS的这些问题，简化CSS代码的编写。目前最主流的CSS预处理器

浅浅的花香味﹌/ 2022年05月19日 14:16/ 0 赞/ 253 阅读

相关 css预处理器less,sass,stylus

什么是 CSS 预处理？为什么要有 CSS 预处理？可以实现css变量和函数的功能，给我们带来动态语言所具有的优势。 less 1. less文件必须以.less

妖狐艹你老母/ 2021年11月23日 01:28/ 0 赞/ 299 阅读

相关 CSS预处理器

\\\less less是一种动态样式语言，属于css预处理器的范畴，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展 LE

迈不过友情╰/ 2021年10月24日 00:34/ 0 赞/ 308 阅读

相关 webstorm如何配置sass ，scss，less等css预处理器！

参考文档：[https://www.cnblogs.com/congxueda/p/7086575.html][https_www.cnblogs.com_congxueda_

ゞ浴缸里的玫瑰/ 2021年09月18日 13:26/ 0 赞/ 326 阅读

相关 CSS 预处理器

一.什么是css预处理器？ CSS 预处理器定义了一种新的语言，其基本思想是，用一种专门的编程语言，为 CSS 增加了一些编程的特性，将 CSS 作为目标生

浅浅的花香味﹌/ 2021年09月14日 04:02/ 0 赞/ 303 阅读