CODEWITHSUNDEEP
cssangularsass
Abhishek Sharma
Abhishek Sharma

Reputation: 193

@include gives Transform Failed Error in Scss

@import "../../../styles/media-queries";

@mixin mobile-width {
  @include mobile {
    width: 100%;
  }
}

@mixin desktop-width {
  @include desktop {
    width: 464px;
  }
  @include tablet {
    width: 464px;
  }
}

@mixin desktop-tablet-properties {
  @include desktop {
    @content;
  }
  @include tablet {
    @content;
  }
}

@mixin mobile-properties {
  @include mobile {
    @content;
  }
}

.main-container {
  position: absolute;
  box-sizing: border-box;
  width: 100vw !important;

  //   @include desktop-tablet-properties {
  //     top: 165px;
  //   }

  @include desktop-tablet-properties {
  }
}

Hello Everyone, I am getting weird "Error: Transform failed with 1 error: ERROR: Unterminated string token" while trying to use mixin with @include in my Scss. When I comment <@include> mixin statement the app Builds perfectly.

I tried this with fresh angular non-production environment It works. Also, I tried with adding stylePreprocessorOptions in my server Json(in angular.json) as suggested in one of the post but to no avail.

Can someone Help?

Thanks

Upvotes: 1

Views: 410

Answers (1)

Jacob J. Carter
Jacob J. Carter

Reputation: 32

You might need to share with us your @mixin mobile to better debug the problem. Mixins usually require params to work, so take a look at your original mixin.

Also, I would recommend using @use "../../../styles/media-queries" as *; rather than @import.

Upvotes: 1

Related Questions