vue 腳手架搭建步驟!


==========================================================

說出來都是淚,最開始都不知道從哪里開始(回頭一看還是很簡單的,關鍵是要找到入口) 

特意總結出來,讓有需要學習這塊的朋友少走很多的彎路!

==========================================================

1:安裝node.js會自動帶上 npm的環境,下載nodejs相關的軟件包傻瓜式的安裝

這個步驟的自己去下載 安裝 node官網: https://nodejs.org/en/download/


2:安裝淘寶的鏡像
npm install -g cnpm --registry=https://registry.npm.taobao.org


3:安裝 vue-cli腳手架(-g:為全局安裝, -s 為 例如后續的文件是否依賴vue,這里vue-cli是單獨的插件我們全局安裝即可)
cnpm install vue-cli -g

 

4: vue init webpackage myvuwdemo 初始化一個項目的文件,里面有多個步驟詢問你,我們直接回車即可,然而

到這一步 多數情況下會報錯404 , 估計由於國外的服務器的原因或者說是網絡的問題
vue-cli 安裝失敗Failed to download repo vuejs-templates/webapck-simple: Response code 404 (Not Found)

 

5:比較好的解決方法有:

  先去官網下載一個 vue-cli的模板:https://github.com/vuejs-templates

  再將解壓出的文件夾放在如下路徑 C:\Users\Administrator\.vue-templates (Administrator:為你自己的取得電腦名稱賬號默認為這個)

 

6:vue init webpackage mydemo01 --offline 中間就會自動安裝,幾個詢問直接回車即可

 

7:cd 到剛剛創建的目錄下面,cd mydemo01

 

8: npm run dev 就會看到有 You application is running here: http:localhost:8080,在瀏覽器打開可以看到vue的logo就證明安裝工作已經ok

 

 9: ctrl +c 停止當前的網址

 

10:在這個項目的路徑下面直接 npm run dev 就又可以看到熟悉的東東:You application is running here: http:localhost:8080

 

11:最近創建腳手架又有些問題了,可能是清理垃圾的時候誤刪除了些文件,導致腳手架創建不了 !終結方案如下:

   第一步:**https://github.com/vuejs-templates/webpack 下載webpack文件;

   第二步:到C盤找到.vue-templates文件,找不到?在命令工具C:\Users\Administrator>md .vue-templates;

   第三步:**打開剛剛新建的.vue-templates文件,把第一步下載的webpack文件解壓(注意解壓以后的文件名是webpack-develop,把-develop刪掉,文件名只能叫webpack)放到.vue-templates文件里邊

   第四步:定位到一個新建的空文件夾里面,我們通常是打開cmd, 然后cd..到自己想要的目錄下,感覺比較費事,直接如下方案:

   第五步:vue init webpack mydemo01  --offline 回車回車,終於不在報錯了(這里mydemo01  是項目名,--offline必要的)

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM