我要跑vue項目,所以我要搞vue漆弄。
1睦裳、環(huán)境搭建
進入node官網(wǎng)下載對應(yīng)版本的node,一步步安裝即可撼唾。
image-20210629150150436.png
安裝會自動配置路徑和npm包管理環(huán)境廉邑,通過node -v
進行驗證
image-20210629151411651.png
設(shè)置npm的鏡像源,使用國內(nèi)的加快速度
# 設(shè)置
npm config set registry https://registry.npm.taobao.org
# 驗證
npm config get registry
2倒谷、安裝vue-cli腳手架
Vue CLI文檔:https://cli.vuejs.org/zh/guide/
# 卸載舊版本
npm uninstall vue-cli -g
# 指定地址安裝蛛蒙,加快速度
npm install -g @vue/cli --registry=https://registry.npm.taobao.org
image-20210629153701958.png
安裝完成后,進行驗證
vue
vue --version
image-20210629153815991.png
完成上面的步驟后渤愁,我們就可以使用vue-cli新建項目牵祟。
3、使用vue-cli新建項目
3.1 圖形化界面創(chuàng)建項目
使用vue ui
命令抖格,會打開一個網(wǎng)頁
C:\Users\lxp>vue ui
?? Starting GUI...
?? Ready on http://localhost:8000
image-20210629154122991.png
按提示走應(yīng)該就可以了诺苹,下面試試命令行創(chuàng)建。
3.2 命令行創(chuàng)建項目
運行以下命令來創(chuàng)建一個新項目:
vue create 項目名
首先進入某個特定文件夾雹拄,輸入創(chuàng)建命令收奔,注意項目名不能包含大寫字母
image-20210629154756766.png
命令輸入正確的情況下, 會讓你選擇創(chuàng)建vue-2還是vue-3的項目滓玖,根據(jù)需要選擇坪哄,然后等待項目創(chuàng)建成功
image-20210629155034152.png
生成的項目結(jié)構(gòu)如下
image-20210629155155509.png
根據(jù)它的提示啟動項目
cd vue-test
# 等同于npm run dev
npm run serve
image-20210629155424743.png
訪問即可
image-20210629155444224.png