1. 程式人生 > 其它 >Vue基礎-建立vue專案

Vue基礎-建立vue專案

1. 建立前配置

  由於Node下載第三方的依賴包是從國外伺服器下載的,下載速度很慢而且容易出現異常

  為了提高效率,我們可以把npm的映象源替換為淘寶映象源!切換後可使用cnpm進行依賴安裝

2. 修改淘寶源

  Win + R開啟windows系統的執行視窗,輸入cmd開啟命令列,然後選擇輸入以下指令

// 單次修改為淘寶源
npm install --registry=https://registry.npm.taobao.org

// 永久修改為淘寶源
npm config set registry https://registry.npm.taobao.org

// 切換回npm倉庫源
npm config set registry https://registry.npmjs.org/

3. 驗證是否切換成功

// 檢視源指令
npm config get registry

  

  

4. 安裝Vue腳手架

  這裡我們安裝vue cli3

// 解除安裝vue-cli3
npm uninstall vue-cli -g

// 安裝vue-cli3
npm install @vue/cli -g

  

   

    

5. 建立準備

  在你要建立專案的資料夾中上方位置輸入cmd,開啟命令列,或者直接cd到你要建立專案的那個資料夾

  

  

6. Vue ui 建立專案

  

   進入目標資料夾後,輸入Vue ui會自動通過瀏覽器開啟Vue專案管理器,可手動選擇專案的基礎配置和外掛

  

  切換至"建立"tab頁,然後點選建立專案

  

  建立專案後會進入"詳情頁"你可以給新專案命名,更改專案地址等

  

  下一步會進入專案"預設"頁面

  

  然後進入"功能"頁面可以手動選擇你所需要的專案功能

  

  

  最後進入"配置"頁面選擇基礎的專案配置,然後點選建立

  

  然後會詢問你要不要將你現在的配置,存為預設供下次選擇,這個就看你個人選擇了

  

  

  稍等片刻後,顯示下方頁面就證明專案建立成功了

  

7. Vue create 建立專案 

 

// 建立專案指令
vue create 要建立專案的名字

    

  第一步選擇專案的配置模板,建議手動配置靈活一點,上下鍵切換,Enter鍵確認

  

  第二步選擇專案建立完自帶的基礎功能,上下鍵切換,空格鍵選擇選中或者取消選中,Enter鍵確認

  

  選擇版本,上下鍵切換,Enter鍵確認

  

  選擇路由模式,Y選擇history模式,N選擇預設hash模式,Enter鍵確認

  

  選擇語法檢測工具,上下鍵切換,Enter鍵確認

  

  

  選擇語法檢查方式,上下鍵切換,空格鍵選擇選中或者取消選中,Enter鍵確認

  

  選擇配置檔案存放方式,上下鍵切換,Enter鍵確認

  

  決定是否存為預設方案,Y存為預設並起名,N放棄存為預設,Enter鍵確認

  

  

  如果預設方案選擇N,則會立即開始建立專案,出現Successfully created project 專案名稱.則表示建立成功