Undefined variable: "$blue-500" when upgrading to 0.7.0

[chipzoller]

Hey Docsy community. Just tried to upgrade our site to v0.7.0 and when attempting to do a hugo serve (hugo v0.112.5+extended darwin/arm64) it's throwing the following:

Error: error building site: TOCSS: failed to transform "scss/main.scss" (text/x-scss): "/var/folders/96/j6znr_7n3lj_gpyxts9tqnzr0000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/google/docsy@v0.7.0/assets/scss/_variables.scss:37:14": Undefined variable: "$blue-500".

Is this possibly user error or a stale site config, or a code level problem somewhere in Docsy or one of its deps?

go version
go version go1.20.5 darwin/arm64

[chalin]

Hi @chipzoller. Can you tell us a bit more about your setup? Which project is this? Which version of Docsy are you upgrading from? How is the project bringing in Docsy?

[chipzoller]

Hi @chalin, this is the Kyverno project. We're coming from 0.6.0 and Docsy is being managed as a Hugo module.

https://github.com/kyverno/website

[chalin]

I can reproduce the problem.
@deining is the resident expert on Hugo Modules. Andreas: any ideas?
/cc @geriom

[deining]

Yes, I could reproduce and resolve the issue, see my according pull request.

The problem was that the Kyverno project defined its own assets/scss/main.css. This is not considered best practice and caused problems here. I solved it by adding a missing import to main.css which resolved the issue. Please note that this is a hack only. I leave it up to the authors to move the custom content from main.css into _styles_project.scss and _variables_project.scss respectively and remove main.css afterwards.

[chalin]

Thank you @deining! ✨

[chalin]

I'm going to close this issue now since the problem was due to your custom main.scss file. As @deining mentions, that isn't recommended practice for use of Docsy -- but if you choose to keep your custom main.scss (which is fine), you'll need to carefully "port" the changes made to Docsy's main.scss.

[chipzoller]

Thank you both very much for such a fast response. It appears we'll need to seek some outside assistance to get these custom changes moved around since the PR with the upgrade and changes seems to break some of the CSS. Not expecting the Docsy team to worry about that, but it's good to know where to look.

[chalin]

v0.7.0 is a significant update that includes the (breaking-change) migration to Bootstrap 5. To learn more, see Migrating to Bootstrap 5.2. (I think I'll add this note to the release comment.)