Vite ابزاری سریع و مدرن برای راهاندازی پروژههای React است. با تنظیمات پیشفرض و قابلیت توسعهپذیری بالا، Vite به توسعهدهندگان اجازه میدهد بدون درگیر شدن با ابزارهای پیچیده، روی یادگیری React تمرکز کنند.
برای شروع، ترمینال را باز کرده و به پوشهٔ موردنظر بروید. سپس دستور زیر را وارد کنید:
npm create vite@latest hacker-stories -- --template reactمیتوانید نام پروژه را تغییر دهید. اگر به TypeScript مسلط هستید، میتوانید از قالب react-ts استفاده کنید.
cd hacker-stories
npm install
npm run devپس از اجرای npm run dev، آدرس محلی پروژه در مرورگر نمایش داده میشود. آن را باز کرده و صحت اجرای پروژه را بررسی کنید.
اگر میخواهید از آخرین نسخهٔ React استفاده کنید:
npm install react@latest react-dom@latestدر پروژههای TypeScript نیز باید نوعهای مربوطه را بهروزرسانی کنید:
npm install --save-dev @types/react@latest @types/react-dom@latestپس از باز کردن پروژه در VSCode (با دستور code .)، ساختار زیر را مشاهده خواهید کرد:
hacker-stories/
├── node_modules/
├── public/
│ └── vite.svg
├── src/
│ ├── assets/
│ │ └── react.svg
│ ├── App.css
│ ├── App.jsx
│ ├── index.css
│ └── main.jsx
├── .gitignore
├── eslint.config.js
├── index.html
├── package-lock.json
├── package.json
├── README.md
└── vite.config.jsVite راهی سریع و ساده برای شروع پروژههای React است. با ساختار منظم، تنظیمات پیشفرض، و قابلیت ارتقاء آسان، این ابزار به توسعهدهندگان کمک میکند تا بدون دغدغهٔ ابزارهای پیچیده، روی یادگیری و توسعهٔ React تمرکز کنند.