报错 Deprecation Warning [import]: Sass @import rules are deprecated and will be removed in Dart Sass

在vue3-vite-vant的项目中引入全局样式 mixin方法遇到的问题：

这个警告是因为在 Dart Sass 中，传统的 @import 规则已被弃用，将在 Dart Sass 3.0.0 版本中移除，推荐使用 @use 和 @forward 规则来替代。下面为你介绍如何修改代码以消除这个警告。

使用 Vite
修改 vite.config.js 文件，同样把 @import 替换成 @use

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  plugins: [vue()],
  css: {
    preprocessorOptions: {
      scss: {
        // 将 @import 替换为 @use
        additionalData: `@use "@/styles/mixins.scss" as *;` 
      }
    }
  }
});

@use 与 @import 的区别：@use 会将模块中的成员封装在一个命名空间中，默认情况下需要使用命名空间前缀来访问这些成员。使用 as * 可以将所有成员引入到全局命名空间，但在大型项目中，建议使用更具描述性的命名空间，避免命名冲突