Skip to content

Replace bootstrap-vue components incompatible with Vue 3 @vue/compat #21956

Description

@dannon

Bootstrap-vue v2 components that use scoped slots crash at runtime under `@vue/compat`:

```
TypeError: Cannot read properties of null (reading 'ce')
at renderSlot (vue.cjs.js)
```

Simple components (BButton, BAlert, BCard, BFormInput) work fine through compat. But any component that passes data through slot scopes hits this error. These must be replaced with custom implementations before the Vue 3 migration (#20787) can complete.

Affected components

Component Files Replacement Status
BTable ~45 files GTable / GCard ✅ Done — #21703
BModal (with scoped slots) ~34 files GModal ✅ Done — #21976
v-b-modal directive 17 uses Not started
BTabs / BTab 14 files GTabs / GTab Merged — #21960
BDropdown (+ variants) 27 files GDropdown family #21961
BPopover 15 files GPopover #21959
BCollapse 11 files GCollapse #21958
BOverlay 5 files GOverlay Merged — #21957
v-b-tooltip directive 140 files (290 uses) v-g-tooltip directive #21962 — works through compat but replacing proactively

All custom replacements use `@floating-ui/dom` for positioning (popover/dropdown) or simple CSS transitions, with no external dependencies beyond what's already in the project.

The `v-b-tooltip` directive technically works through compat (directives don't use scoped slots), but is being replaced with a custom `v-g-tooltip` directive as part of the same effort to eliminate the bootstrap-vue dependency.

Progress

Related

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions