如何在vite中使用导入全局scss，让他在每个页面都可以使用

要在 Vite 中使用全局 SCSS，可以按照以下步骤操作：

1. 安装依赖

npm install -D sass

2. 在项目根目录下创建一个 `global.scss` 文件，并编写所需的全局样式。

3. 在 `main.js` 文件中导入 `global.scss` 文件。

import './global.scss'

4. 在 `vite.config.js` 中使用 `styleImport` 插件，以使全局 SCSS 可以在每个页面中使用。如下所示：

import { defineConfig } from 'vite'
import styleImport from 'vite-plugin-style-import'

export default defineConfig({
  plugins: [
    styleImport({
      libs: [
        {
          libraryName: 'element-plus',
          esModule: true,
          ensureStyleFile: true,
          resolveStyle: (name) => {
            name = name.slice(3)
            return `element-plus/packages/theme-chalk/src/${name}.scss`
          },
          resolveComponent: (name) => {
            return `element-plus/lib/${name}`
          },
        },
      ],
    }),
  ],
})

这里的示例使用了 `vite-plugin-style-import` 插件，并且还演示了如何使用 `styleImport` 插件来导入 `element-plus` 组件库的样式。你可以将 `element-plus` 替换为自己的组件库或自定义的样式文件路径。