在vue3+ts项目中引入element-plus及其图标

1、下载依赖

npm install element-plus --save

npm install @element-plus/icons-vue

2、main.ts配置

import { createApp } from 'vue'
//全局引入  
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
//配置国际化语言-中文
import zhCn from 'element-plus/es/locale/lang/zh-cn'
//引入图标 
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import './style.css'
import App from './App.vue'const app = createApp(App)app.use(ElementPlus, {locale: zhCn,
})for (const [key, component] of Object.entries(ElementPlusIconsVue)) {app.component(key, component)
}app.mount('#app')

3、tsconfig.app.json配置

{"compilerOptions": {"types": ["element-plus/global"],}
}

4、在页面中使用

<el-input v-model="value"  placeholder="搜索" prefix-icon="Search"/>

5、效果