使用:
susy(2.0.0.alpha.6)
sass(3.3.0.rc.2)
指南针(1.0.0.alpha.17)
使用以下SCSS:
$susy: ( columns: 12, column-width: 5em, gutter-width: 1em, gutter-position: after, grid-padding: gutter-width, ); $small: 36em; $medium: 50em; $large: 65em; .hlt-container{ @include at-breakpoint($small) { @include span(6); @include nth-omega(2n); margin-bottom: gutter(12); } @include at-breakpoint($small $large) { &:last-child:nth-child(odd){ float: none; clear: both; margin-right: auto; margin-left: auto; } } @include at-breakpoint($large) { @include span(4); @include remove-nth-omega(2n,12); @include nth-omega(3n); margin-bottom: 0; } }
我首先得到错误:
error source/scss/style.scss (Line 10 of source/scss/01-molecules/02-blocks/_00-highlight-block.scss: Undefined mixin 'at-breakpoint'.)
如果我删除了at-breakpoint
样式,它会继续运行并再次阻塞remove-nth-omega
:
error source/scss/style.scss (Line 26 of source/scss/01-molecules/02-blocks/_00-highlight-block.scss: Undefined mixin 'remove-nth-omega'.)
我已经通过文档搜索和Google搜索一切我能想到的,但似乎无法找到问题,如可能at-breakpoint
和remove-nth-omega
与与Susy下被弃用.
编辑:
如果我改回来
指南针(0.12.2)
sass(3.2.12)
苏西(1.0.9)
(谢天谢地,RVM和gemsets)
并恢复.scss以反映较旧的Susy语法:
$columns: 12; $column-width: 5em; $gutter-width: 1em; $gutter-position: after; $grid-padding: $gutter-width; $small: 36em; $medium: 50em; $large: 65em; .hlt-container{ @include at-breakpoint($small) { @include span-columns(6,12); @include nth-omega(2n); margin-bottom: gutter(12); } @include at-breakpoint($small $large) { &:last-child:nth-child(odd){ float: none; clear: both; margin-right: auto; margin-left: auto; } } @include at-breakpoint($large) { @include span-columns(4,12); @include remove-nth-omega(2n); @include nth-omega(3n); margin-bottom: 0; } }
一切正常.
如果你想使用旧的susy语法,那么写:
// With Susy 2 installed... @import "susyone";
代替
// With Susy 2 installed... @import "susy";
我在断点处遇到了同样的问题,一旦我切换它就没事了.> susy文档