css - sass:构建 html5up.net 模板失败

标签 css html sass

这可能是一个菜鸟问题,希望可以轻松回答。在 html5up.net您可以下载包含未处理的 sass 源文件的 css 模板。我正在尝试构建 Twenty模板使用

sass sass/main.scss

我得到了错误

Syntax error: Invalid CSS after "     wide": expected ")", 
  was ": '(max-width: ..." on line 16 of sass/main.scss

我在 Ubuntu 14.04 上使用 Sass 3.2.12 (Media Mark)。不幸的是,在 html5up 页面上没有构建说明,我想对于其他人来说如何预处理 *.scss 文件是显而易见的。

谁能告诉我我做错了什么以及如何从 scss 文件创建 css 输出?

编辑

这是 main.scss 直到第 22 行:

@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@import url("font-awesome.min.css");
@import url("http://fonts.googleapis.com/css?family=Lato:300,400,900");
/*
    Twenty by HTML5 UP
    html5up.net | @ajlkn
    Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

@import "libs/skel";

@include skel-breakpoints((
    wide: '(max-width: 1680px)',
    normal: '(max-width: 1280px)',
    narrow: '(max-width: 980px)',
    narrower: '(max-width: 840px)',
    mobile: '(max-width: 736px)'
));

最佳答案

按照@ceejayoz 的建议,升级到更新的 sass 似乎确实有帮助。因此,在 Ubuntu 14.04 上,如果安装了 ruby-sass 包,只需删除它

sudo apt-get remove ruby-sass

然后使用 gem 安装它,如 official sass-lang page 中所述

sudo su -c "gem install sass"

在那之后,sass的版本应该是 > 3.2

user@machine$ sass --version
Sass 3.4.22 (Selective Steve)

关于css - sass:构建 html5up.net 模板失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38287874/

相关文章:

html - 如何将文本放在 div 旁边?

html - 将绝对文本对齐到父 div 的右下角

javascript - css3 或 Javascript 中的页面过渡幻灯片

javascript - 导航栏标题中的 Bootstrap 汉堡包图标动画

javascript - 是否可以使用 JavaScript 更改元素的值

html - 如何仅使用 CSS 在单独的 div 中切换背景图像

css - 我可以跨 SCSS 文件使用变量吗?

html - DIV 在水平滚动的 DIV 中不垂直对齐

javascript - scss rgba 并从 css 变量加载;

css - 网页包和 SCSS : how to work with image paths?