Vue3.0腳手架搭建


 介紹:

notice: 這份文檔是對應 @vue/cli 3.x 版本的。老版本的 vue-cli 文檔請移步這里

Vue CLI 是一個基於 Vue.js 進行快速開發的完整系統,提供:
1.通過 @vue/cli 搭建交互式的項目腳手架。
2.通過 @vue/cli + @vue/cli-service-global 快速開始零配置原型開發。
3.一個運行時依賴 (@vue/cli-service),該依賴:
可升級;
基於 webpack 構建,並帶有合理的默認配置;
可以通過項目內的配置文件進行配置;
可以通過插件進行擴展。
4.一個豐富的官方插件集合,集成了前端生態中最好的工具。
5.一套完全圖形化的創建和管理 Vue.js 項目的用戶界面。
 

CLI (@vue/cli) 是一個全局安裝的 npm 包,提供了終端里的 vue 命令。它可以通過 vue create 快速創建一個新項目的腳手架,或者直接通過 vue serve 構建新想法的原型。你也可以通過 vue ui 通過一套圖形化界面管理你的所有項目 

CLI 服務 (@vue/cli-service) 是一個開發環境依賴。它是一個 npm 包,局部安裝在每個 @vue/cli 創建的項目中.構建於 webpack 和 webpack-dev-server 之上的。它包含了:
 
1.加載其它 CLI 插件的核心服務;
2.一個針對絕大部分應用優化過的內部的 webpack 配置;
3.項目內部的 vue-cli-service 命令,提供 serve、build 和 inspect 命令。

如果你熟悉 create-react-app 的話,@vue/cli-service 實際上大致等價於 react-scripts,盡管功能集合不一樣。

CLI 插件是向你的 Vue 項目提供可選功能的 npm 包,例如 Babel/TypeScript 轉譯、ESLint 集成、單元測試和 end-to-end 測試等。Vue CLI 插件的名字以 @vue/cli-plugin- (內建插件) 或 vue-cli-plugin- (社區插件) 開頭,非常容易使用。
 
當你在項目內部運行 vue-cli-service 命令時,它會自動解析並加載 package.json 中列出的所有 CLI 插件。
 
插件可以作為項目創建過程的一部分,或在后期加入到項目中。它們也可以被歸成一組可復用的 preset。

 

 安裝: 

關於舊版本
VUe CLI 的包名稱由 vue-cli 改成了 @vue/cli。 如果你已經全局安裝了舊版本的 vue-cli (1.x 或 2.x),你需要先通過 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸載它。

但是有時卸載不了,可以手動刪除之前版本文件

 

 

Node 版本要求
Vue CLI 需要 Node.js 8.9 或更高版本 (推薦 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台電腦中管理多個 Node 版本。

 

刪掉上面的三個文件后

執行:npm install -g @vue/cli 或者 yarn global add @vue/cli

 查看是否完成(版本號):vue --version

可以用:

vue create <項目名> 創建項目

進入自主選擇:Manually select features

sass

..

basic-app

安裝完后

快速原型開發:

1.你可以使用 vue serve 和 vue build 命令對單個 *.vue 文件進行快速原型開發,不過這需要先額外安裝一個全局的擴展:

npm install -g @vue/cli-service-global


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM