sass 安装

转自前端网 https://www.qdfuns.com/article/39653/4936f4556b9ef93ebd669b45f2a12ff7.html

#第一步:.##进入ruby官网进行下载ruby配置环境https://rubyinstaller.org/downloads/),根据你的电脑选择不同的下载版本[/color]

手把手教配置sass环境

第二步:.##进行ruby安装,默认,点击安装
##之后自动进入cmd,默认按下Enter键,自动安装,只需要等待数十分钟。

手把手教配置sass环境

第三步:打开cmd 输入 ruby -v 显示ruby版本 代表安装成功

手把手教配置sass环境

第四步:分别输入 gem install sass 和gem install compass进行下载

什么是compass 其实是就是jQuery对应javascript compass对应sass 一样 更好的去管理sass

手把手教配置sass环境

手把手教配置sass环境

下载完毕就可以使用sass 开不开心


第五步:怎么使用 (打开submile 如果想要有sass和scss高亮 自行下载submile插件)
打开cmd ,可以在建立的文件夹 点击shift和鼠标左键打开cmd 或者直接点击文件路径输入cmd##

手把手教配置sass环境

第六步:输入 compass create

手把手教配置sass环境

就自动创建了以下文件夹

手把手教配置sass环境

第七步:输入 commpass watch 这个是编辑 scss或者sass的时候自动更新css文件。

手把手教配置sass环境

第八步:我使用 scss格式进行编辑,因为它能写常规的css 更直观 所以需要把sass下的文件都删除

手把手教配置sass环境

然后在sass文件夹下建立scss文件 保存 然后就会在stylesheets文件夹下吗生成新css

手把手教配置sass环境

第九。在scss里面 有 // 和//二种注释
// 是在scss里面的注释 不会再css里面显示
而//会在css里面显示
如果要使用中文注释,可以去修改compas路径下的sass配置
也可以在scss开始加上 @charset "utf-8";

手把手教配置sass环境

手把手教配置sass环境

转载于:https://www.cnblogs.com/dr-zhou/p/8778685.html

### 不同操作系统上的 Sass 安装方法 #### Windows 上的 Sass 安装 对于Windows用户来说,推荐使用Dart Sass版本。由于此版本被编译成纯JavaScript语言,因此可以通过Node.js环境轻松运行。首先需要确保已经安装了Node.js和npm(Node Package Manager)[^3]。 接着打开命令提示符或PowerShell窗口并执行以下命令来全局安装`sass`包: ```bash npm install -g sass ``` 完成上述操作后便可以在任何地方调用`sass`命令来进行样式表预处理工作。 #### macOS 上的 Sass 安装 在MacOS环境下有两种主要方式可以安装Sass:通过Homebrew或者利用Ruby自带的Gem工具。 ##### 方法一:使用 Homebrew 安装 Dart Sass 如果偏好于采用Homebrew作为包管理器,则可以直接在其基础上添加Sass支持。具体做法是在终端里键入如下指令: ```bash brew install sass/sass/sass ``` 这将会自动下载并配置好所需的一切依赖项。 ##### 方法二:借助 RubyGems 安装经典版 Sass 另一种途径就是依靠Ruby内置的包管理系统——RubyGems。先确认已正确设置了Ruby开发环境;之后再依据个人情况决定是否附加管理员权限(`sudo`)以解决可能存在的访问控制问题。最终用于实际部署的一串语句应该是这样的形式呈现出来: ```bash gem install sass ``` 值得注意的是,在某些较新的macOS版本中,默认不再预先装载Ruby解释器及其关联组件。此时建议切换至其他更稳定的解决方案比如前面提到过的Homebrew方案或者是基于Node.js的实现路径[^4]。 #### Linux 发行版中的 Sass 部署 针对Linux类系统而言,同样存在多种可行的选择去获取最新的Sass发行本。一方面能够沿用前述提及到的方法三(即经由NPM渠道),另一方面也可以探索特定社区维护下的APT/YUM仓库资源寻求官方提供的deb/rpm格式安装包。当然这里还是优先考虑跨平台兼容性更好的Node.js路线为佳: ```bash npm install -g sass ``` 以上就是在各个主流平台上设置Sass开发环境的大致流程概述。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值