Sass环境安装-Sass sublime 编辑器插件编译方法

首先官网(http://www.ruby-lang.org/en/downloads/)下载 ruby

(1)打开链接进入到下载页面,点击如下位置进行下载

(2)下载页面

(3)进入到各个版本的列表页

安装 sass
(1)在开始菜单输入“start”会出现“Start Command Prompt with Ruby”,鼠标点击 “Start Command Prompt with Ruby” 运行

在这个命令行窗口中,输入“ruby -v”,会出现 ruby 的版本号,则证明 ruby安装成功

紧接着输入“gem -v”会出现 gem 的版本号,则证明 gem 安装成功

在上述窗口中继续输入“gem install sass”

在上述窗口中输入“sass -v”检测 sass 是否安装成功,出现 sass 版本号,则表示 sass安装成功

到此,sass 的环境安装完成,sass 安装完成
下面开始安装 sublime 插件

(1)打开 sublime 编辑器,查看是否有“package control”

(2)如果没有,则需要先安装“package control”,“package control”安装步骤如下:
①首先,在浏览器的地址栏输入 https://packagecontrol.io/installation

②打开 sublime 编辑器,按下快捷键 ctrl 和~

在弹出的输入框中,输入下面这段代码等待安装完成

③安装完成后,在 sublime 编辑器中,按下快捷键 ctrl 和 shift 和 p(备注:编辑器左下角会显示是否安装完)

如果 Package control 安装不了插件

1、如图,找到如下图的文件,打开

2、输入红框中的配置信息

"channels":
[
"http://cst.stu.126.net/u/json/cms/channel_v3.json"
],

3、配置完毕,重新启动 sublime 编辑器,即可正常安装 sublime 插件

接下来快捷键ctrl+shift+p 输入inp

然后,在弹出的输入框中,输入 sass,选中 Sass 回车,进行安装

安装完成后,重新按下快捷键 ctrl 和 shift 和 p,调出 package control

安装完成后,在弹出的输入框中,输入 sass,选中 SASS Build 回车,等待安装完成

安装完成后,在 sublime 编辑器上可以看到如下的菜单,如图进行选择

3、编译 sass
(1)新建一个以英文命名的文件夹(中文的编译的时候容易报错),格式如下:

(2)在 sass 文件夹新建一个 sass 文件,文件以 .scss 为后缀,即:

(3)在 sass 文件中书写代码,然后进行如图操作

自动保存,使用ctrl+s保存scss文件时,自动生成css文件

输入inp

选择SublimeOnSaveBuild插件安装

原文地址:https://www.cnblogs.com/chenyingying0/p/12241401.html

时间: 2024-11-06 14:24:50

Sass环境安装-Sass sublime 编辑器插件编译方法的相关文章

学习Sass之安装Sass(一)

为什么使用Sass 作为前端(html.javascript.css)的三大马车之一的css,一直以静态语言存在,HTML5火遍大江南北了.javascript由于NODE.JS而成为目前前后端统一开发语言的不二之选.只有css似乎成为前端开发的被忽视的角色了. Sass让css有了动态语言的特点,在初次学习css时,有时候同样的样式在不同的#或.中一次又一次重复的编码,有了Sass,在css语法的基础上不仅可以写变量.函数,而且可以百分百的转换为标准的css.再次把Don't Repeat Y

MyEclipse 10 中安装Android ADT 22插件的方法

MyEclipse 10 中安装Android ADT 22插件的方法 下载ADT包:http://dl.google.com/android/ADT-22.0.0.zip 将ADT-22.0.0.zip文件放在指定的目录下,例如D:\Programs\Android,不解压. 打开MyEclipse,点击菜单Help >MyEclipse Configuration Center,如下图 在MyEclipse Configuration Center中,点击Software标签,再点击add

如何使用sass(环境安装)

Sass是基于ruby环境开发的语言工具,所以使用sass需要ruby环境. 1.       下载ruby https://rubyinstaller.org/downloads/ 下载完后双击,next即可 2.        查看ruby是否安装好,找到Start Command Prompt with Ruby 这个工具 3.        输入命令 gem install sass (安装sass 命令) gem updatesass  (升级sass 命令) sass -v (查看s

Sass学习之路(2)——Sass环境安装(windows版)

因为本喵目前用的是window10的本子,所以这里就发windows版本的安装流程啦.(希望有朋友可以赞助我一个mac(┳_┳)): 第一步:安装ruby 因为Sass是基于ruby编写的,所以先去官网下载ruby(百度一下,你就知道). 当然了,国外的网站,动不动上不去,或者下载不了都有可能,所以百度软件中心这个也是可以的,亲测可用 点开以后选择普通下载,防止捆绑,从我做起. 下载完以后几乎是傻瓜式安装,使用默认路径就可以, 注意这里要勾上第二项,不然可能会出现找不到Ruby环境的情况.(就像

苹果CMS安装时缺少fileinfo插件解决方法

原文摘自:https://www.mytheme.cn/article/118.html 1.在安装苹果cms系统建站时由于所使用的php版本过低会导致出现缺少fileinfo插件(如下图) 2. 解决方法其实很简单,我们以宝塔面板为例.(如下图)打开宝塔面板找到软件管理. 3.选择你环境安装的PHP版本,点击设置按钮.(如下图) 4,选择安装扩展,将缺少的fileinfo插件手动安装一下就可以了,安装后重启php让其生效. 5,也可以直接切换下php版本7.0及以上来解决此问题. 原文地址:h

lnmp环境安装(3)-php源码编译安装

本人安装的lnmp环境的相关文件,可以在本人提供的百度云盘资源进行下载 链接: http://pan.baidu.com/s/1dD6QZ1B 密码: zcs8 一.概述  php全称PHP:Hypertext Preprocessor超文本处理器,开源脚本语言! 其与web server的接口支持三种形式,分别为cgi, module方式, fastcgi方式.而对于nginx而言,只支持cgi和fastcgi两种接口方式与php进行连接! 本节将以源码安装php,启动php-fpm服务(fa

lnmp环境安装(3)-mysql源码编译安装

一.概述 MySQL是一个跨平台的开源关系型数据库管理系统,目前隶属于Oracle公司.MySQL被广泛地应用在Internet上的中小型网站中.由于其体积小.速度快.总体拥有成本低,尤其是开放源码这一特点,许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库. 本节采用mysql-5.6.16的源码进行mysql的安装. mysql的源码级别的安装要基于一个工具cmake来进行安装.CMake是一个跨平台的安装(编译)工具,可以用简单的语句来描述所有平台的安装(编译过程) 以

WDCP面板Web环境安装redis与phpredis扩展应用方法

根据网友的要求需要在WDCP面板环境中安装人人商城程序,但是这个程序需要支持redis与phpredis扩展.根据老蒋认知,WDCP默认搭建普通网站肯定是没有问题的,但具体是不是支持redis与phpredis扩展还不清楚,于是通过查阅官方文档,还不错默认新版本V3.2是支持redis,已经默认安装.但是没有安装phpredis扩展,所以只要将phpredis安装就可以. 在这篇文章中,老蒋将在WDCP V3.2版本中安装phpredis扩展支持,当然需要把这个过程记录下来,以后如果有网友看到或

LNMP一键环境安装多PHP版本共存的方法

多PHP版本只支持LNMP模式,LNMPA.LAMP模式下不支持!要使用多PHP先安装多PHP版本,在lnmp1.4源码(lnmp1.3的不行哦)目录下运行:./install.sh mphp 按提示选择要另外安装的PHP版本,不能多选,只能选一个,要安装多个需要安装完成后再运行前面的安装命令.已经升级完LNMP管理脚本且已安装好多PHP版本的话,lnmp vhost add 时会在设置完日志名称后提示当前已经存在的PHP版本,按提示的数字选择就可以. 如果已经存在的虚拟主机要更改PHP为指定版