node.jswebpacksusysusy-sasssass-loader

Susy grid with webpack and sass-loader

I'm pretty new to Node and i'm trying to use Susy grid but get this error

ERROR in ./node_modules/css-loader!./node_modules/sass-loader/lib/loader.js!./scss/waterbottle.scss
Module build failed: 
    @include gallery(1 of 2);
            ^
      No mixin named gallery

I installed Susy and sass-loader with this command

npm install sass-loader --save-dev

and imported Susy in my .scss file like this

@import "~susy/sass/susy";

I've tried changing this path with no luck. I shouldn't have to do that according to their website.

My project file structure

My project file structure

It seems Webpack is locating the Susy file correctly, but somehow won't recognize it's mixins.

Solution

  • You likely installed Susy3 without reading the changelog. Susy3 no longer has a gallery mixin. Check the susy3 intro and documentation for more details. Susy2 will be maintained for the foreseeable future, if you want to stay with that.