首頁 > web前端 > js教程 > 主體

逐步設定 React 和 Vite

Patricia Arquette
發布: 2024-10-09 14:33:02
原創
853 人瀏覽過

Vite 是一款現代構建工具,旨在提供快速高效的開發體驗,特別是基於 JavaScript 的應用程序,例如 React、Vue 等。

Vite本身更注重開發速度,在開發過程中以最少的配置和更快的載入時間。由於匯總的最佳化,生產建造時間通常也更快

在本教學中,您將逐步學習如何使用 Vite 安裝 Reactjs

第 1 步
打開你已有的終端應用程序,這裡我使用cmder,然後轉到你要安裝應用程式的資料夾

Setup React With Vite Step-by-Step

第 2 步
要執行安裝過程,您可以使用“yarn”或“npm”,
在終端機中輸入以下命令,

##NPM
npm create vite@latest

##YARN
yarn create vite
登入後複製

我用紗線。

執行上面的指令後,會要求你輸入要建立的應用程式的名稱,如下圖

Setup React With Vite Step-by-Step

第三步
您將看到一個清單;使用方向鍵在清單中上下移動,點擊 Enter 選擇您喜歡的選項。
在這一步驟中,我們將選擇React

Setup React With Vite Step-by-Step

第三步
您將看到五個選項可供選擇,導航至並選擇
這裡我會選Typescript SWC

Setup React With Vite Step-by-Step

僅此而已;您現在已經擁有了您的 Vite 項目
Setup React With Vite Step-by-Step

步驟 4
依照步驟3最終結果的指示,會要求你進入你所建立的應用程式資料夾,然後依照指示執行指令

### masuk ke folder aplikasi anda
cd react-vite

### install dependencies
yarn install
登入後複製

Setup React With Vite Step-by-Step

第 5 步
步驟 4 中的所有流程都成功後,要執行應用程序,您需要執行以下命令

### npm 
npm run dev

### yarn
yarn dev
登入後複製

Setup React With Vite Step-by-Step

應用程式成功運行後,您可以根據終端顯示的連結存取應用程式

Setup React With Vite Step-by-Step


結論
你看,一點也不難,整個過程不需要很久就能完成。

現在您已經成功學會了使用Vitejs安裝ReactJS應用程式

謝謝

以上是逐步設定 React 和 Vite的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!