Bootstrap 6 更轻、更模块化，核心包压缩至约45KB（gzip后），默认支持CSS Custom Properties主题变量，弃用float类和sr-only等辅助类，强制WCAG 2.1 AA合规，RTL通过:dir(rtl)自动适配，React/Vue生态已就位但需重构交互逻辑，构建链路定制成本显著增加。
Bootstrap 6 会更轻、更模块化，但不会抛弃传统开发者
Bootstrap 6 目前虽未正式发布，但根据官方路线图和 bootstrap 仓库的 RFC 讨论（2025 年底起持续更新），它明确放弃“大而全”的包体积策略，转向按需加载的核心架构。这意味着你不再需要为一个按钮引入整套 JS 和 CSS —— 而是通过 @import 或 ES 模块只拉取 bootstrap/js/dist/button.js 或 bootstrap/scss/forms/_input.scss。
- 核心包压缩至约
45KB（gzip 后），靠移除废弃工具类、合并重复断点逻辑、剥离非必需组件实现 - 所有组件默认支持
CSS Custom Properties主题变量，比如--bs-btn-bg可直接在 :root 中覆盖，无需重写 Sass - 不再提供预编译的
bootstrap.min.css全量文件，推荐用构建工具（Vite、Webpack）做 tree-shaking - 旧项目升级时，
float类（如.float-left）和sr-only等辅助类已被标记为 deprecated，v6 中将彻底删除
无障碍与合规性不再是“加分项”，而是强制基线
Bootstrap 6 的设计文档已将 WCAG 2.1 AA 合规写入每个组件的验收标准。这不是口号——比如 bootstrap-switch 插件在 v6 对齐中，所有开关都必须带 aria-checked + role="switch"，且键盘 Space 键触发行为必须与点击严格一致；否则 CI 测试直接失败。
-
form-check-input的id和关联label[for]不再可选，缺失即警告 - 颜色对比度检测集成进构建流程，
--bs-primary默认值被调高以满足文本最小 4.5:1 对比 - RTL（从右到左）支持不再是靠
dir="rtl"手动切，而是通过:dir(rtl)CSS 伪类自动适配 - 如果你还在用
tabindex="0"强行让 div 可聚焦，v6 的dropdown和modal组件会直接忽略该元素的焦点管理逻辑
React/Vue 开发者别指望“一键迁移”，但生态已就位
react-bootstrap v3.0.0 正式版已在 2026 年初发布，它不再封装 Bootstrap 的原生 JS，而是完全基于 React 的状态和 ref 重写交互逻辑 —— 这意味着你不能再用 $('#myModal').modal('show')，而必须用 <modal show="{true}"></modal>。Vue 方面，bootstrap-vue-next（非官方但社区主导）已支持 Vue 3.4 的 defineModel 语法糖，但尚未进入 Bootstrap 官方推荐列表。
- JSX 中传入
bsPrefix替代 class 名拼接，比如<button bsprefix="btn btn-outline"></button>会被拒绝，正确写法是<button variant="outline-primary"></button> - TypeScript 类型定义现在由
@types/react-bootstrap单独维护，且与 Bootstrap 6 的 CSS 变量名强绑定（例如bsColor类型包含'primary' | '--bs-primary-rgb'） - 如果你项目里混用了
bootstrap原生 CSS 和react-bootstrap组件，v6 的 CSS 变量命名变更（如--bs-emphasis-color→--bs-text-emphasis）会导致样式断裂，必须同步升级
别低估“CSS 变量 + 构建时注入”带来的定制成本
Bootstrap 6 把主题定制从 “改 Sass 变量 → 重新编译” 变成 “运行时注入 CSS 变量”，听上去很美，但实际落地时，很多团队卡在构建链路上：Vite 的 css.vars 插件不识别 @layer 内的变量作用域，Webpack 的 css-loader 默认不展开 var(--bs-primary) 的嵌套计算，导致深色模式切换失效。
- 推荐做法：用
postcss-custom-properties在构建阶段静态替换，而非依赖浏览器 runtime - 自定义断点（如新增
xxl）不能只改$grid-breakpoints，还必须手动注册到media-query工具类生成器中，否则.d-xxl-block不会出现 - 如果你用 Tailwind 的
@apply复用 Bootstrap 的 utility 类，v6 的新变量系统会让@apply bg-primary编译失败 —— 因为bg-primary已退化为background-color: var(--bs-primary)，而@apply不处理函数式值
真正麻烦的不是学新语法，而是你现有构建配置里那些没写注释的 PostCSS 插件顺序、Sass !default 覆盖逻辑、以及 CI 中缓存的 node_modules —— 它们会在你 upgrade 后静默报错，直到某天 QA 发现 modal 背景变透明了才暴露出来。
