1. 程式人生 > >運行vue

運行vue

官網下載 core 新建 速度 gpo 打了 bsp 運行命令 傻瓜式

1、先從http://nodejs.cn/download/ 下載nodejs最新版本, 官網下載速度比較慢,所以建議大家使用國內站,國內的網址就是nodejs.cn

技術分享圖片

2、安裝下載的文件,一路下一步傻瓜式安裝即可;

3、安裝完成之後,打開命令行工具,輸入 node -v,如下圖,如果出現相應的版本號,則說明安裝成功。

技術分享圖片

npm包管理器,是集成在node中的,所以,直接輸入 npm -v就會如下圖所示,顯示出npm的版本信息。

技術分享圖片

OK!node環境已經安裝完成,npm包管理器也有了。由於有些npm有些資源被屏蔽或者是國外資源的原因,經常會導致用npm安裝依賴包的時候失敗,所有我還需要npm的國內鏡像---cnpm。

4、安裝cnpm

在命令行中輸入 npm install -g cnpm --registry=http://registry.npm.taobao.org 然後等待,以下是正在安裝的圖片

技術分享圖片

安裝完成如下圖。

技術分享圖片

完成之後,我們就可以用cnpm代替npm來安裝依賴包了。

5、安裝vue-cli腳手架構建工具
在命令行中運行命令 cnpm install -g vue-cli ,然後等待安裝完成。(註意,這裏使用cnpm來替代npm,不然速度超級慢,會導致卡在那)
通過以上三部,我們需要準備的環境和工具都準備好了,接下來就開始使用vue-cli來構建項目。

技術分享圖片


6、用vue-cli構建項目
要創建項目,首先我們要選定目錄,然後再命令行中把目錄轉到選定的目錄。在這裏,我選擇桌面來存放新建的項目,則我們需要先把目錄cd到桌面,如下圖。

在這裏我在 “L:\Core\vue” 目錄下創建了一個firtsVud的項目,中間打了幾次Yes,如下圖

技術分享圖片

7、運行剛剛建好的項目 命令是 npm run dev

技術分享圖片

技術分享圖片

最後提示 運行中的應用瀏覽地址,在瀏覽器輸入http://localhost:8080

技術分享圖片

我是菜鳥,希望老司機提出意見,對初學者有所幫助!!!

運行vue