SCSS 中没有 sass:string 模块，string 相关函数如 to-upper-case()、to-lower-case() 等直接位于顶层；它们仅支持 ASCII 字符串字面量，编译时执行，不可用于运行时动态处理。
SCSS里没有 sass:string 模块
别在 SCSS 里找 sass:string —— 它根本不存在。Sass 官方函数库中没有这个命名空间，string 相关功能都直接挂在顶层，比如 to-upper-case()、to-lower-case()、str-length() 等。所谓 “sass:string” 是误传，常见于混淆了 Dart Sass 的模块导入语法或把其他语言（如 JavaScript 的 String）套用过来了。
真正可用的文本大小写转换函数只有 to-upper-case() 和 to-lower-case()
这两个函数是 Dart Sass（当前主流实现）原生支持的字符串处理函数，但有严格限制：
- 只接受纯字符串字面量（
"hello"），不接受变量插值后带空格/符号的表达式 - 仅对 ASCII 字母生效，中文、数字、emoji、标点一律原样返回
- 不能用于动态生成 CSS 属性值（比如
content: to-upper-case($text)在伪元素中可能被编译器拒绝，取决于上下文） - 函数调用发生在编译时，无法响应运行时用户输入或 DOM 变化
示例：
$label: "user name";
.upper-label::before {
content: to-upper-case($label); // 编译后 → content: "USER NAME";
}
text-transform 仍是视觉大写的首选，别用函数替代它
如果你只是想让按钮、标题显示为大写，text-transform: uppercase 是正确且轻量的选择。用 to-upper-case() 去“提前转好再写进 CSS”，反而错位：
立即学习“前端免费学习笔记（深入）”；
- 它把转换逻辑移到了编译期，失去灵活性（比如换语言时无法复用同一份 SCSS）
- 若原始文本含变量（如
$brand: "aBc"），to-upper-case($brand)虽能工作，但结果固化在生成的 CSS 里，不可访问性与 SEO 仍按原始值处理 - 和
text-transform的语义完全不同：前者改的是 CSS 字符串字面量，后者改的是渲染行为
真正需要函数的场景极少，比如生成类名：.btn-#{to-upper-case($size)} → .btn-LARGE。
容易忽略的关键点：浏览器不执行 SCSS 函数，只认编译结果
所有 to-upper-case() 调用都在构建时完成。一旦生成 CSS，就和 JS 的 .toUpperCase() 再无关系。这意味着：
- 你无法用它响应表单输入、动态 API 数据或 localStorage 值
- 如果依赖它生成关键样式（如基于用户角色的类名），必须确保变量在编译前就确定，否则会报错或输出空值
- 某些构建工具（如 Vite + sass-plugin）对非字面量参数更敏感，
to-upper-case($var + "-suffix")可能直接失败
真要运行时控制大小写，请回到 CSS 的 text-transform 或用 JS 处理 DOM 文本节点。
