首页 > Web开发 > 详细

webstorm自动编译scss

时间:2020-10-30 10:17:38      阅读:51      评论:0      收藏:0      [点我收藏+]

资源来源:https://blog.csdn.net/wytbr666/article/details/77477182

官网安装Ruby很慢: https://rubyinstaller.org/downloads/

我已在官方下载:http://zhizous.gitee.io/file/app/rubyinstaller-2.7.2-1-x64.exe

  • 安装成功后,用命令进行检查,成功会显示版本信息

    ruby -v
    gem -v
技术分享图片
修改rubygems的source源

$ gem source -r http://rubygems.org/
$ gem source -r http://production.s3.rubygems.org/
增加新source源
$ gem source -a http://production.s3.ru

如果使用Bundler

修改你的 Gemfile 将 http://rubygems.org 改为 http://ruby.taobao.org/

来源:
http://blog.banban.me/blog/2012/03/26/she-zhi-gemyuan-%2Cjie-jue-xia-zai-man-de-wen-ti/
  • 1
  • 2
  • 安装sass

在命令行输入:

gem install sass
  • 1
  • 安装成功后,在D:\Ruby23-x64\bin里面会有scss.bat的文件

  • 在webstorm中添加Watcher

  • File -> Settings -> Tools -> File Watchers -> + -> SCSS

1、Arguments:配置编译后的文件的输出路径:

--no-cache --update --sourcemap watch $FileName$:$FileParentDir$\css\$FileNameWithoutExtension$.css
  • 1

2、Output paths to refresh:

$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map

webstorm自动编译scss

原文:https://www.cnblogs.com/zhizou/p/13900050.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!