Understanding Code Splitting and Lazy Loading

When you build a React application for production, a tool called a bundler starts at the entry file, follows every import statement, and writes all the code it finds into a small number of JavaScript files for the browser to download. Each of those files is called a bundle, or a chunk. In a Vite project the bundler runs when you type npm run build.

By default, everything that is reachable through import statements ends up in the same chunk