不能在小程序中直接使用bootstrap 5，因其css依赖的@media、:root变量、@import等语法不被wxml渲染层支持，js组件又因缺失document等dom api而必然报错，底层架构不兼容导致样式失效与交互崩溃。
Bootstrap 5 CSS 在小程序里根本不会生效
不能靠“引入就完事”。微信小程序的 WXML 渲染层不支持 @media、@import、CSS 变量（:root）、全局选择器（如 html、body），而 Bootstrap 5 的 CSS 正严重依赖这些。哪怕你把 bootstrap.min.css 放进 app.wxss 并用 @import 引入，控制台大概率报 Unknown at rule @import，按钮没圆角、栅格全塌、响应式断点彻底失灵——这不是加载失败，是语法被直接忽略。
强行 import 会触发运行时 JS 错误
Bootstrap 的 JS 组件（比如 Modal、Toast）依赖 document.querySelector 和原生 DOM 操作，但小程序逻辑层（App Service）和视图层（WXML）完全隔离，没有 document 对象。一旦你在页面 JS 中 import 'bootstrap.bundle.min.js' 并尝试 new bootstrap.Modal(...)，立刻抛出 Cannot read property 'querySelector' of undefined —— 这不是配置问题，是底层架构不兼容。
微信小程序 TabBar 图标生成技能，使用 Python PIL 绘制简约几何图标（未选中灰、选中绿），自动写入 app.json 配置。适用于“生成 tabBar 图标”、“底部菜单栏图标”、“tab 图标”等指令。
别信“改写 class 名就能用”的说法
有人试过把 .btn 手动改成 .my-btn 再复制规则到 page.wxss，短期看似可用，但很快暴露问题：
- 所有依赖媒体查询的类（如
.col-md-6）无法响应屏幕宽度变化，因为小程序不执行@media -
.d-none、.text-center等 utility 类在不同平台渲染结果不一致，WXML 的样式作用域和浏览器完全不同 - 一旦升级 Bootstrap 版本，所有手动搬运的 CSS 都得重审，且无法享受官方修复和新特性
Skyline 渲染引擎也不能救 Bootstrap
即使你启用了微信开发者工具的 Skyline 模式（需基础库 ≥2.31.1），它只是提升了 WXML 渲染性能和调试能力，并未开放 document API 或放宽 CSS 限制。Bootstrap 的核心机制仍被阻断。你可能会看到部分静态样式“偶然”显示，但只要涉及 JS 初始化、动态 class 切换或响应式行为，就会立即失效。真正能用的，只有纯 CSS 规则中不带 @ 开头、不依赖伪类/伪元素、不嵌套、不使用变量的极小片段——而这已失去 Bootstrap 的意义。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
