element-plus安装教程

发布时间 2023-10-17 19:45:52作者: 猪油哥

项目场景:

前端vue3项目需要安装element-ui


问题描述

npm安装element-ui报错

npm i element-ui -S
 

报错

D:\javascript\fund-management\projects\node-demo\node-vue-ele-app\client>npm i element-ui -S
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: client@0.1.0
npm ERR! Found: vue@3.2.32
npm ERR! node_modules/vue
npm ERR!   vue@"^3.2.13" from the root project     
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^2.5.17" from element-ui@2.15.8 
npm ERR! node_modules/element-ui
npm ERR!   element-ui@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\ThinkPad\AppData\Local\npm-cache\eresolve-report.txt for a full report.    

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\ThinkPad\AppData\Local\npm-cache\_logs\2022-04-14T03_03_41_897Z-debug-0.log
 

 


原因分析:

element-plus不适配vue3,官方已将vue3版本的更新为element-plus
在这里插入图片描述
链接: element-plus说明文档.


解决方案:

安装

npm install element-plus --save
 

引入

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'

const app = createApp(App)

app.use(ElementPlus)
app.mount('#app')