Broken styling after react-bootstrap v1 to v2 upgrade: how to roll back cleanly or finish the migration
20K reputation · 18 Jan 2021, 00:50 UTC
Broken styling and import errors after upgrading react-bootstrap
After upgrading react-bootstrap from v1.x to v2.x in an existing project, the application shows two distinct failure modes at once: compile-time import errors for components that were renamed or removed, and silently broken styling on components that still compile. The working assumption is that v2 targets Bootstrap 5 while the project still loads Bootstrap 4 CSS, and that the library does not bundle or enforce the CSS pairing.
Current uncertainty
It is unclear whether the right recovery path is to revert package.json and the lockfile to the last known-good react-bootstrap/bootstrap pair and reinstall from scratch, or to push forward through the migration. There is also concern that a stale node_modules or lockfile could preserve the broken state even after reverting, and that a peer dependency mismatch with the installed React version could cause subtle runtime issues that survive a rollback.
Questions
- When a v1-to-v2 upgrade fails partway, what determines whether rollback or completing the migration is the lower-risk option?
- Is reverting package.json plus the lockfile and reinstalling sufficient to guarantee the pre-upgrade behavior, or can cached artifacts keep the failure state?
- Should the Bootstrap CSS version be pinned independently of react-bootstrap, given the pairing is documented but not enforced?