在vue项目中引入element-plus中的ElMessage不起作用（已解决）

在element-plus官网A Vue 3 UI Framework | Element Plus中的快速开始中，有引入教程。

如果你是完全引入，就可以不继续往下看了，如果你想部分引入，请继续阅读本文

如果你不想完全引入，element-plus官网也给出了另一个方法：部分引入

首先需要安装两款插件

npm install -D unplugin-vue-components unplugin-auto-import

然后需要引入配置

只需要引入到对应位置即可

import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

以下代码直接添加到plugins中即可

AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),

 然后引入之后，你发现还是不行，实际结果：

预期结果：

 

你会发现当你在代码中添加

ElMessage.error(msg)

 element-plus的ElMessage组件时，它会自动给你引入一个

import { ElMessage } from "element-plus";

只需要将这个单独引入的代码删除即可