primefaces / primeflex

PrimeFlex is a lightweight responsive CSS utility library to accompany Prime UI libraries and static webpages as well
https://www.primefaces.org/primeflex
MIT License
626 stars 191 forks source link

How to use Primeflex with Dart SASS? #206

Open muuvmuuv opened 10 months ago

muuvmuuv commented 10 months ago

When building with Vite/esbuild in Angular new application builder, this import is deprecated and any further @include on primeflex mixins wont work. New Dart SASS uses @use now.

@import "primeflex/primeflex";
.p-card {
  .p-card-header,
  .p-card-body {
    @include style-class("px-4 pt-4");
  }
}
Application bundle generation failed. [0.520 seconds]
✘ [ERROR] Undefined mixin.
  ╷
6 │     @include style-class("px-4 pt-4");
  │     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src/theme/_overrides.scss 6:5  @import
  src/theme/main.scss 13:9       root stylesheet [plugin angular-sass]

    angular:styles/global:styles:4:8:
      4 │ @import 'src/theme/main.scss';
muuvmuuv commented 10 months ago

My bad, wrong mixing, this works:

@use "primeflex/core/_utils" as *;

Still a bit hacky.

This would look better:

@use "primeflex/utils" as *;