創建vue項目的幾種方式

目錄

• 使用 vue-cli 腳手架
  • vue init webpack
  • 項目目錄
• 使用Vue Cli3
  • vue create
    • 項目目錄
  • vue ui

使用 vue-cli 腳手架

前提：已安裝node可以正常使用npm命令，並全局安裝vue-cli工具。

• 全局安裝 vue-cli 腳手架

npm install vue-cli -g

vue init webpack

• 創建基於 webpack 的項目

vue init webpack project-name

項目創建過程中會提示是否安裝vue-router，eslint等，可以選擇安裝，也可以選擇不安裝。

• 項目創建完成后，安裝基礎模塊

cd project-name
npm install

• 安裝結束，在開發模式下運行項目

npm run dev (http://localhost:8080)

項目目錄

詳解：https://www.cnblogs.com/chenleideblog/p/10432375.html

• 安裝輔助工具

npm install vue-router --save （路由管理模塊）
npm install vuex --save （狀態管理模塊）
npm install vue-resource --save （網路請求模塊）

--save 與 --save-dev 的區別：https://www.cnblogs.com/xwwblog/p/13654450.html

使用Vue Cli3

前提： Node.js 8.9 或更高版本

vue create

vue create project-name

有一些選項需要選擇，可以直接選擇默認選項、npm

創建結束后運行項目

cd project-name
npm run serve  //（ http://localhost:8080/）

項目目錄

vue ui

使用vue cli3的ui命令基於圖形用戶界面創建vue.js項目

在命令行窗口中輸入命令vue ui 即可打開圖形化界面, 創建項目、安裝插件、依賴、打包都可以實現，很方便。
具體實現創建步驟可參考：https://blog.csdn.net/wmiaopas/article/details/104541944