sass的css中文注释乱码编译后在css里显示乱码

来源：蜘蛛抓取(WebSpider) 时间：2016-05-12 04:58 标签： sass编译css
为什么我的sass 不会自动编译成css呢??
我吧sass文件改了 相应的css还是没有变化
要怎么绑定吗
只用watch可以吗
写下你的评论...
写下你的评论...
Copyright (C)
All Rights Reserved | 京ICP备 号-2今天看啥 热点：
ruby环境sass编译中文出现Syntax error: Invalid GBK character错误解决方法，sass文件编译时候使用ruby环境，无论是界面化的koala工具还是命令行模式的都无法通过，真是令人烦恼。
容易出现中文注释时候无法编译通过，或者出现乱码，找了几天的解决方法终于解决了。
这个问题的奇葩之处在于在xp环境中没有任何问题，只是在windows7环境中才出现的这个。
sass编译时候出现如下错误的解决方法：
Syntax error: Invalid GBK character "\xE5"
on line 8 of E:\work\sass\sass\_big_box.scss
from line 16 of E:\work\sass\sass\main.scss
Use --trace for backtrace.
Syntax error: Invalid GBK character "\xE5"
on line 2 of E:\work\sass\sass\main.scss
Use --trace for backtrace.
解决办法：
1.koala可视化编译工具，
找到安装目录里面sass-3.3.7模块下面的engine.rb文件，例如下面路径：
C:\Program Files (x86)\Koala\rubygems\gems\sass-3.3.7\lib\sass
在这个文件里面engine.rb，添加一行代码
Encoding.default_external = Encoding.find('utf-8')
放在所有的require XXXX 之后即可。
2.命令行工具同理
找到ruby的安装目录，里面也有sass模块，如这个路径：
C:\Ruby\lib\ruby\gems\1.9.1\gems\sass-3.3.14\lib\sass
在这个文件里面engine.rb，添加一行代码（同方法1）
Encoding.default_external = Encoding.find('utf-8')
放在所有的require XXXX 之后即可。
感谢：/imathis/octopress/issues/232&&&mattn&提供了一种解决方法，用到这里极为合适。
暂无相关文章
相关搜索：
相关阅读：
相关频道：
&&&&&&&&&&&&&&&&&&
HTML/CSS最近更新sass中出现的中文问题
时间： 14:04:58
&&&& 阅读：803
&&&& 评论：
&&&& 收藏：0
标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&& & 在这园子里看到了很多优秀的资源，自己也想写写东西，就突然想到了以前遇到写sass的时候出现中文乱码的解决方案。所有就自己又总结了一下。(以下测试步骤都是自己完成的！没有任何转载，如有错误，希望大家指正)
简单说明下：sass来编写css样式方便了很多，让我们本来没有逻辑处理能力的css语法，在sass中编写具有了简单的逻辑处理能力.
这里sass的安装就不仔细介绍了。过程大致是这样 &安装ruby &--- & 安装sass &-- &webstrom中配置sass
& 一：通过往sass的配置文件中修改
& 首先sass的这个配置文件 一般都存在ruby安装的目录下。
这是我的ruby 安装目录 & 找到之后呢 就在这个文件夹中寻找我们所需要配置的文件：
如果说你们安装的版本和我相同 &那就大致是以下路径，
Ruby23-x64\lib\ruby\gems\2.3.0\gems\sass-3.4.22\lib\sass
在sass下有一个配置文件：
engine.rb文件；
打开------
在这个地方添加 如下代码 &： &Encoding.default_external = Encoding.find(‘utf-8‘);
----save &大功告成 & & & 去试试吧！
ok &完美！;
二:通过添加 & &&@charset "UTF-8";
& &这个方法的话需要你用到中文的时候才添加 &，第一种方法就是sass自动帮你添加。原理还是一致；
& & 添加的地方就是你的sass文件中 &
& （不要忘sass生成的css中添加，因为每次添加都会无效，因为编译生成的css的内容只会随着相应的sass文件内容的变化而变化）
这种方法得到的结果还是一致的。
& 关于中文路径的问题：
最后关于中文路径的问题:这个问题我也尝试过，但是最后还是会出现一些小问题，所有说大家不要使用中文路径。
& 最后说明下：此内容自己总结而来，写的很简单 ， 如果有不足或者错误的地方 希望大家指正！
&标签：&&&&&&&&&&&&&&&&&&&&&&&&&&&
&&国之画&&&& &&&&chrome插件
版权所有 京ICP备号-2
迷上了代码！SASS是一种CSS预处理语言，没有装环境的话是不能被解析的。但是有了koala编译工具之后，解析SASS不需要环境也毫无压力了。SASS的输出格式有四种：嵌套、扩大、紧凑和压缩。下面结合小例子为大家一一介绍。
嵌套(:nested)
嵌套的风格是默认SASS风格，因为它反映的CSS样式和HTML文档的结构很相似。每个属性都有其自己的嵌套。嵌套式大型CSS文件时，看着是非常有用的，它可以让你轻松掌握文件的结构没有什么实际阅读。反而包含的选择器多了，看起来很是费劲。小例子如下
& font-size: 14
& font-family: "Arial"; }
&&& color: }
&&& div a:hover {
&&&&& text-decoration: }
编译后的CSS代码
font-size: 14
font-family: "Arial";
div a:hover {
text-decoration:
展开(:expanded)
展开是一个比较典型的人类制造的CSS样式，每个属性和属性值占一行。小例子如下
family:"Arial";
decoration:
编译后的CSS代码
font-size: 14
font-family: "Arial";
div a:hover {
text-decoration:
紧凑(:compact)
紧凑的风格比嵌套或展开占用的空间较少。每个CSS规则只占用一行，在该行定义每个属性。嵌套规则放置在属性旁边没有换行。小例子如下
family:"Arial";
decoration:
编译后的CSS代码
div { font-size: 14 font-family: "Arial"; }
div a { color: }
div a:hover { text-decoration: }
压缩(:compressed)
压缩式占用空间的可能的最小量的，把不必要的空格都删除掉，然后每个属性，每个属性值，每个选择器仅仅挨在一起。小例子如下
family:"Arial";
decoration:
编译后的CSS代码
div{font-size:14font-family:"Arial"}div a{color:red}div a:hover{text-decoration:underline}
SASS详解之编译输出的样式就为大家介绍到这里了，我们可以通过不同的输出样式来适用于不同地方，更加方便了大家的编辑需要。
阅读(...) 评论()

我要回帖

更多关于 sass编译css 的文章

 

随机推荐