Setup Vue3 with Element UI

Element UI is my favorite Vue UI library. A popular top-class component library with more than 50K Github stars. And they already have a version that works with Vue3 — Element Plus.

I’d like to share how to set up a Vue3 project with Element Plus using Vue CLI.

Install the latest version of Vue CLI

npm install -g @vue/cli

Create a project with Vue CLI

vue create my-app
// And then select Vue 3 option.

Install Element Plus

You can add Element Plus to your project simply via its Vue CLI plugin.

cd my-app
vue add element-plus
npm run serve

Now you can use Element Plus components in your project like the following.

<template>
  <el-button type="primary"> Element UI </el-button>
</template>

Check out this repository with this configuration done:

https://github.com/element-plus/element-plus-starter

That’s it!