旧版 Sass 除法语法被废弃是因为 / 在 Sass 3.6+ 中仅在 CSS 值中保留除法含义，直接写 100px / 2 不计算而原样输出，为兼容 CSS 做妥协但导致旧代码静默失效；必须改用 sass:math.div() 显式计算，且需注意作用域、单位一致性、精度控制及迁移排查。
旧版 Sass 除法语法为什么被废弃
在 Sass 3.6+ 中，/ 不再默认作为除法运算符——它只在特定上下文中（如 CSS 值中）保留原意，比如 font: 16px/1.5。直接写 100px / 2 会原样输出 100px / 2，不计算，也不报错，但结果不是你想要的数值。这是为了兼容 CSS 原生语法做的妥协，但代价是旧代码静默失效。
必须用 sass:math.div() 替代所有显式除法
新版必须显式调用函数完成数值计算。注意：仅限数值型操作数，单位必须一致或可转换（如 px 和 rem 不能直接除），否则编译报错 "Cannot divide 100px by 2rem"。
-
sass:math.div(100, 2)→50 -
sass:math.div(100px, 2)→50px -
sass:math.div(100px, 2px)→50（无量纲） - 错误写法：
100px / 2（输出字面量，不计算）
混合（mixin）和函数里容易漏掉 sass:math 导入
即使你在顶层文件用了 @use "sass:math"，它也不会自动作用于 @include 或自定义函数内部。每个需要除法的 @mixin 或 @function 文件都得单独导入。
- 在 mixin 文件顶部加：
@use "sass:math"; - 不能依赖父文件导入，Sass 模块作用域严格隔离
- 常见坑：
@function grid-column-width($columns) { @return 100% / $columns; }→ 必须改成@return math.div(100%, $columns);
除法结果精度和单位继承要手动控制
sass:math.div() 默认保留浮点精度，但不会自动四舍五入，也不会帮你补单位。比如 math.div(1, 3) 得到 0.3333333333...，直接用于 width 可能触发浏览器渲染抖动；math.div(100px, 3) 返回 33.3333333333px，而你可能想要 33.33px。
立即学习“前端免费学习笔记（深入）”；
- 用
math.round()或math.precision()控制小数位：math.round(math.div(100px, 3), 2) - 单位丢失时需显式补上：
math.div(100, 3) + "rem"是错的（字符串拼接），应改用math.div(100rem, 3) - 百分比除法要注意：
math.div(100%, 12)→8.33333%，但math.div(100, 12) + "%"会出错（类型不匹配）
最麻烦的不是写法变长，而是旧项目里散落各处的 / 很难靠 grep 全部定位——尤其夹在字符串、注释或 CSS 值中间时。建议先跑一遍 sass --dry-run，再配合 IDE 的“引用未使用变量”提示反向排查 math 函数缺失点。
