资讯专栏INFORMATION COLUMN

webstorm下的sass编译问题

darcrand / 599人阅读

摘要:需要运行在环境,所以需要安装安装命令中,测试是否安装回车,出现版本号则是安装成功安装命令测试是否安装成功回车,出现版本号则是安装成功方法一命令转化问文件监听在文件目录中,打开命令行的方法右击在命令行中输入命令,可以把文件编译为文件监听编

saas 需要运行在 ruby 环境,所以需要安装 ruby 32 / 64

1、安装 ruby    
2、DOS命令中,测试ruby是否安装:ruby -v (回车,出现版本号则是ruby安装成功)
3、安装sass命令: gem install sass
4、测试sass是否安装成功:sass -v(回车,出现版本号则是sass安装成功)

方法一:DOS命令sass转化问css文件监听

  1、在 文件目录中 ,打开 dos命令行的方法  :shift + 右击
  2、在命令行中输入 sass命令,可以把sass文件 编译为css文件
     sass style.scss mystyle.css
     sass style.scss ../css/mystyle.css
     监听编译:在sass 修改时,会同步修改css文件
     sass --watch style.scss:../css/mystyle.css
  3、退出监听  ctrl + c ,选择 y

方法二:webstorm自带监听

1、一劳永逸:配置IDE  环境:    
IDE 配置 (位置:setting --> Tools --> File watchers)
如果sass和css是两个文件夹分别存放scss和css:
Arguments:--style expanded --no-cache --update $FileName$:../css/$FileNameWithoutExtension$.css

中文编译报错:【不能使用任何带中文的文件名和备注】 找到文件

1、 lib
ubygems2.3.0gemssass-3.4.22libsassimportersfilesystem.rb的87行
if name.index(@root + "/") == 0 修改为 if name.encode("utf-8","gbk").index(@root + "/") == 0
2、在.scss文件中的头部加上下面这句话 @charset “UTF-8”

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/58160.html

相关文章

  • webstorm 设置 sass自动编译问题

    摘要:语法使用它带来的好处,就不再这里做介绍了,主要看怎么在里配置自动编译。因为国内网络的问题导致源间歇性中断因此我们需要更换源。也就是说,任何标准的样式表都是具有相同语义的有效的文件。参考文档官网设置自动编译及参数配置  sass语法、使用它带来的好处,就不再这里做介绍了,主要看怎么在webstorm里配置自动编译。   sass编译是需要Ruby环境的,可以到这里去下载  :  https:/...

    APICloud 评论0 收藏0
  • webstorm和intellij idea下如何自动编译sass和scss文件

    摘要:现如今预处理有恨多种,在这里我们主要介绍。好在和有自动编译和功能,极大便捷我们的开发,下面我们就说一下如何去配置。和下自动编译和文件配置第一步检查是否安装了利用这条命令查看是否安装了,出现版本号即为安装成功。如果需要自动也是一样。 前言 学过css的人都知道,css他不是一个编程语言。虽然你可以用css去写网页样式,但是你却没法使用它进行编程。所以有一句话来描述css我个人觉得再合适不...

    archieyang 评论0 收藏0
  • sass的基本使用

    摘要:本文所有的例子都是在中编译,而可以自行编译,具体可以查看该链接配置的概念定义是的一种预处理器,文件后缀名为,可以用中的来转成样式。 最近在项目中利用到了css预处理器(sass),而之前没接触过的本博主出于好奇心,就在业余的时间里搜了一些资料来看看,看完后觉得sass挺不错,就想简单的介绍一下sass的基本使用方法(ps:本文只介绍sass的一些基本使用,而这些内容都是本博主觉得比较有...

    alighters 评论0 收藏0
  • 指尖前端重构(React)技术调研分析

    摘要:一为什么选择是当前前端应用最广泛的框架。目前来看的生态系统要比大的多,在等最大的技术社区搜索两者,的搜索结果是的十倍左右,另外据近期统计使用的站点是的几百倍以上。其中是基于技术,依然是浏览器应用。 一、为什么选择React React是当前前端应用最广泛的框架。三大SPA框架 Angular、React、Vue比较。 Angular出现最早,但其在原理上并没有React创新的性能优化...

    AlphaWallet 评论0 收藏0
  • 前端构建工具grunt学习笔记

    使用grunt实时编译less文件 下图是项目的文件组织 showImg(https://segmentfault.com/img/bVqbtg); 生成package.json文件,通过npm init命令。 安装你需要的Devdependencies/denpendencies。 npm install grunt --save-dev npm install load-grunt-ta...

    zone 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<