SASS / CSS使用指南针发布给Foundation 5 [英] Issue with SASS/CSS for Foundation 5 using Compass

问题描述

我遇到Foundation 5推荐的SASS安装问题。

http://foundation.zurb.com/docs/sass.html

我只遵循了一个星期的简短教程或以前，并没有问题。一切似乎运行良好，看起来不错。

在接下来的几天中，我正在修改我正在处理的项目，但只是将更改（CSS ）转换为 custom.css 文件。我希望确保我的客户对我的建议设计感到满意，然后才能进入SASS的内部。

今天晚上我来对SASS进行更改。我在执行任何更改之前运行了罗盘监视，并立即遇到了：

写样式表/ app.css

尽管我完全搞砸了我的 index.html 没有做任何改变。 app.css 文件只是原始大小的一小部分（大约750行与大约8,500行之间），因此该页面几乎以原始HTML加载，没有有用的CSS - 例如，在 body 上甚至没有任何样式的提示。

在决定重新安装从头开始，我仍然没有更好的表现，并且遇到了同样的问题。

根据Foundation：

< blockquote>

app.scss
您可以在此处确定项目中的样式。
默认情况下，所有Foundation都已导入，但您可以取消激活并
选择要导入的特定组件或在此添加自定义Sass
。

当我第一次安装Foundation时，它被导入为我的 index.html 。这是Zurb如何描述它的行为。现在它似乎只是抓住一些默认样式，但不是全部，我不能为了我的生活找出原因。

更新：

进一步更新： compass watch 仅编译两个基础文件， _icon-bar.scss 和 _visibility.scss 。它似乎在这些文件中完全拉动了任意行，所以它们中的某些内容也不对。它不会从其他地方拉东西。在下面的答案的评论中有几个pastebin链接。

我非常感谢任何帮助。

感谢您抽出宝贵时间阅读。

解决方案

我只是用Sass学习Foundation 5，但您的问题和CSS的输出结果正在看我的编译方式如何，有很多评论，没有CSS被拉入HTML中。

基础论坛上的这个帖子真的帮了我很大的忙。似乎最新的Sass和Compass工作不正常？不确定细节，但Szabesz提出的卸载最新的Sass和Compass并安装稍旧的Sass和Compass的建议工作：

 卸载： 
 sudo gem uninstall compass 1.0.0 
 sudo gem卸载sass 3.4.0 
 
重新安装旧版本：
 sudo gem install sass --version 3.2.9 
 sudo gem install compass --version 0.12.7 
  

I'm having a problem with Foundation 5's recommended SASS installation.

http://foundation.zurb.com/docs/sass.html

I followed the brief tutorial only a week or so ago and had no problems. Everything seemed to run OK and looked OK.

Over the course of the next few days I was making amendments to the project I am working on but only put the changes (CSS) into a custom.css file. I was wanting to ensure my client was happy with my proposed design before getting into the guts of SASS.

This evening I came to make the changes to SASS. I ran compass watch before I made any changes and I was immediately met with:

write stylesheets/app.css

This totally screwed up my index.html despite not having made any changes. The app.css file is only a fraction of the original size (~750 lines vs. ~8,500) and as a result the page is pretty much loading as raw HTML with no useful CSS - there's not even a hint of any styling on body for example.

After deciding to re-install from scratch I'm still no better off and running into very much the same issue.

According to Foundation:

app.scss Here you can determine what stylings will be in your project. By default all of Foundation is imported, but you can deactivate and select specific components you want to import or add your custom Sass here.

When I first installed Foundation, it was all imported as the default styles loaded for my index.html. It was acting how Zurb described it would. Now it only seems to grab some default styles but not the whole thing and I can't for the life of me figure out why.

Update: A friend cloned my repo and had no issues whatsoever. I've done the same and ran into the same issue again - must be something to do with my environment.

Further update: compass watch is only compiling two of the Foundation files, _icon-bar.scss and _visibility.scss. It seems to be pulling completely arbitrary lines even within those files, so something in them is not right either. It does not pull anything from anywhere else. There's a couple of pastebin links in the comments on the answer below.

I would greatly appreciate any assistance with this.

Thanks for taking the time to read.

解决方案

I'm just learning Foundation 5 with Sass but your issue and the CSS output is looking how mine was compiling out as well, with lot's of comments and no CSS being pulled into the HTML..

This thread on the Foundation Forums really helped me. Seems like the latest Sass and Compass wasn't working properly?? Not sure the details but the suggestion from Szabesz to uninstall the latest Sass and Compass and install slightly older ones worked:

to uninstall:
sudo gem uninstall compass 1.0.0
sudo gem uninstall sass 3.4.0

to reinstall old versions:
sudo gem install sass --version 3.2.9
sudo gem install compass --version 0.12.7

这篇关于SASS / CSS使用指南针发布给Foundation 5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！