1.VUE的安裝和配置

說明:有關(guān)vue的所學(xué)習(xí)我是在macos系統(tǒng)下完成的,因此,相關(guān)的配置也是在macos下執(zhí)行,以后不再贅述。

1.配置VUE環(huán)境

安裝node.js

vue依托于node.js,因此要使用vue,首先需要在電腦上安裝node.js。安裝node.js比較簡單,直接官網(wǎng)下載相應(yīng)的版本,傻瓜式安裝。
下載地址:Download | Node.js

node下載界面.png

其中LTS是正是版本,Current是最新測(cè)試版本。初學(xué)者建議下載正式版本。
安裝成功后,打開“終端”,輸入node -v,出現(xiàn)版本號(hào)則說明安裝成功。

node -v

版本號(hào).png

說明安裝成功。

安裝vue

我是使用npm的方式安裝的vue,首先要確保設(shè)備上安裝了npm,一般安裝node后就自帶了npm,打開終端輸入:

npm -v

出現(xiàn)版本號(hào)說明已安裝npm。
安裝vue時(shí),首先確保設(shè)備上還沒有安裝vue,終端輸入:

vue -V

出現(xiàn)版本號(hào),說明已安裝,否則是沒有安裝。注意此處的-V,V是大寫。
安裝vue可以使用命令:

npm install vue-cli -g

注意此命令是安裝的是2.9.6版本的vue,最新版本的已經(jīng)更新到3.0以上,新添加了圖形界面,所以建議直接裝最新版,安裝最新版命令為:

npm install -g @vue/cli

如因系統(tǒng)權(quán)限原因無法安裝成功,添加sudo,sudo是獲取系統(tǒng)權(quán)限。

sudo npm install -g @vue/cli

注意,使用sudo會(huì)要求輸入設(shè)備密碼。
如果已經(jīng)安裝了舊版本,則新版本無法安裝成功,需要卸載舊版本,卸載命令為:

sudo npm uninstall vue-cli -g

創(chuàng)建和啟動(dòng)項(xiàng)目

cd到本地的文件夾(自己選擇),然后輸入命令:

vue create test-demo

注意項(xiàng)目名稱不能有大寫字母和漢字,然后使用上下鍵選擇默認(rèn)配置即可
創(chuàng)建完成后,cd到項(xiàng)目文件夾(本例中test-demo),輸入命令:

npm run dev 或者 npm run serve

出現(xiàn)如下界面表示啟動(dòng)成功。


啟動(dòng)成功.png

復(fù)制鏈接到瀏覽器,即可看到項(xiàng)目界面。


vue.png

vue常用命令

init 從模板生成新項(xiàng)目
list 列出可用的官方模板
build 創(chuàng)建新項(xiàng)目的原型
create 創(chuàng)建項(xiàng)目(僅適用于3.0以上的版本)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容