1. 程式人生 > >如何匯入GitHub下的vue專案 並啟動

如何匯入GitHub下的vue專案 並啟動

如何執行  下載的GitHub專案

 

一 準備工作:

Node.js環境(npm包管理器)

vue-cli 腳手架構建工具

cnpm npm的淘寶映象

 

二 安裝node.js 略

cmd 輸入node -v 有版本號 則安裝成功

 

三 npm包管理器 直接整合在node上的

cmd 輸入 npm -v 有版本號 則安裝成功

 

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

 

四 安裝cnpm

在cmd 中輸入 npm install -g cnpm --registry=http://registry.npm.taobao.org 然後等待,安裝完成

 

五 安裝vue-cli腳手架構建工具

在cmd中執行命令 cnpm install -g vue-cli ,然後等待安裝完成。(注意,這裡使用cnpm來替代npm,不然速度超級慢,會導致卡在那)

 

六 安裝專案所需依賴 進入專案所在目錄 D:\workspace\vue 然後執行命令 cnpm install ,等待安裝。

 

安裝完成之後,會在我們的專案目錄資料夾中多出一個node_modules資料夾,這裡邊就是我們專案需要的依賴包資源。

 

七 執行專案

執行命令 npm run dev ,會用熱載入的方式執行我們的應用,熱載入可以讓我們在修改完程式碼後不用手動重新整理瀏覽器就能實時看到修改後的效果。

 

這裡簡單介紹下 npm run dev 命令,其中的“run”對應的是package.json檔案中,scripts欄位中的dev,也就是 node build/dev-server.js命令的一個快捷方式。

專案執行成功後,瀏覽器會自動開啟localhost:8080(如果瀏覽器沒有自動開啟,可以手動輸入)。執行成功後,會看到如下所示的介面。

 

我的專案 路徑是http://localhost:3000/app