必须改函数调用方式：dart sass ≥1.23 要求所有内置函数（如color.lighten、map.get、math.div）须通过@use引入，禁用全局调用；第三方库也需改用@use并加命名空间。
遇到[global-builtin]警告，必须改函数调用方式
这个警告不是编译失败，但说明你正在用旧式全局调用——比如直接写lighten($color, 10%)或map-get($map, "key")。Dart Sass ≥1.23 已强制要求模块前缀，否则未来版本会报错。
- 所有内置函数必须通过
@use "sass:color"、@use "sass:map"等引入，再用color.lighten()、map.get() -
@use "sass:math"替代ceil()/floor()等数学函数，math.div(10, 3)不能写成10 / 3（后者在新语法中是除法运算符，非函数） - 第三方函数库（如
bourbon或自定义_functions.scss）也得改成@use并加命名空间，不能靠@import“污染”全局作用域
legacy-js-api警告本质是构建工具调用方式过时
Vite 或 Webpack 仍通过老接口调用 Dart Sass，比如用sass.render()而非sass.compile()或sass.compileString()。这不是你代码的问题，而是插件或 loader 没升级。
- Vite 用户：确认
vite-plugin-sass已卸载，只保留sass（npm install -D sass），Vite 本身已内置新版 API 调用 - Webpack 用户：把
sass-loader升到≥14.0.0，并确保implementation指向require('sass')，不是require('node-sass') - Element Plus 等 UI 库若触发该警告，说明它内部仍依赖旧版
sass调用逻辑；临时方案是在vite.config.js里加css.preprocessorOptions.sass.additionalData注入兼容层，长期应推动库方升级
输出体积失控？别只盯着--style=compressed
--style=compressed只是格式压缩，对重复规则、未用选择器、冗余@extend完全无感。真正膨胀来自源码组织——比如一个@import "_all.scss"把整个设计系统全塞进每个组件样式里。
- 禁用
sourceMap：上线构建前务必设sourceMap: false，否则.css.map内容会追加 base64 字符串，体积翻倍 - 用
@use替代@import：只有被@include或引用的@mixin/$variable才会进入最终 CSS；@import是全文本拼接，毫无粒度控制 - 检查
@forward是否暴露了不该导出的内容：例如@forward "mixins" as *;会让所有 mixin 全局可用，破坏按需原则
VSCode/WebStorm 自动编译与 CLI 冲突时，优先关掉 CLI
Live Sass Compiler 插件和sass --watch同时运行，会争抢写文件权限，尤其 Windows 下常导致 CSS 内容截断或.map损坏。
- VSCode 插件默认不生成
.map，需手动开启liveSassCompile.settings.generateMap: true；WebStorm 则必须在 File Watcher 的Arguments里显式加--source-map - 插件默认跳过
_partial.scss文件（以下划线开头），调试时想看某 mixin 编译结果，得在includeItems里加["**/_mixins.scss"] - 如果项目用了
@use "path/to/file"别名（如@use "src/styles/vars" as v），确保插件支持 importer 配置，否则 source map 的sources字段可能为空或路径越界
@use路径写错、一个sourceMap开关漏关、一个 UI 库没切模块系统，都可能让警告变成构建失败。这些点不在错误信息里，得靠检查链路每层的配置细节。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
