Susy syntax error: Undefined mixing 'span-colu

2019-09-08 04:51发布

问题:

I am new to Susy and I am trying to utilize span-columns mixin however I am getting the following error:

Syntax error: Undefined mixin 'span-columns'

I have installed compass-susy-plugin (0.9) and I do not have the Susy gem installed.

SCSS Files include screen.scss and _base.scss

screen.scss

// Imports -------------------------------------------------------------------

@import "base";
@import "typography";

/* Layout ------------------------------------------------------------------*/

.container {
  @include container;
  @include susy-grid-background;
}

.main {
    @include span-columns(8,12);
}

.left-sidebar {  
  @include columns(2);  
  @include alpha;
  background-color: red;  
}

.right-sidebar {  
  @include columns(2);  
  @include omega;  
  background-color: red;
}

_base.scss

// Imports -------------------------------------------------------------------

@import "susy";

// Grid ----------------------------------------------------------------------

$total-cols             : 12;
$col-width              : 4em;
$gutter-width           : 1em;
$side-gutter-width      : $gutter-width;

$show-grid-backgrounds  : true;

回答1:

According to the changelog that I have, the columns mixin in version 0.9 was renamed to span-columns in version 1.0 so I would say that the span-columns mixin did not exist back in the 0.9 branch of Susy.

Current version is 1.0.5 and this is what I am using without issues (so far).



回答2:

Here is another answer from the docs:

Susy 2.x supports two syntax options, side by side. If you want to use the latest release but keep the old syntax, change your import from susy to susyone.

// With Susy 2.x installed... @import "susyone";