background

As you all know, Ele. me has opened source two sets of Vue UI components, Mint UI mobile and Element UI PC. I used the latest VERSION of Vue3.0, which was introduced according to Element’s documentation. The result was a blank page, and F12 opened the developer tools with a flash of red. Vue3.0 does not support Element UI, but Element Plus. After a meal of operation, the page came out, the mood instantly good. See the detailed process below.

Introducing the Element UI

The introduction of the command

  • For details about command import, see element.eleme.cn/#/zh-CN/com…
  • npm i element-ui -S
  • Introduced in the main. Js
import Element from "element-ui";
import "element-ui/lib/theme-chalk/index.css";

Vue.use(Element)
Copy the code

Cannot read property ‘prototype’ of undefined

The introduction of Element Plus

The introduction of the command

  • IO /#/ zh-cn /com…
  • npm install element-plus –save
  • Introduced in the main. Js
import { createApp } from "vue";
import Element from "element-plus";
import "element-plus/lib/theme-chalk/index.css";

createApp(App)
  .use(Element)
  .mount("#app");
Copy the code
  • Start the project again and it will display normally.

conclusion

  • I think the official website of Vue should make an explanation in a prominent position, so that the probability of learning partners will be reduced, here is a small criticism.
  • The Element team should do a downward compatibility. It also reduces the chances of potholes. Maybe it’s a big compatibility change.
  • This big jump, completely different in the industry is also a common phenomenon, get used to it.
  • Hope to help the pit jumping buddy.
  • If it helps you, you can follow it, like it, like it, comment it.