vue-cli、vite2都可以進行快速搭建基于Vue.js 開發(fā)的項目掏膏。
1劳翰、vue-cli（1.x 或 2.x-舊版本）
安裝環(huán)境：Node.js (>=6.x, 8.x preferred), npm version 3+ and Git
- 安裝
npm install vue-cli -g - 查看版本號
vue -V - 卸載
npm uninstall vue-cli -g - 創(chuàng)建vue項目
vue init <template-name> <project-name>
兩種常用的模板類型：webpack-simplewebpack
如：vue init webpack my-project - 安裝依賴包
npm install - 啟動
npm run dev或npm start - 打包
npm run build
2、@vue/cli（3.x或4.x-新版本-推薦）
安裝環(huán)境：Node.js 8.9 或更高版本 (推薦 8.11.0+)
- 安裝
npm install @vue/cli -g - 查看版本號
vue -V - 卸載
npm uninstall @vue/cli -g - 使用 vue serve 和 vue build 命令對單個 *.vue 文件進行快速原型開發(fā)
npm install @vue/cli-service-global -g - 創(chuàng)建vue項目
-
vue ui通過圖形化頁面創(chuàng)建 -
vue create <peoject-name>通過命令行創(chuàng)建 參考
-
- 啟動
npm run serve - 打包
npm run build
2.1 創(chuàng)建vue2項目
image.png
2.1 創(chuàng)建vue3項目
image.png
3馒疹、vite2
vue-cli是基于webpack來構(gòu)建的佳簸，vite2基于 原生 ES 模塊 提供了 豐富的內(nèi)建功能。創(chuàng)建vue3項目步驟如下所示：
image.png
添加eslint
npm install -D eslint颖变，初始化eslint如下圖所示：
image.png
使用vuex生均、vue-router
npm install -S vuex@next vue-router@next
