Question

我正在使用Sass指令/变量来定义媒体查询的屏幕大小。但是，我的应用程序在推送到Heroku时无法编译。

Heroku构建日志出错。

耙子流产了！ Sass :: SyntaxError：＆＃34; ...之后的无效CSS（最大宽度：＆＃34;：预期表达式（例如1px，粗体），是＆＃34; @ screen-xs-max）{＆＃ 34; /tmp/build_79af979930797464252714c06ee51080/bizdesc-com-bizdesc-276487d/app/assets/stylesheets/page.scss:2 /tmp/build_79af979930797464252714c06ee51080/bizdesc-com-bizdesc-276487d/app/assets/stylesheets/application.scss:5

第五行是我的SCSS文件中的这一行：@media（max-width：@ screen-xs-max）{...}

我的page.scss文件

/* Extra small devices (phones, less than 768px) */   
@media (max-width: @screen-xs-max) { ... }

/* Small devices (tablets, 768px and upto desktops, 992px) */   
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... }

/* Medium devices (desktops, 992px and upto large desktops, 1200px) */   
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... }

/* Large devices (large desktops, 1200px and up) */   
@media (min-width: @screen-lg-min) { ... }

Answer 1

使用$而非@

引用您的变量

@media (max-width: $screen-xs-max)

http://sass-lang.com/guide#topic-2

Rails Sass媒体查询变量导致Heroku推送失败

1 个答案: