最彻底的方式是新建自定义Sass文件，按functions→variables→mixins顺序显式导入所需模块，跳过bootstrap.scss全量入口；JS层改用ES模块按需引入，如import { Button } from 'bootstrap/js/dist/button'；并配合$enable-*变量在variables后、mixins前关闭未用功能。
只导入需要的 Sass 模块，跳过全量引入
禁用组件最彻底的方式，不是“删掉”或“关掉”，而是从一开始就不让它进构建流程。Bootstrap 的 bootstrap/scss/bootstrap 入口文件会一次性拉入全部组件（carousel、modal、tooltip、popover 等），哪怕你一个都没用，CSS 和 JS 都会打包进去。
正确做法是新建自定义 Sass 文件（如 src/custom-bootstrap.scss），按顺序显式导入必需部分：
-
@import "bootstrap/scss/functions";（必须最先） -
@import "bootstrap/scss/variables";（必须第二） -
@import "bootstrap/scss/mixins";（必须第三） -
@import "bootstrap/scss/utilities";（按需保留） -
@import "bootstrap/scss/components/buttons";（只加你真用的） -
@import "bootstrap/scss/layout/grid";（不用 grid 就别写这行）
漏掉 functions 或 variables 会导致后续报错，比如 SassError: Undefined variable "$grid-columns"；但多写一行 @import "bootstrap/scss/components/modal";，就等于主动把 12KB+ 的样式和依赖 JS 全塞进包里。
JS 层面禁用：不 import，就不存在
Bootstrap 5.3+ 的 js/dist/ 目录下每个组件都是独立模块，bootstrap.bundle.min.js 是个“大杂烩”。你 import 它，就等于把 Popper、Modal、Dropdown 全部加载进首屏 JS，哪怕页面里连一个 data-bs-toggle="modal" 都没有。
改用 ES 模块方式显式引入：
- 只用按钮？写
import { Button } from 'bootstrap/js/dist/button'; - 要用折叠菜单？再加
import { Collapse } from 'bootstrap/js/dist/collapse'; - 完全不用 tooltip？就别写那行
import { Tooltip }，也别留着注释“以防万一” - 非关键组件（比如侧边栏收起逻辑）可延迟加载：
import('bootstrap/js/dist/collapse')
检查最终打包产物：如果 node_modules/bootstrap 出现在 vendor chunk 里且体积异常大，说明构建工具误把整个包打进去了——这不是 Bootstrap 的问题，是你配置没控住入口。
通过 Sass 变量在编译时关掉功能开关
有些组件虽未显式导入，但可能被 utilities 或其他模块间接触发（比如 tooltips 依赖 popper，而 popper 又被 dropdown 拉进来）。Bootstrap 提供了 $enable-* 开关，在 variables 之后、mixins 之前设置，能从编译源头掐断：
- 禁用所有过渡动画：
$enable-transitions: false;（省掉大量 CSS 规则） - 禁用圆角：
$enable-rounded: false;（.rounded、.rounded-circle全失效） - 禁用阴影：
$enable-shadows: false;（.shadow类不生成） - 禁用渐变：
$enable-gradients: false;（.bg-gradient不输出）
这些变量必须在 @import "bootstrap/scss/variables" 之后、@import "bootstrap/scss/mixins" 之前设置才生效。设晚了，mixins 已经用上默认值，再改就来不及了。
CDN 场景下没法编译？那就别碰 bootstrap.min.css
纯静态页、老系统嵌入、邮件模板等无法走 Sass 构建的场景，bootstrap.min.css 是唯一选择——但绝不能直接上完整版。官方 CDN 的 bootstrap.min.css 包含全部组件，体积约 200KB（gzip 后约 24KB），其中至少 60% 是你永远用不到的。
此时唯一可控手段是子集化工具，但注意前提：
- PurgeCSS 必须作用于你自己的 HTML/JS 源码生成的 CSS，而不是对
bootstrap.min.css直接开刀——否则会漏掉 JS 动态插入的类（如show、collapsing），导致交互样式丢失 - content 配置必须覆盖所有可能生成 class 的路径：
./src/**/*.html、./src/**/*.js、./src/**/*.ts缺一不可 - 务必启用
keyframes: true和fontFace: true，否则@keyframes fade和图标字体规则会被误删
真正容易被忽略的是：很多团队花半天配 PurgeCSS，却没意识到——只要删掉 modal 和 tooltip 的 Sass 导入，CSS 体积就能直降 40KB。编译期裁剪永远比构建后“扫垃圾”更干净、更可靠。
