BootstrapVue 不兼容 Vue 3，因其强依赖 jQuery 和 Popper.js v1，而 Vue 3 已移除 jQuery 兼容层，导致运行时报错；应改用专为 Vue 3 重写的 bootstrap-vue-3 或轻量桥接库 vue-bootstrap-5。
Bootstrap 本身不提供 Vue 组件，所谓“在 Bootstrap 中集成 BootstrapVue”是常见误解——实际是「在 Vue 项目中使用 BootstrapVue」，而 BootstrapVue 是一个独立的、为 Vue 2 封装的 UI 库，它基于 Bootstrap 4 的 CSS 规则，但完全重写了 JS 行为。Vue 3 项目不能用它。
为什么 bootstrap-vue 不兼容 Vue 3
Vue 3 已移除对 jQuery 的任何兼容层，而 bootstrap-vue 的所有 JS 组件（如 BDropdown、BModal）底层强依赖 jQuery 和旧版 Popper.js v1。启动时会直接报错：TypeError: $ is not a function 或 Cannot read properties of undefined (reading 'offsetParent')。这不是配置问题，是架构级不兼容。
- npm install bootstrap-vue 安装的是 Vue 2 专用版本，文档明确标注 “Not compatible with Vue 3”
- 即使强行 import 'bootstrap' + 'bootstrap-vue'，
BButton渲染后点击无响应，控制台静默失败 - 其
IconsPlugin使用已废弃的Vue.component()全局注册方式，Vue 3 Composition API 下无法工作
bootstrap-vue-3 才是 Vue 3 的正确选择
它不是 bootstrap-vue 的升级版，而是完全重写的替代品：放弃 jQuery、使用原生 DOM API + Vue 的 ref 和生命周期钩子管理状态，组件名前缀仍为 B*（如
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 安装命令必须是：
npm install bootstrap-vue-3（注意没有连字符，不是bootstrap-vue3或bootstrap-vue-3.0） - main.js 中注册方式：
import { BootstrapVue3 } from 'bootstrap-vue-3'; app.use(BootstrapVue3); - 它不打包 Bootstrap CSS，需单独引入：
import 'bootstrap/dist/css/bootstrap.min.css' - 不支持 data-bs-* 属性驱动行为（如
data-bs-toggle="modal"），必须用组件 props 控制显隐
想保留 data-bs-* 写法？用 vue-bootstrap-5
如果你已有大量原生 Bootstrap HTML 模板，或团队坚持用属性驱动而非组件封装，vue-bootstrap-5 更贴近直觉：它不提供新组件，只把 Bootstrap 5 的 JS 初始化桥接到 Vue 的 mounted/unmounted 钩子中。
- 需手动调用
initBootstrap()（在 main.js），再在组件中用useBootstrapModal(ref)等组合式函数绑定元素 - 每个用到 tooltip/modal 的地方都要单独初始化，模板里得写
+const modalBtn = ref() - 服务端渲染（SSR）场景下会跳过 JS 初始化，首次加载无交互 —— 因为
document在 Node 环境不存在 - 不处理样式冲突，比如 Bootstrap 默认给
body设margin: 0，可能和你的全局 reset 冲突
真正容易被忽略的是初始化时机：无论用哪个库，只要在 onMounted 里操作 ref 对应的 DOM，就必须确保该 ref 已真实挂载且非 null；否则 useBootstrapModal 或 BModal 的内部逻辑会因找不到节点而静默失效 —— 这类问题不会抛异常，只会让功能“看起来没反应”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
