React. Lazy loading component only when using it?

Question

JavaScript

Right now my application has asynchronous loading of components (using react-router).
But one way or another, all components are loaded, even if they are not used.
How can I make it so that the component is loaded only when it is used (If the user goes to a certain route)?

Answer 1

https://reactjs.org/docs/code-splitting.html here everything is chewed in the most detailed way. It's hard to tell more

Answer 2

There is an example with react-router.
For example, the site works https://tools.xakplant.ru/