Extjs 4中使用compass编译Sass(.scss文件)为CSS文件各种报错的最终解决

ruby必须安装具有开发包devkit的对应系统位数的installer安装包,否则后面安装一些工具可能出问题(比如Sass和Compass不能正常安装);ruby的使用(为了使用Compass和sass),Ruby控制台中使用路径时不能为中文,否则会报错路径有ANSI字符;compass用于编译.scss文件(sass文件)为.css文件。

我在Extjs 4中使用compass编译sass文件时遇到了一系列错误:
首先,使用Compass编译sass文件为CSS文件时,报错:
error resources/my_sass/ext-all-red.scss (Line 2 of resources/themes/stylesheets/ext4/default/_all.scss: File to import not found or unreadable: blueprint/typography.

开始以为是SDK或者.SCSS文件的@import的问题,重新下载同版本SDK,改变.SCSS文件内的@import路径,改了以后编译命令把.scsx编译成.css文件了,但依然是个空文件。说明编译不对。
报错的怀疑和解决方向可能不对了。可能.SCSS文件内的内容和.rb文件的配置是对的,可能是compass或者是Sass的问题.再次查报错,终于通过谷歌找到了一条内容验证我的想法。:
google了一下,说是新版compass已经不包含compass-bluprint了,上面说即使重装compass-blueprint也依然编译不通过,推荐装上书上版本的Sass和compass.但又报错:
NoMethodError - undefined method `empty?’ for nil:NilClass (error point to select helper)(386书本给出的版本这个问题)

产生此报错时书上装的版本的也不行(本上版本的为sass-3.1.1和compass-0.11.1),装网上版本的(https://blog.51cto.com/u_15069489/4664549),编译报错:报错:
error resources/my_sass/ext-all-red.scss (Line 115 of resources/themes/stylesheets/ext4/default/mixins/_frame.scss: Functions may not be defined within cont
rol directives or other mixins.)
overwrite resources/my_sass/…/my_css/ext-all-red.css
说明:此时使用网上的是sass-3.2.12, compass-compass 0.12.2版本,依然报此错.有google找到了一篇文章,说是sass版本过高的问题。但是在前面使用了低版本3.1.1编译报错:
undefined method `empty?’,后面测试了更低的版本3.1.0依然保持错误<3.1.0已经是Sass的最低版本了>。高低版本都报错,但测试又发现sass版本版本不变,改变Compass版本
报错一样,这又说明报错与Compass版本无关。

到这感觉很无解了!
再次思考,ruby是compass工具的容器,且compass -v有输出结果,这些错误至少与ruby无关。除了本书源码内的SDK,我还下载了版本一模一样的SDK进行了测试,所有的
报错内容和上面的一致,排除SDK被修改过导致SDK某些方面功能不正常的原因。再次觉得还应该是sass版本的问题<sass的版本语法可能存在升级>.后来想到一个事,书是第二版的,、
可能代码进行了升级,但是书中还是印刷了第一版使用的版本的compass和Sass.把Compass和Sass版本往后微调一点看看会是什么结果<主版本号不变,副版本号往后加一点>,为了
进行对比,先保持compass的版本号不变,Sass版本从3.1.1变为3.1.21,这时报的是前面没有遇到过的错误:

error resources/my_sass/ext-all-red.scss (Line 40: Invalid GBK character "\x
到这里我终于完全可以肯定以前的报错Sass版本的问题了(没有像上面一样报错是SDK内自带文件的错误),并且我此时已经确定了我找到的sass 3.1.21版本是正确的,用这个版本
一定能编译出结果(这里说是我的Sass文件内有错误,但实际上我的SASS文件内代码并没有40行,代码也并没错误,应该是compass的错误<前面高版本的compass会报错,这里的compass
很可能也和Sass面临一样版本微调的问题>),然后将compass版本调整为0.12.2,ruby内使用 compass compile resources/my_sass编译resources/my_sass目录内的Sass文件,这次
终于成功的使用compass将Sass文件编译成CSS文件了。
此时ruby内安装的Sass版本为3.1.21,Compass版本为0.12.2,还有一点需要说明的是Sass文件内如果注释是中文的Sass要求中文注释也必须要指定为utf-8,否则编译报错,
必须在.scss开头使用:@charset “utf-8”;

*****************附加:本次调试Extjs4中Sass文件编译问题用到的一些ruby命令
系统决定Compass和Sass的版本的安装方式
gem install compass
自己决定Compass和Sass的安装版本的方式
gem uninstall compass-blueprint
gem uninstall sass
gem uninstall compass
gem install sass -v 3.2.12
gem install compass --version 0.12.2
查看安装的compass和Sass的版本:
compass -v
sass -v

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值