javascript - SASS throws an error Undefined Mixins: Module build failed (from .node_modulessass-loaderdistcjs.js): SassError: Un

admin管理员组

文章数量:1391955

I am working a react project and when I tried to use a mixin like @include it gave a piling error:

  ╷
7 │ ┌   @include mobile {
8 │ │     flex-direction: column;
9 │ └   }

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.

I have installed the packages and checked to see if it wasnt installed properly I still get this error what can I do?

code:

@import "../../global.scss";

.contact {
  background-color: white;
  display: flex;

  @include mobile {
    flex-direction: column;
  }

  .left {
    flex: 1;
    overflow: hidden;

    img {
      height: 100%;
    }
  }

I am working a react project and when I tried to use a mixin like @include it gave a piling error:

  ╷
7 │ ┌   @include mobile {
8 │ │     flex-direction: column;
9 │ └   }

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.

I have installed the packages and checked to see if it wasnt installed properly I still get this error what can I do?

code:

@import "../../global.scss";

.contact {
  background-color: white;
  display: flex;

  @include mobile {
    flex-direction: column;
  }

  .left {
    flex: 1;
    overflow: hidden;

    img {
      height: 100%;
    }
  }

• javascript
• css
• reactjs
• sass

Share Improve this question Follow asked Jul 20, 2022 at 10:35 davedave 21022 silver badges1616 bronze badges 1

• What does your file structure look like? – Arkellys Commented Jul 21, 2022 at 5:01

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

The mixin mobile is resolved only by name without the use of explicit imports. When using sass variable, mixin, or function declared in another file It is remended to explicitly import them to the current file like:

@use "../../global.scss" as s;

.contact{ 
 @include s.mobile {
   flex-direction: column;
 }
}

And also the Sass team discourages the use of the @import rule, Prefer the bination of @use and @forward rules instead. read the doc for more.

本文标签：