Vue筆記第四天 搭建腳手架

2021-09-26 02:34:20 字數 1382 閱讀 2314

1.搭建腳手架-cli

a.建議使用npm 命令:npm install -g @vue/cli(這是乙個全域性命令只用安裝一次就可以了)

b.命令檢視是否成功vue --version

c.類似於這樣的一堆err!安裝失敗了

解決方案:

更換安裝的工具:

a. **映象:

$ npm install -g cnpm --registry=

npm命令:cnpm install -g @vue/cli

npm命令:yarn global add @vue/cli清除npm快取之後,重新安裝

npm cache clean -f重新執行安裝的命令

d.建立專案vue create 專案名

e.彈出的對話方塊先選擇預設的選項

f.稍等一會,等進度條走完 提示如下畫面說明成功了

g. 進入專案資料夾

cd 專案名直接根據提示即可

h. 執行專案

npm run serve

i. 稍等片刻 ,出現如下效果說明成功了

2.vue-cli的專案結構

3.vue-cli src**結構

assets靜態資源資料夾

4.全域性元件的註冊

5區域性元件的註冊

6元件的name屬性

直接在元件的內部寫name:值即可

不能用中文

寫了之後,chrome的vue外掛程式中可以看到這個名字,更加利於檢索,利於編碼

搭建Vue腳手架

從vue官網安利了一波安裝腳手架的主要 全域性安裝 vue cli npm install global vue cli 建立乙個基於 webpack 模板的新專案 vue init webpack my project 安裝依賴,走你 cd my project npm install npm r...

Vue腳手架搭建

sudo apt get install nodejs legacy nodejs sudo apt get install npm 安裝成功後檢視對應版本 npm install vuenpm install g cnpm registry vue安裝成功後檢視對應版本 npm install g...

vue腳手架搭建

一 vue cli腳手架的搭建步驟 首先,確定你的電腦上已經安裝了nodejs,可以使用npm包管理器安裝環境 1 開啟cmd命令視窗,切換到你要新建專案的資料夾下,此時可使用node v檢查node的版本,如果出現版本號則node已安裝。2 使用以下命令全域性安裝vue cli npm insta...