时间戳

首页 > 解决方案 > 如何将 element-ui（现在称为 element-plus）添加到 Vue3 项目？

vuejs2 - 如何将 element-ui（现在称为 element-plus）添加到 Vue3 项目？

问题描述

我一直在使用“element-ui”，现在正在使用新版本的 Vue3。似乎他们发布了一个名为“element-plus”的新版本，但教程没有更新。

import Vue from 'vue';  // not working in Vue3
import ElementUI from 'element-plus';
import 'element-ui/lib/theme-chalk/index.css';
...

Vue.use(ElementUI);  // no "Vue" in Vue3 anymore
...
createApp(App).mount('#app') // the new project creation

https://element-plus.org/#/en-US/component/quickstart

任何人都设法做对并且有效吗？

标签： vuejs2vuejs3element-uielement-plus

解决方案

如果您使用的是 vue 3，则需要createApp从 'element-plus/...' 文件夹中导入 css。然后你app使用导入的 vue 函数实例化你的实例，基本上你将主应用程序组件作为参数传递给函数：

import { createApp } from 'vue'
import App from './YourMainApp.vue'

import ElementPlus from 'element-plus'
import 'element-plus/lib/theme-chalk/index.css'
    
let app = createApp(App)
app.use(ElementPlus)
    
app.mount('#app')

推荐阅读