vite-plugin-style-import自动引入element-plus的stylevite-plugin-st

安装npm i -D vite-plugin-style-import，因为已经升级vite-plugin-style-import@2.0.0版本了，使用方式稍微有点区别

import {
  createStyleImportPlugin,
  ElementPlusResolve,
} from 'vite-plugin-style-import';

export default defineConfig({
  plgins: [
    createStyleImportPlugin({
      resolves: [ElementPlusResolve()],
      libs: [
        {
          libraryName: 'element-plus',
          esModule: true,
          resolveStyle: (name: string) => {
            name = name.substring(3, name.length);
            return `element-plus/es/components/${name}/style/index`;
          },
        },
      ],
    }),
  ]
});

根据ndoe_moudles/element-plus里面的文件结构，还可以使用下面语法

resolveStyle: (name: string) => {
  return `element-plus/theme-chalk/${name}.css`;
}

然后在某个ts文件，比如main.ts中就可以直接使用

import { ElMessage } from 'element-plus';
ElMessage.error('消息提示');