Migrating from CRA to Vite

[lakshz]

We should consider migrating from CRA to Vite for the following reasons:

1. Faster build time. Hence, a better development experience
2. Optimized production builds
3. More compliant with modern/best practices

The only hurdle can be compatibility. We'll have to make sure all the existing dependencies work well with Vite.

If this sounds like a nice idea, I would be happy to work on migrating the codebase.

[pranshugupta54]

If we make some minor changes, it takes 5-10s to reload the page for CRA.
With vite, it does in 1-2s (Using in other projects)

[palisadoes]

1. Does vite have an active community and is it backed in some way by a corporation? We need long term support
2. Will this solution reduce the number of packages we'll have to maintain current in package.json

[lakshz]

1. Yes, it does have an active community and is actively maintained on github unlike CRA. It was created by the founder of Vue.js.
   Many modern projects/companies have switched to Vite for its features. The number of weekly downloads of Vite is 10,463,023 at the time of writing. For CRA, this number is 115,706
   Replit uses Vite for its react starter templates not CRA.
   TailwindCSS highly recommends VIte instead of CRA.

2. I think no, the dependencies won't change much. Since vite does the same thing as react-scripts package, but in a faster and optimized way. Vite does has lesser built-in dependencies than CRA.
   Most of the packages should be compatible with Vite but some specific packages/scenarios, might require additional configuration to work with Vite.

[lakshz]

@palisadoes I hope I could answer your considerations

[palisadoes]

OK. What would the next steps be?

[varshith257]

@palisadoes Here's the step by step migration process:

I think it's can be done easily by following steps given in this blog.

https://dev.to/henriquejensen/migrating-from-create-react-app-to-vite-a-quick-and-easy-guide-5e72

[palisadoes]

1. Open an issue and ask to be assigned. Make sure that any script configuration files are placed in a sub-directory of scripts/
2. We've had lots of configuration files in the root directory which has added a lot of clutter in the past