vue3项目中使用sass报错：[plugin:vite:css] [sass] Can't find stylesheet to import.

使用sass时，报错：

[plugin:vite:css] [sass] Can't find stylesheet to import.
  ╷
1 │ @import "./src/styles/variable.scss";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src\App.vue 1:9  root stylesheet

在vite.config.ts文件配置如下:

    //scss全局变量配置
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          additionalData: '@import "./src/styles/variable.scss";',          
        },
      },
    },

sass1.8后已经弃用@import，使用@use导入

修改：

    //scss全局变量配置
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          // additionalData: '@import "./src/styles/variable.scss";',          
          additionalData: `@use "@/styles/variable.scss" as *;`,
        },
      },
    },

注意使用的是反单引号