vite如何構(gòu)建vue3項目
更新時間：2024年10月11日 10:59:01 作者：harmsworth2016
本文介紹了如何使用Vite快速搭建Vue項目,強(qiáng)調(diào)Vite對Node.js版本有最低要求（>=12.0.0）,提供了環(huán)境準(zhǔn)備、安裝步驟和啟動指南,旨在幫助開發(fā)者高效啟動Vue項目
環(huán)境準(zhǔn)備
- 安裝最新版本
@vuejs/app
yarn global add @vue/cli # OR npm install -g @vue/cli
- 升級到最新版本
@vitejs/app
yarn global upgrade @vue/cli # OR npm update -g @vue/cli
- 查看
vue版本
vue -V
兼容性注意
Vite 需要 Node.js 版本 >= 12.0.0。
故切換 node 版本，可查看該文章：使用 nvs 管理本地 Node 版本。
創(chuàng)建項目
yarn create @vitejs/app <project-name> # OR npm init @vitejs/app <project-name>
選擇一個框架
選擇一種 ECMAScript 的實(shí)現(xiàn)
創(chuàng)建完成
啟動
npm install npm run dev # OR yarn yarn dev
目錄結(jié)構(gòu)
總結(jié)
vite依賴node 12版本及以上- 使用
vite構(gòu)建vue項目更加簡潔，啟動速度飛快
以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家介紹了vue之mixin的使用，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-11-11
這篇文章主要介紹了vue移動端項目渲染pdf步驟,vue-pdf的插件在使用的過程中是連連踩坑的，基本遇到3個問題，分別在文中給大家詳細(xì)介紹，需要的朋友可以參考下2022-08-08
vue實(shí)現(xiàn)圖片轉(zhuǎn)pdf的示例代碼
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)圖片轉(zhuǎn)pdf的相關(guān)知識，文中的示例代碼講解詳細(xì)，具有一定的借鑒價值，需要的小伙伴可以跟隨小編一起了解一下2023-08-08
這篇文章主要為大家詳細(xì)介紹了vue搭建多頁面多系統(tǒng)應(yīng)用的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-06-06
vue3+vue-cli4中使用svg的方式詳解(親測可用)
最近在做個vue的項目,從各種github上的開源庫上借鑒開發(fā)方法,給大家分享下,這篇文章主要給大家介紹了關(guān)于vue3+vue-cli4中使用svg的相關(guān)資料,需要的朋友可以參考下2022-08-08
src/main.js是入口文件,主要作用是初始化vue實(shí)例并使用需要的插件, Vue.use()的作用就是讓它里面被注冊的組件能夠被全局使用,本文通過實(shí)例代碼介紹vue項目中main.js的用法,感興趣的朋友一起看看吧2023-10-10
這篇文章主要為大家詳細(xì)介紹了Vue如何使用EasyPlayerPro實(shí)現(xiàn)播放本地MP4視頻功能,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-11-11
vue3自定義指令自動獲取節(jié)點(diǎn)的width和height代碼示例
這篇文章主要介紹了如何使用ResizeObserver監(jiān)聽組件的寬度和高度,并將其封裝成一個指令以便全局或局部使用,ResizeObserver可以監(jiān)聽元素的多個尺寸屬性,如top、bottom、left等,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-11-11
這篇文章主要介紹了vue中屬性執(zhí)行順序,選項的執(zhí)行順序是 props -> data -> computed -> watch -> created -> mounted -> methods，具體詳細(xì)內(nèi)容本文給大家講解的非常詳細(xì)，需要的朋友可以參考下2023-09-09
這篇文章主要給大家介紹了關(guān)于Vue頁面渲染中key的應(yīng)用的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01