必须先导入 utilities/_all.sass，再按需导入具体模块，否则编译报错；禁用 bulma/bulma.sass 入口，避免全量打包；工具类需显式引入，无隐式依赖。
直接按需引入 Bulma 的 Sass 模块，就能只打包你实际用到的 CSS，这是 Bulma 原生支持、无需额外工具的最简路径。关键不是“能不能”，而是“怎么导入才不白写”。
必须先加载 utilities/_all.sass，否则其他模块编译失败
Bulma 的 columns、button、card 等模块都依赖 utilities 里的函数、变量和基础重置。跳过它会导致 Sass 编译报错，比如 Undefined variable: "$size-7" 或 Function "rem" is not found。
- 正确顺序：先
@import "bulma/sass/utilities/_all.sass"，再导入具体组件 - 不要用
@import "bulma/sass/utilities/initial-variables"单独导入——它不包含functions和derived-variables，仍会出错 - 如果你用了 npm 安装，路径写
bulma/sass/...即可（Webpack/Vite 的 Sass loader 默认已配置includePaths）
按功能选模块，而不是靠 purgecss 补救
purgecss 是兜底手段，不是设计起点。Bulma 的 39 个 Sass 文件是真正可拆的，比如只用栅格就导入两行：
@import "bulma/sass/utilities/_all.sass"; @import "bulma/sass/grid/columns.sass";
常见组合示例：
立即学习“前端免费学习笔记（深入）”；
- 只做表单：
@import "bulma/sass/utilities/_all.sass"+@import "bulma/sass/form/general.sass"+@import "bulma/sass/form/input-textarea.sass" - 仅导航栏：
@import "bulma/sass/utilities/_all.sass"+@import "bulma/sass/components/navbar.sass" - 带图标的按钮：
@import "bulma/sass/utilities/_all.sass"+@import "bulma/sass/elements/button.sass"+@import "bulma/sass/elements/icon.sass"
注意：icon.sass 不在 button.sass 的依赖链里，漏了它，.button > .icon 就没样式。
避免误导入 bulma/bulma.sass 或 bulma.sass 入口文件
一旦写了 @import "bulma/bulma" 或 @import "bulma"，Sass 就会把整个框架拉进来——包括你完全不用的 modal、dropdown、breadcrumb，体积立刻翻倍。
- 这个入口文件本质是“全量开关”，内部做了条件判断，但你无法绕过它的默认行为
- 即使你在它后面加
// @import "bulma/sass/elements/button.sass"，也毫无意义：前面已经全量编译完了 - 真正的按需，是从头放弃这个入口，手动拼接最小依赖链
最容易被忽略的一点：Bulma 的模块之间没有隐式依赖声明，navbar.sass 不会自动帮你引入 helpers.sass，但如果你用了 .is-hidden-mobile 这类工具类，就得单独加一行 @import "bulma/sass/helpers/display.sass"。别指望“用了组件就等于有了配套工具”。
