CSS not loaded about bloomer

[sandalsoft]

For those having a similar issue with the CSS not rendering when using create-react-app, this is the import that fixed it for me:

import 'bulma/css/bulma.css';

Referenced here: jgthms/bulma#388 (comment)

[AlgusDark]

Are you importing bulma? Right now you need to import bulma in your project since bloomer *currently* is just a wrapper. So doesn't import bulma by itself. In future releases is going to be a styled-componentes library with his own styles.

[kaspermarstal]

Appreciate the quick response. How do I load Bulma with import? Could not find it in your otherwise excellent documentation. A naive approach like import 'bulma' or import 'bulma/css/bulma does not work.

[AlgusDark]

Well... That's weird.

If you're using SASS, you can import modules like:

@import "bulma/sass/utilities/_all"
@import "bulma/sass/grid/columns"

If not, import 'bulma/css/bulma' should work. Do you have an example nextjs repo where I can test this? I've never tried next but I can try now igual you help me with that :)

[kaspermarstal]

Sure! Here it is: https://github.com/kaspermarstal/x-rai-website. Run npm install and npm run dev. The website is styled because of the link rel. You can remove this line and uncomment the import to see the error.

[AlgusDark]

Hey, this seems to be a configuration error.

You may need an appropriate loader to handle this file type

So, you need something for Next like css-modules.

Please check this thread.

Once that you have the correct loader, you're going to be able to import bulma css.

I'm going to close this issue since this is only a configuration problem with Next.js.

Please tell us if you found your solution :)

[kaspermarstal]

Thanks will try that and let you know!

[srikrsna]

@kaspermarstal Could you get this to work?