Who can share the experience of rewriting legacy code?

Question

JavaScript

There is a project with a lot of legacy code. The goal is to rewrite everything in Framework (Angular/Vue).
But it will take a lot of time, which is not.
The project is assembled (glued together) by grunt. Everything is connected in separate files. The code is written using jquery.
It was decided to modernize the code, make it modular for fast and convenient development.
Now it is almost rewritten on Webpack to replace the grunt collector because of this, a lot of crutches and dances with a tambourine, so that everything would work as before. Now the question is what to do next?
Does anyone have experience in writing such code (example), which in the future could be rewritten quickly on the Framework? It turns out that the project will use Webpack, and the profit is only in modern features. The code is reduced but everything is written according to the old scheme.
I would be glad to receive advice from those who did this and were able to complete the code migration.
The first thing that came to mind:
- Gradually abandon jQuery where possible, without sacrificing readability.
- Separate HTML (put into separate files with CSS) from JS.
- Connect RxJS for Asynchronous operations.
- For older browsers, make a legacy polyfill.
Is it worth it to connect Vue for each page separately, and then combine it into a SPA application?

Answer 1

A new repo is taken and created, with the necessary framework name, it looks at the old code and everything is done in a new way, the old code is not used, but thrown away.
In vue, rxjs is not needed, there is a store, it makes sense to drag rxjs there only for global pub / sub and / or wrappers over settimeout, setinterval. Angular does not have a store, so they use rxjs, through it they subscribe to services that distribute data. jquery is not needed there.
You need to use the bundler that is used by default in the framework name, and not drag your own.