sass安装以及安装后谷歌调试编译的解决方案

「 不学自知，不问自晓，古今行事，未之有也 」

sass昨天刚上手，一开始，很简单，so easy,语法也很容易理解，和css结构差不多，安装很简单，按着http://www.w3cplus.com/sassguide/install.html安装就行，有个地方可以注意下，不知道是我网络的原因还是什么问题，从官网下载ruby超级慢，完了我从别的小网站下载的，可能不是最新的，你后期可以自己更新，完了安装好后看下版本对不对什么的，别忘了compass安装；

这里开发工具我也说一下，我试了微软的vscode和webstorm，hbuilder不推荐，简单的说就是不能终端操作，还有个个人原因，不能全屏，宝宝看到不能全屏的开发软件很难过，我觉得只有界面干净整洁而且可以全屏才能配得上我帅帅的颜值，我不多说，前端我最帅，没有之一！

下面是开发代码要注意的地方，

1.HTML引入的是css文件；

2.虽然是sass，但是文件名是scss，就是带大括号的，不带大括号的是sass,我就踩了这个坑,小伙伴们留个心，

到了编译工具了，我们修改完scss后需要编译成css，这里面推荐一款编译软件koala，简单实用，

到了最终到的环节了，也是我爬坑时间最长的，浏览器，火狐浏览器可以直接用好像，我喜欢用谷歌，不要问我为什么，谷歌调试前先做这几件事

1.找到你的谷歌插件，chrome://flags/，这个英文的，中文名是开发者实验，搜索就可以了，然后开启，必不可少；

2.打开debug模式，也就是F12

这几部都按部就班的做好，

下一步就是打开koala，

这一步做完后，我们开始在终端上输入de css/         回车sass --watch new.scss:new.css(注意这里面是new.scss 不是sass,是个坑），完了以后是这样的

接着我们网页打开，F12，这里要特别特别注意，我们先

没错，先add 到workspace，到你自己的项目css文件夹就行，

这个时候浏览器上方有个弹框，选择允许，然后界面是这个样

再然后我们先打开source找到你要修改文件 ，点击->Map to network resource,chrom就会自动连接了，右键，是映射到网络资源的意思，完了你就可以直接更改scss做调试了，实时的改变，很方便，十一放假了，我得收拾回家了