Sass环境安装的一波三折

本文详细记录了在本地计算机上安装Sass环境的过程,包括下载并配置Ruby环境、解决安装过程中遇到的源地址变更问题及SSL连接错误等,最终成功完成Sass的安装。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天看大地老师的教学视频,需要安装sass环境,那就跟着教程来呗,啊,于是,一波bug来袭,费了老大劲,终于是搞定了。

首先:

我们找到sass中文网https://www.sass.hk/install/,按照教程来,下载了ruby安装包,https://rubyinstaller.org/downloads/下载合适自己系统版本的安装包,此处要注意:勾选Add Ruby executables to your PATH添加到系统环境变量。

好了,接下来,安装好之后,我们在开始菜单,打开ruby,未避免不必要的麻烦,我们以管理员身份打开

下一步,根据sass中文网的步骤,删除源,替换源,安装,what,居然又遇见坑。

借助百度,才知道,失败定向淘宝源,那我打开网址看看https://ruby.taobao.org/  公告显示,淘宝不干了,转手镜像源了,那按照提示再进行吧。

$ gem sources --add https://gems.ruby-china.org/ --remove https://rubygems.org/
$ gem sources -l

跟着输入命令了。发现又杯具了。

发现又是定向问题,打开https://gems.ruby-china.org/,发现又发公告了。

问题明白了,那改命令吧,org域名不能用了,改com了。这事情搞得。

gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/

gem sources -l

终于好了。

之后,gem install sass

 

终于安装好了。

中间,可能会有ssl安全链接的提示,

ruby SSL_connect returned=1 errno=0 state=SSLv3 read server certificate B:

我百度之后,也找到解决方案,首先在这里下载证书(http://curl.haxx.se/ca/cacert.pem), 然后再环境变量里设置SSL_CERT_FILE这个环境变量,并把value指向这个文件。

 

Sass是一种CSS预处理器语言,它允许你在编写CSS样式时使用更多的变量、嵌套规则和函数,使得代码更易于管理和维护。以下是Sass的基本安装环境配置步骤: 1. **安装Node.js**:首先确保你已经安装了Node.js,因为Sass通常通过npm(Node包管理器)进行安装。 2. **全局安装Sass CLI**:打开终端或命令提示符,运行以下命令来全局安装Sass的命令行工具(CLI): ``` npm install -g node-sass ``` 如果你想使用Ruby Sass版本,替换`node-sass`为`ruby-sass`,然后运行`gem install sass`。 3. **验证安装**:安装完成后,你可以运行`sass --version`来检查Sass是否已成功安装,并查看其版本信息。 4. **创建项目和设置**:对于新项目,可以初始化一个新的目录并进入其中: ``` mkdir my_sass_project cd my_sass_project npm init -y 或 yarn init -y ``` 5. **安装本地依赖**:在项目根目录下安装Sass-loader和相关库,例如如果你用的是webpack,可以在`package.json`中添加: ```json { "dependencies": { "sass": "^4.14.2", "sass-loader": "^8.0.2" } } ``` 然后运行 `npm install` 或 `yarn install`。 6. **配置构建工具**:将Sass Loader添加到你的构建工具(如Webpack、Gulp或Grunt)配置文件中。例如,对于Webpack,你需要在`.webpackrc.js`或`webpack.config.js`中添加Sass的相关规则。 7. **编写Sass文件**:在项目中创建`.scss`或`.sass`文件开始编写Sass代码。它们会被转换为标准的CSS文件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

瑞朋哥

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值