`

Sass 安装 及其常见错误的解决办法

 
阅读更多

Sass是一种css的开发工具,它的安装依赖Ruby,没有安装Ruby的请先安装Ruby。

假定你已经安装了Ruby,则可以直接执行如下语句进行安装。

 

gem install sass

 常见错误提示:

 

1、ERROR:  While executing gem ... (OpenSSL::SSL::SSLError)

 

    hostname "gems.ruby-china.org" does not match the server certificate

解决办法:

执行命令,查看数据源

 

gem source -l

 结果

 

 

*** CURRENT SOURCES ***

https://ruby.taobao.org/
https://gems.ruby-china.org

 

 

则可以删除多余的

 

gem sources --remove https://ruby.taobao.org/
sudo gem update --system

 然后重新安装。

 

2、ERROR:  SSL verification error at depth 1: unable to get local issuer certificate (20)

ERROR:  You must add /O=Digital Signature Trust Co./CN=DST Root CA X3 to your local trusted store

Fetching: ffi-1.9.18.gem ( 32%)ERROR:  SSL verification error at depth 2: self signed certificate in certificate chain (19)

ERROR:  Root certificate is not trusted (/C=US/O=GeoTrust Inc./CN=GeoTrust Global CA)

ERROR:  While executing gem ... (OpenSSL::SSL::SSLError)

    hostname "gems.ruby-china.org" does not match the server certificate

 

3、ERROR:  SSL verification error at depth 1: unable to get local issuer certificate (20)

ERROR:  You must add /O=Digital Signature Trust Co./CN=DST Root CA X3 to your local trusted store

Fetching: ffi-1.9.18.gem (100%)

Building native extensions.  This could take a while...

Successfully installed ffi-1.9.18

ERROR:  SSL verification error at depth 2: self signed certificate in certificate chain (19)

ERROR:  Root certificate is not trusted (/C=US/O=GeoTrust Inc./CN=GeoTrust Global CA)

Fetching: rb-inotify-0.9.10.gem (100%)

Successfully installed rb-inotify-0.9.10

Fetching: sass-listen-4.0.0.gem (100%)

Successfully installed sass-listen-4.0.0

Fetching: sass-3.5.1.gem (100%)

ERROR:  While executing gem ... (Errno::EPERM)

    Operation not permitted - /usr/bin/sass

 

遇到以上错误 2和3的解决办法

 

sudo gem install -n /usr/local/bin sass

 查看 

sass -v

 则会正确显示Sass版本号。

 

 

2017年12月28日更新:

Mac更新系统后,Ruby由2.0升级到2.3,再次使用Sass时候,发现报错。

于是决定升级SaaS,重新安装时遇到错误。最后找到解决方案:

先安装libgmp-dev,再重新安装即可。

brew install libgmp-dev
sudo gem install -n /usr/local/bin sass

 

 

分享到:
评论
1 楼 快快乐乐的北斗 2017-12-28  
yuicompressor scss/base.css -o css/base.css

相关推荐

    Vue3.0 + Vite + Typescript + Sass + ElementUI plus , 后台系统 .zip

    通过封装表格表单等use通用方法,可以抽象出常见的业务逻辑,减少重复代码,提高开发效率。这样的后台系统不仅易于维护,也能够适应不断变化的业务需求。在实际开发中,可以结合Vuex进行状态管理,使用Vue Router...

    xhtml+css网页制作中常见问题解决方法

    解决办法是尽量使用跨浏览器的CSS代码,避免使用专为特定浏览器编写的hack,或者利用条件注释和特性检测来针对不同浏览器提供兼容性的样式。 2. **声明问题**:确保你的页面具有正确的DOCTYPE声明,这将影响浏览器...

    bug集合1

    下面将针对标题和描述中提到的一些常见bug及其解决方案进行详细的解释。 首先,关于`npm install`时遇到的问题,其中一个是`Bower : ENOGIT git is not installed or not in the PATH`错误。这个错误是因为系统找不...

    通常CSS错误及解决办法技巧

    以下是一些常见的CSS错误及其解决办法,特别关注IE6、Firefox和其他浏览器之间的区别: 1. **背景颜色的区别**: - IE6与Firefox的背景颜色可以通过添加特定的前缀来区分,例如`background:orange;*background:...

    Laravel 5 学习笔记

    - **Call to undefined method getCachedCompilePath()**:这是一种常见的错误,通常是由于类或方法不存在引起的。解决方法可能是确保依赖包版本正确,或者更新 Laravel 版本。 以上内容涵盖了 Laravel 5 的各个...

    前端常见问题整理.压缩包

    掌握盒模型、定位(static, relative, absolute, fixed)、Flexbox和Grid布局、媒体查询(Media Queries)进行响应式设计,以及CSS预处理器(Sass, Less)的使用,可以帮助创建美观且适应不同设备的网页。...

    BootStrap视频教程

    - **常见错误提示**:列举一些开发过程中可能出现的问题(如样式冲突、布局错乱等),并给出相应的解决方法。 - **性能优化技巧**:分享提升网站性能的小贴士,例如压缩资源文件、减少HTTP请求次数等。 - **社区资源...

    前端js和css的压缩合并之grunt

    安装方法可参考相关教程。 - 安装Grunt CLI(命令行界面),以便在任何目录下都能运行Grunt命令。这一步可以通过运行命令`npm install -g grunt-cli`完成。需要注意的是,由于使用了`-g`标志,安装过程可能需要管理...

    CSS_HELP_3.0.rar_Help!_在css中help

    在css中help”,我们可以推测用户可能正在寻找关于如何在CSS中解决问题或寻求帮助的具体方法。这可能涉及到错误调试、CSS规则解析、浏览器兼容性问题、布局难题等常见挑战。 压缩包子文件“CSS中文完全参考手册....

    rails项目必备组件

    以下将详细介绍这些关键组件及其作用。 1. **Rails框架核心组件**: - **ActionPack**:包含ActionController和ActionView,分别处理HTTP请求和响应,以及生成视图内容。 - **ActiveRecord**:ORM(对象关系映射...

    10个你未必知道的CSS技巧

    6. **CSS盒模型调整**:IE6及其更早版本的浏览器存在盒模型计算错误,导致元素宽度不正确。解决这个问题的一种方法是使用负的`text-indent`和背景图像,但这可能导致无图模式下的内容丢失。另一种常见解决方案是使用...

    2021年最新前端面试题.rar

    4. **前端框架**:React、Vue.js和Angular是最常见的三大框架,面试时会询问其核心概念、组件化开发、状态管理(如Redux或Vuex)以及生命周期方法。 5. **JavaScript库**:jQuery的使用、Ajax请求的处理以及Ajax库...

    前端面试,独有前端面试题详解,前端面试刷题必备

    理解DOM(Document Object Model)的概念及其操作方法,如元素选择、属性修改、事件处理等,也是面试中的常见问题。 2. **CSS**:CSS(Cascading Style Sheets)用于美化网页。重点要掌握盒模型、布局方式(如...

    web前端面试题(全)

    以下是对这些领域的常见面试题及其相关知识点的详细阐述。 首先,JavaScript作为客户端编程语言,是前端开发的核心。在“700道JavaScript习题及面试题(含答案).pdf”中,可能会涵盖以下几个关键知识点: 1. **...

    VBLabDocs:VBLab文档页面

    6. **常见问题解答(FAQ)**:列出用户可能遇到的问题及其解决方案,有助于快速解决使用中的困扰。 7. **社区与支持**:提供用户论坛、邮件列表、在线聊天等社区资源链接,以便用户交流经验,寻求帮助。 8. **版本...

    前端面试题汇总

    - **解决方法**:使用前缀、条件注释或 Hack 技术。 **46. display的值及position的值** - **display** 的值包括 `block`、`inline`、`flex` 等。 - **position** 的值包括 `static`、`relative`、`absolute`、`...

    javascript面试题

    此 bug 在 IE6 中较为常见,解决方法是在元素上添加 `_display: inline` 或使用其他 CSS Hack。 **41、HTML 与 XHTML —— 二者有什么区别?** - **HTML**:更加宽松的语法。 - **XHTML**:严格遵循 XML 规则,...

    前端面试题

    有什么解决办法?** - 这通常是由于默认的`list-style`或`margin`/`padding`造成的。解决方法是重置样式或将`li`设置为`display: inline-block`。 **14、经常遇到的浏览器的兼容性有哪些?原因,解决方法是什么,...

    web前端面试宝典

    - **解决方法**: - 使用`clear`属性。 - 添加负margin。 - 使用BFC。 **预防措施**:合理布局,避免不必要的重叠。 ##### 24. rgba()与opacity - **rgba()**:允许设置透明度,不改变背景的透明度。 - **...

    example-project-react:仅用于研究

    这个项目很可能是为了演示React的基本用法、最佳实践以及一些常见的应用场景。 1. **React基础知识**:React的核心理念是组件化,它允许开发者将UI分解为独立、可复用的组件。在`example-project-react-master`中,...

Global site tag (gtag.js) - Google Analytics