1)安装ruby

2)安装sass

3)配置webstorm

打开webstrom ->file->setting->Tools->file watcher

添加scss 

program:C:\Ruby22-x64\bin\scss.bat

arguments:默认的是在scss目录中生成css,如果要改变路径就需要进行配置(这里配置的是父级目录的skin/view/css)

--no-cache--update $fileName$:$FileParentDir$\skin\view\css\$FileNameWithoutExtension$.css

output paths to refresh :配置你的css目录（最终只有一个css）

可能会出现的异常：

1）安装sass失败

进入https://rubygems.org/gems/sass 下载sass,至本地

gem install 拖入你下载的sass

再一次进行配置

webstorm配置scss的小结的更多相关文章

  1. ruby安装及webStorm配置SCSS

    sass安装: 步骤:(window系统) 1.下载RubyInstaller(v2.4.3),运行安装,基本直接next安装,不过有个add to PATH的选项一定要勾选,这样就不用配置环境变量. ...

  2. webstorm 配置scss的问题

    第一种方法(ruby方法) 先安装ruby,在windows/system32目录下 1.先查询源是什么 gem sources 2.移除原有的源头 gem sources -r http://xxx ...

  3. webstorm配置scss自动编译路径

    webstorm支持sass的同步编译,也就是即写即编译,并且可以指定编译后的css的目录. 本文使用的webstorm为8.0版本 scss安装:http://www.w3cplus.com/sas ...

  4. webstorm配置scss环境

    1.下载 Ruby  (安装过程中记得勾选添加到环境变量,安装结束最后可能会弹出一个cmd弹框,可以忽略) 2. cmd安装sass gem install sass 3. cmd检查是否安装 sas ...

  5. Webstorm配置CSS/SCSS自动补全兼容前缀autoprefixer插件

    关于Autoprefixer Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器.它适用于普通的CSS,可以实现css3代码自动补全.也可以轻松跟Sass,LESS及 ...

  6. webstorm配置编译sass的输出目录

    关于这个的问题,虽说不是很难,但还是踩了点小坑,下面就来介绍下如何使用webstorm配置编译sass的输出目录. 1.下载Ruby 2.使用Ruby安装sass 3.检测是否安装成功. 前面的几步很 ...

  7. WebStorm配置

    一.主题配色 主题设置方法:File -> Settings -> Appearance & Behavior -> Appearance ->Theme. webst ...

  8. mac下webstorm添加scss watcher

    一.前提条件: 1.安装ruby,如果我没记错的话,mac自带ruby,终端输入 ruby -v ,回车,如果显示ruby的版本号,则说明ruby环境已经安装好了.如果没有,自行安装ruby.例如我的 ...

  9. webstorm配置eslint【标记错误，修复错误】

    项目中经常用到eslint语法,结合个人经验,用webstorm配置eslint "文件"->"默认设置"->"语言&框架&quo ...

随机推荐

  1. Quartz 框架 教程（中文版）2.2.x

    Quartz 框架 教程(中文版)2.2.x 之第一课 开始使用Quartz框架 Quartz 框架 教程(中文版)2.2.x 之第二课 Quartz API,Jobs和Triggers简介 Quar ...

  2. MYSQL-实现ORACLE 和SQLserver数据中- row_number() over(partition by ) 分组排序功能

    网上看见了好多例子都基本上是一样的,没有过多的解释,对于一个初学MySQL来说有点难,我把部分转摘过来如下 原文:http://www.cnblogs.com/buro79xxd/archive/20 ...

  3. Ansible 1.9.0发布 来一起看看这个配置管理新贵

    Ansible 1.9.0(版本代号是Dancing In the Street,Ansible每个主要版本代号都是VanHallen乐队的一首曲子)的主要变化是: Added kerberos su ...

  4. Python中的数据结构 --- 元组（tuple)、字典（tuple)

       元组(tuple)本身是不可变数据类型,没有增删改查:元组内可以存储任意数据类型一.元组的创建 例:t = (1,2.3,'star',[1,2,3])      ## 元组里面包含可变类型,故 ...

  5. react 问题

    安装依赖报错问题                                           可能需要按顺序安装,  不能cnpm npm 混合安装, 参考react项目入门 react an ...

  6. C++实现线程同步的几种方式

    线程同步是指同一进程中的多个线程互相协调工作从而达到一致性.之所以需要线程同步,是因为多个线程同时对一个数据对象进行修改操作时,可能会对数据造成破坏,下面是多个线程同时修改同一数据造成破坏的例子: # ...

  7. No module named 'cv2'出错

    当在python 3.6里运行课程里的强化学习程序时,出现如下出错,怎么办呢? >>> = RESTART: D:\work\csdn\tensorflow\DeepLearning ...

  8. pip安装tensorflow出错怎么办

    随着人工智能的开发越来越多人参与,现在下载tensorflow 1.2版本也经常出错了,如下: 这时怎么办呢? 其实比较简单,可以通过pypi的网站来下载: https://pypi.python.o ...

  9. vuex（二）getters

    getters: 有时候,我们需要对state的数据进行筛选,过滤.这些操作都是在组件的计算属性进行的.如果多个组件需要用到筛选后的数据,那我们就必须到处重复写该计算属性函数:或者将其提取到一个公共的 ...

  10. 程序设计入门-C语言基础知识-翁恺-第六周：数组-详细笔记（六）

    目录 第六章:数组 6-1 数组 6-2 数组计算 6.3 课后习题 第六章:数组 6-1 数组 题目:让用户输入一组整数以-1结束输入,算出这组数的平均值,并且输出大于平均值的数. 我们需要记录用户 ...