CODEWITHSUNDEEP
csssass
Kurt Peek
Kurt Peek

Reputation: 57471

Sass CompileError when importing the Materialize source code: Sass map "isn't a valid CSS value"

I'm trying to write an SCSS file, dashboard.scss, which contains an import

@import "../../../lucy_web/static/stylesheets/mixins";

where _mixins.scss, in turn, contains an import of the source code of Materialize v1.0.0beta:

@import "vendor/materialize_v1";

However, when I add this import, I get a CompileError that the Sass map $base "isn't a valid CSS value":

CompileError at /dashboard/experts
Error: ("base": #009688, "lighten-5": #e0f2f1, "lighten-4": #b2dfdb, "lighten-3": #80cbc4, "lighten-2": #4db6ac, "lighten-1": #26a69a, "darken-1": #00897b, "darken-2": #00796b, "darken-3": #00695c, "darken-4": #004d40, "accent-1": #a7ffeb, "accent-2": #64ffda, "accent-3": #1de9b6, "accent-4": #00bfa5) isn't a valid CSS value.
        on line 152 of lucy_web/static/stylesheets/vendor/components/_color-variables.scss
>> $teal: (
   -------^

I'm using a 'Bleeding Edge' version of Sass, so I would expect this to work:

(venv) Kurts-MacBook-Pro-2:stylesheets kurtpeek$ sass --version
Sass 3.5.5 (Bleeding Edge

Any idea why the SCSS isn't compiling?

Upvotes: 1

Views: 861

Answers (1)

Kurt Peek
Kurt Peek

Reputation: 57471

I believe this was due to a 'name collision' as described in https://github.com/mkhairi/materialize-sass/issues/81. The SCSS actually also contains some 'legacy' code which imports individual components of an older version of Materialize:

@import "../../../lucy_web/static/stylesheets/partials/colors";
@import "../../../lucy_web/static/stylesheets/partials/mixins";
@import "../../../lucy_web/static/stylesheets/partials/variables";

The 'colors' SCSS file also defines $base, and apparently re-defining leads to a CompileError. I solved this problem by moving this particular mixin to a separate _mixins.scss in the current directory without importing the Materialize source code, and simpling importing like so:

@import "mixins";

Upvotes: 1

Related Questions