SassError Undefined mixin

sage
, ,
1

I removed Tailwind to replace it with Bootstrap. I followed the documentation to remove Tailwind and using Bootstrap. Everything went normally.
but when i run yarn build it shows me the following errors.
ERROR ./resources/styles/app.scss

SassError: Undefined mixin.
╷
15 │ @include background($gray-whiter,linear-gradient(to bottom,$white-generic,#e6e6e6),repeat-x);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
resources/styles/components/_buttons.scss 15:2 @import
resources/styles/app.scss 14:9 root stylesheet

ERROR ./resources/styles/app.scss

SassError: Undefined mixin.
╷
15 │ @include background($gray-whiter,linear-gradient(to bottom,$white-generic,#e6e6e6),repeat-x);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
resources/styles/components/_buttons.scss 15:2 @import
resources/styles/app.scss 14:9 root stylesheet

2

Make sure your mixin’s are imported before wherever they are being used. In _buttons.scss in this case.

1 Like
3

I wonder if this could also be a @use vs @import issue. The scope of them is different and can cause issues with variables, maybe it can cause issues with mixins as well. Bootstrap still uses @import even because of this even though current SASS recomendations are to use @use

Or what I glean from reading the documentation it would namespace the mixin

1 Like