如何编写 sass 代码？答案

【问题标题】：How do I write a sass code?如何编写 sass 代码？
【发布时间】：2013-09-28 04:16:55
【问题描述】：

我安装了 Ruby 并输入“gem install sass”并在 ++notepad 上创建了一个 style.scss 文件并输入“sass --watch style.scss:style.css” 我得到了什么：Sass 正在观察变化。按 ctrl-c 停止。错误没有这样的文件或目录style.scss

style.scss 保存在我的桌面上。

我必须把它放在特定的目录中吗..？

我只是想尝尝 sass，然后继续使用 codepen，只是一个简单的代码

 <div class="box"> </box>

sass

$blue: #3bbfce;
.box{background:$blue;}

这就是我得到的：“#3bbfce”之后的无效 CSS：预期的表达式（例如 1px，粗体），是“;”

我对 sass 做错了什么？

【问题讨论】：

当你输入 : sass --watch style.scss:style.css，注意你的 style.scss 是否在你的当前目录中
抱歉，那么我的当前目录在哪里？我的桌面上有一个 style.scss 和一个 style.css，我给 sass --watch style.scss:style.css ... 还是一样
我只看到编辑器支持.. 并且 ++notepad 不在列表中。会是这个原因吗？

标签： sass

【解决方案1】：

这不是 SASS。

SASS 不使用分号或大括号，它会告诉你很多。在#3bbfce 之后，您有一个无效语法的分号。

这是等效的语法正确的 SASS：

$blue: #3bbfce

.box
  background: $blue

如果您想使用确实使用分号和大括号的 SCSS 变体，则需要在命令行中添加 --scss：

$ sass --scss --watch style.scss:style.css

【讨论】：

我刚刚在这里看到了分号和大括号。但事实上，当我像你写的那样在 codepen 上进行更改时，它就可以工作了！谢谢！但我仍然卡在我的服务器上..

【解决方案2】：

您需要从 .sass 和 .css 文件所在的目录执行终端命令。因此，在您的命令提示符下，执行cd c:\Users\username\Desktop 或cd ~\Desktop 之类的操作 - 以适合您的操作系统为准。

另请注意，Sass 有两种不同的语法 - .sass 和 .scss。 .scss 语法使用括号和嵌套，但 .sass 语法使用 whitspace 进行嵌套。看起来您正在编写 .scss 但您已将语法设置为 .sass；因此，要么更改语法，要么在代码中使用空格。

【讨论】：

我明白了！如果还可以，再问一个问题。我输入了命令行并“覆盖了 normal.css”，所以我猜它正在工作！我有一个 index.html 文件对！我在我的 html 或 style.scss 中调用 normalcss.css 文件吗？ - 并对 style.scss 文件进行更改并覆盖 normalcss.css 并期望它更改 html 页面上的样式？还是我完全在错误的页面上？
您应该从您的 .html 文件中引用您的 .css 文件。 Sass 将根据 .sass 或 .scss 文件为您导出 .css。这就是为什么您仍然会像往常一样包含来自 .html 的 .css 文件。