بهروز شفاعتی
بهروز شفاعتی
خواندن ۲ دقیقه·۲ سال پیش

یک جایگزین بهتر برای Create React App

اگه شما برنامه نویس ری اکت هستید حداقل یک بار از create-react-app استفاده کردید و دستوری مثل زیر رو در کنسول اجرا کردید:

npx create-react-app my-app

و بعد از اجرای اون خروجی زیر در کنسولتون ظاهر شده:

Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cra-template... added 1394 packages in 44s 209 packages are looking for funding run `npm fund` for details Initialized a git repository. Installing template dependencies using npm... added 55 packages in 4s 209 packages are looking for funding run `npm fund` for details Removing template package using npm... removed 1 package, and audited 1449 packages in 3s 209 packages are looking for funding run `npm fund` for details 6 high severity vulnerabilities

اوکی، شما الان تقریبا 1,500 پکیج با کلی آسیب پذیری دارید.

می‌خوایین یه چیز ترسناک ببینید؟! اندازه پوشه‌ی node_modules رو یه چک بکنیم:

du -hc -s node_modules # 318M node_modules

اگه بخاییم یه مصداق واقعی برای این حجم از داده در دنیای برنامه نویسی بیاریم میشه عکس زیر:

متعجبم از اینکه چرا این روش پیشنهاد شدس، ولی خوشبختانه تنها راه نیست.

All-in-one: Vite

بسته Vite یک جایگزین بهتر برای ایجاد اولیه و از پیش تنظیم شده چند فریمورک از جمله React است که می‌توان با یا بدون TypeScript از آن استفاده کرد.

برای ساختن یک اپ با Vite دستور زیر رو باید اجرا کنیم:

npm create vite@latest my-vite-react-app # ✔ Select a framework: › react # ✔ Select a variant: › react # # or # npm create vite@latest my-vite-react-app -- --template react

بعد به مسیر روت پروژه میریم و پکیچ‌های مورد نیاز رو نصب می‌کنیم:

cd my-vite-react-app && npm install

و نهایتا در زمانی کمتر پروژه‌ای داریم با پکیج‌های خیلی کمترتر:

added 87 packages, and audited 88 packages in 5s 8 packages are looking for funding run `npm fund` for details found 0 vulnerabilities

و تقریبا اندازه‌ی node_modules هم 10 برابر کمتر شده:

du -hc -s node_modules # 37M node_modules

اگه برای Create-React-app به دنبال یک جایگزین هستید که تمام قابلیت‌های اون رو هم داشته باشه ویت همونیه که لازم دارید.

react appcreate react appreactjscreate react
شاید از این پست‌ها خوشتان بیاید