Bootstrap 5

Hello!
What’s the recommended branch for using Bootstrap 5? Simply changing the package.json in the master-branch doesn’t work with yarn build throwing errors.

Many thanks,
Wolf-Dieter

Are you using Sage 9 or Sage 10?
Have you ran yarn install after changing the package.json?

Have you ran yarn install after changing the package.json ?
Yes, sure. I’m using sage regularly but just wanted to update Bootstrap from 4.5 to 5.0 beta.

I’ve had this problem today. I’ve addeded “@popperjs/core”: “^2.5.4”,` to the dev-deps. Now it seems to work. (mostly, I was off to post a BS5 question when I saw this)

Thanks a lot Tim, I’ll give that a try. Which branch are you using?

YW, "bootstrap": "^5.0.0-beta1",
But same thing happened to the alpha releases.

I meant which branch of sage.
I’ve added the popper requirement but yarn build still fails with SassError: $color2: null is not a color.

–edit-- Whoop, forgot to answer your question I’ve installed dev-master

Don’t recall Bootstrap using a $color2 var. Is this something you’ve added?
What happens if you try to suppress it by adding

$color2: black;

to variables.scss.

But I might be giving you wrong advice since I don’t know where this sass var comes from.

Here we go: webpack 5 with Bootstrap 5 as PR feature branch for Sage 9.x: https://github.com/strarsis/sage/tree/webpack5-bootstrap5

Some things had to be changed, including some defaults (secondary theme color was missing) (Bootstrap 5 migration guide: https://getbootstrap.com/docs/5.0/migration/).
Clone the forked repository and check out branch webpack5-bootstrap5.
There are some PRs in preparation for updating Sage 9.x dependencies and also the sage-installer which adds extra files and config on top of Sage 9 themes.

Thanks a lot for the info regarding webpack5-bootstrap5 – is there a way to get this working for Sage 10 as well? I’m using 10 also for production sites and would like to avoid going back to v9.

This topic was automatically closed after 42 days. New replies are no longer allowed.