-
-
Notifications
You must be signed in to change notification settings - Fork 4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Unable to fully use Bulma Sass with the new Sass modular system (@use) #2797
Comments
There is a post on Sass which refers to this issue: sass/sass#2809 (comment) |
Interesting. I will start working on upgrading Bulma to this new system. |
A little bit of context: https://sass-lang.com/blog/the-module-system-is-launched Namespacing variables is a good idea indeed. |
This is kinda breaking change for Bulma, as moving to Yarn 2 (Berry) we don't have |
I would just like to check if this issue is being addressed. |
I have managed to eliminate the error by prefixing underscore ( _ ) to all the Sass files. |
Is there any update on this? |
Same issue here |
Are there concrete ways to help here? I just updated bulma and unfortunately face the same issue. Any directions? |
Im really disapointed by this system |
Yes this could be improved. Some of the manipulations are done for the colors map but could be moved globally. |
I was able to actually make this work without any additional packages: vendors/_bulma.scss @charset "utf-8";
@use '~bulma/sass/utilities/initial-variables'as * with(
$red: pink
);
@use '~bulma/bulma' with(
$danger: blue,
$success: $red,
); vendors/index.scss @use 'bulma'; index.scss @use 'vendors'; Note: since ~/bulma/bulma simply imports everything it means that the variables are globally available within that file, thus the combination of the !default keyword on any variable imported in that file with the usage of the @foruseward with will mean that you'll be overriding those variables. The only issue I face is the fact that I need to keep importing bulma variables in other places to be able to use them which is annoying |
@MrToxy What if I have colors.css file with all the custom colors to pass with bulma? |
This is about Bulma.
Overview of the problem
This is about the Bulma CSS framework
I'm using Bulma version [0.8.0]
This is a Sass issue: I'm using version [1.25.0] (Dart Sass)
I am sure this issue is not a duplicate
Description
I was refactoring code to start using the new Sass modular system and at first it was ok, but once I tried to use navbar.sass directly the compiler started complaining:
SassError: Undefined variable. 1 │ $navbar-background-color: $scheme-main !default
I tried several options like placing the variable in the file I am calling this from, pushing the variable though with the 'with' option, calling @import on the derived-variables but nothing worked.
I feel that the Bulma structure would need to be updated to support this.
Steps to Reproduce
@use "~bulma/sass/components/navbar.sass" with ( $scheme-main: "red" );
Expected behavior
It compiles
Actual behavior
Get an error
SassError: Undefined variable. 1 │ $navbar-background-color: $scheme-main !default
The text was updated successfully, but these errors were encountered: