Gatsby: Importing bulma css causes postcss-custom-properties error

[rchaubey]

All I did was installed bulma

yarn add bulma

Then imported bulma css

import "bulma/css/bulma.css"

And this is the error I get

[jquense]

does bulma rely on css properties?

[rchaubey]

@jquense Yes, they do use custom css properties. Is that a problem ?

[jquense]

No, just trying to understand the issue a bit. I think the problem is here that the default css setup adds a bunch of cssNext setup along with it, which isn't a great default..

[mikewesthad]

I just ran into the same issue. I created a local copy of the gatsby postcss sass plugin and ripped out the postcss (since I don't need it).

[mbfisher]

Posting my solution to this for others:

• Install gatsby-plugin-sass (see here)
• Create layouts/index.scss (see here)

$variable-columns: false;
@import "~bulma/bulma";

• Import index.scss in layouts/index.js

[marcelkooi]

@mbfisher had to add one more step to get that to work:

• Add "gatsby-plugin-sass" to plugins: in gatsby-config.js

[KyleAMathews]

Due to the high volume of issues, we're closing out older ones without recent activity. Please open a new issue if you need help!