Lazy load

[w3bdesign]

A more common use-case is to lazily load a component associated to a route: when the user clicks on a link to navigate to a route, the route’s component must be lazily loaded first, before the navigation is done. It’s pretty straightforward: you use the same dynamic import syntax, but in the route declaration: Listing 131. router.ts { path: '/races', component: () => import('@/views/Races.vue') }, And you’re done! The bundler will create a separate bundle for the Races component, and that bundle will be loaded only when