1、 npm下载scss包

npm install sass sass-loader -d

2、创建全局的scss文件添加全局样式

![在这里插入图片描述](https://img-blog.csdnimg.cn/8c697e8a161c4b9aa761b249713e0768.png

3、Vite 添加css配置

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `@import "./src/style/mixin.scss";` // 此处全局的scss文件
      }
    }
  }
})

4、使用配置好的 scss 可以使用定义好的scss样式

在这里插入图片描述

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐