css - 尝试编译 sass 时出现无效 css 错误

标签 css sass

我是 sass 新手,在下载了 bulma、安装了 gem 和 sass 后,我尝试使用 sass style.scss style.css 编译默认的 sass 文件,这是我的目录结构

enter image description here

但是我收到这样的错误:

/*
Error: Invalid CSS after "$pink": expected selector or at-rule, was ": #ffb3b3 "
        on line 2 of styles.scss

1: $blue: #72d0eb 
2: $pink: #ffb3b3 
3: $orange: #FFA500
4: $family-serif: "Georgia", serif
5: 
6: $danger: $orange
7: $family-primary: $family-serif 

Backtrace:
styles.scss:2
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/scss/parser.rb:1207:in `expected'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/scss/parser.rb:1137:in `expected'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/scss/parser.rb:42:in `parse'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/engine.rb:406:in `_to_tree'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/engine.rb:381:in `_render_with_sourcemap'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/engine.rb:298:in `render_with_sourcemap'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/exec/sass_scss.rb:391:in `run'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/exec/sass_scss.rb:63:in `process_result'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/exec/base.rb:52:in `parse'
/usr/local/share/gems/gems/sass-3.4.23/lib/sass/exec/base.rb:19:in `parse!'
/usr/local/share/gems/gems/sass-3.4.23/bin/sass:13:in `<top (required)>'
/usr/local/bin/sass:23:in `load'
/usr/local/bin/sass:23:in `<main>'
*/
body:before {
  white-space: pre;
  font-family: monospace;
  content: "Error: Invalid CSS after \"$pink\": expected selector or at-rule, was \": #ffb3b3 \"\A         on line 2 of styles.scss\A \A 1: $blue: #72d0eb \A 2: $pink: #ffb3b3 \A 3: $orange: #FFA500\A 4: $family-serif: \"Georgia\", serif\A 5: \A 6: $danger: $orange\A 7: $family-primary: $family-serif "; }

我似乎找不到解决此问题的方法

最佳答案

尝试用分号 (;) 结束该行

例如 -

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

关于css - 尝试编译 sass 时出现无效 css 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42417918/

相关文章:

javascript - 快速滚动以更改样式

javascript - 为什么 Firefox、Safari 和 Chrome 之间的滚动不一致?

css - 这是水平居中绝对定位元素的有效方法吗?

javascript - Navbar div onclick 函数不适用于内部元素

css - 什么是字体显示 CSS 功能?

css - 使用 SASS 和 :nth-child 设置 css 属性

javascript - 如何创建固定的js slider

html - 背景图像不工作的CSS

css - Sass Mixin Modulo 无法正常工作

ruby-on-rails - CSS 需要语法