本文共 1009 字，大约阅读时间需要 3 分钟。

一、概述

Element-UI:一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库。 官网地址为:

二、基于命令行方式手动安

在vue-cli@3之后，element为vue-cli准备了相应的element插件，我们可以用这个插件快速的来安装element-ui。

1、在工程目录下创建一个vue项目

我们首先需要新建一个Vue工程，参考我我之前的文章：

vue create 项目名称

2、添加element-UI

只需要cd到工程根目录，运行vue add element即可：

vue add element

3、下载插件，为了方便，选择全部导入：

4、SCSS暂时选择不添加：

5、继续选择，最后回车：

6、安装完成

7、测试element是否安装成功

npm run serve

8、项目中使用element-UI

在 main.js 中写入以下内容：

import Vue from 'vue'import App from './App.vue'import router from './router'import './plugins/element.js'// 使用element-UIimport ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.use(ElementUI);Vue.config.productionTip = falsenew Vue({     router,  render: h => h(App)}).$mount('#app')

在App.vue页面中添加需要的样式：

9、添加axios依赖

vue add axios

添加成功如下：

参考：

三、基于UI界面添加插件

1、添加element插件

在创建好的项目中，添加插件：

2、添加axios依赖