1. 前言
在之前的文章中已經搭建了vue開發(fā)環(huán)境，并創(chuàng)建好了vue項目，接下來開始創(chuàng)建第一個vue+element項目
之前的文章請移步：1. 使用vscode運行Vue項目 2. 在vscode中創(chuàng)建vue項目
Element-Ui與Vue關系：
Element-Ui是基于Vue封裝的組件庫，主要作用是簡化了常用組件的封裝。
簡單來說Vue是一個前端JavaScript框架，Element-Ui是前端UI框架。
2.過程
基于前言中的準備工作，我們已經能在瀏覽器訪問創(chuàng)建的Vue項目了，效果如下所示，接下來我們需要安裝element-ui框架
2.1 安裝element-ui框架
因為項目正在運行，需先CTRL+C 并輸入Y把項目先停止（如下所示），之后才能進行安裝element-ui框架.
第一步：在終端輸入命令: npm install element-ui -S,安裝完成后效果如下
第二步：查看配置文件package.json，看是否有element-ui組件的版本號
2.2 在項目中使用element-ui
第一步：在main.js中引入element組件文章來源：http://www.zghlxwxcb.cn/news/detail-403098.html
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
第二步：修改組件HelloWorld.vue代碼（可以參考element ui官網）
然后運行命令npm run dev 效果如下：
文章來源地址http://www.zghlxwxcb.cn/news/detail-403098.html
到了這里，關于【vue】創(chuàng)建第一個vue+element ui項目的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網！
