@import

用途
@import 是 SCSS 的旧版导入方式。
允许直接引入另一个文件的内容,无需显式指定导入的内容。
会将所有导入的样式和内容直接拼接在生成的 CSS 文件中。
缺点
冗长的输出:因为它会重复导入相同的文件,导致生成的 CSS 文件冗长。
变量和混入的命名冲突:所有导入的文件共享同一个全局命名空间。

@use

用途
@use 是 SCSS 的现代导入方式,推荐用于新项目。
允许模块化引入文件,避免全局命名冲突。
通过限定符(命名空间)访问文件中的内容。
语法与行为
默认带有命名空间(文件名),通过 . 访问变量、@mixin 和函数。
支持引入时自定义命名空间。
引入文件时,不会重复生成内容。