環(huán)境要求

創(chuàng)新互聯(lián)主營貢嘎網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,重慶APP開發(fā)公司,貢嘎h5微信小程序定制開發(fā)搭建,貢嘎網(wǎng)站營銷推廣歡迎貢嘎等地區(qū)企業(yè)咨詢

Nodejs

Nodejs

官網(wǎng)下載地址：http://nodejs.cn/download/具體安裝參考其他資料

打開cmd命令行，輸入npm -v，如果出現(xiàn)如下圖的顯示，說明已經(jīng)安裝正確。

如果安裝版本比較老，想升級新版本

npm install npm -g

安裝 webpack

安裝webpack

npm install webpack -g

-g 表示安裝為全局

安裝 vue-cli

安裝 vue 腳手架項目初始化工具 vue-cli

npm install vue-cli -g

淘寶鏡像

npm使用的國外中央倉庫，下載速度較慢，有的時候還會有部分文件被墻掉。

npm install -g cnpm --registry=https://registry.npm.taobao.org

建議使用淘寶鏡像，安裝完淘寶鏡像以后可以使用 cnpm 代替 npm。例如webpack可使用如下命令：

cnpm install webpack -g .

創(chuàng)建Vue項目

vue init webpack +項目名稱

運行vue

npm run dev

訪問localhost:8080

引入ElementUI

打開項目 src\main.js 添加

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

package.json文件中添加

"element-ui": "^2.4.9"

重新npm install

測試是否安裝完成

在App.vue中隨意添加elementUI標(biāo)簽 如：

<el-input v-model="input" placeholder="請輸入內(nèi)容"></el-input>
data() {
return {
input: ''
}
}

保存后，打開網(wǎng)頁顯示出input即成功

總結(jié)

以上所述是小編給大家介紹的Vue項目引進(jìn)ElementUI組件的方法，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的！

新聞名稱：Vue項目引進(jìn)ElementUI組件的方法
網(wǎng)頁鏈接：http://www.chinadenli.net/article24/jdhgje.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站制作、網(wǎng)站改版、品牌網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作、網(wǎng)站策劃、建站公司

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)