Migrate react-scripts to vite

[derneuere]

Describe the enhancement you'd like
Right now, the dev experience isn't great, because HMR is very slow. We can improve the experience by switching to vite instead.

[polaroidkidd]

do you have the FAST_REFRESH flag in the .env.development file set to true?
I'm working on a pretty strong machine, so I maybe that's why I don't really notice slow HMR. Could it maybe have something to do with the linting during the dev process?

[sickelap]

I am using .env.development as follows and I don't have any issues with HMR. Reload works "blazingly fast"^tm

TSC_COMPILE_ON_ERROR=true
BROWSER=none
FAST_REFRESH=true
ESLINT_NO_DEV_ERRORS=true
HTTPS=false
REACT_EDITOR=vim
DISABLE_ESLINT_PLUGIN=true
DISABLE_NEW_JSX_TRANSFORM=false
# custom env vars
REACT_APP_PROXY_IP="localhost"
REACT_APP_PROXY_PORT="3000"
REACT_APP_WDYR=false

[polaroidkidd]

@derneuere seems to think the dev experience isn't that great and there is an issue in the create-react-app repo, which matches this description. I've created a mr to disable es-lint during dev mode as that is one of the suggested fixes in the create-react-app repository.

@derneuere , does this improve performance for you or does it remain the same? Is the variable DISABLE_ESLINT_PLUGIN=true set in your .env file?

[derneuere]

I tried both changes. It looks like it now only need 2s instead of 8-10s on the first compile, but any following compile seems to be just as fast with or without linting.

From my understanding, everything is way faster in vite. This would also cut down on build times, start up times etc.