There's more...

There is an alternative syntax to import components lazily. It may become an ECMA standard in the future, so you should be aware of it. Open index.js inside the router directory and completely remove the import of the Massive component or the Massive constant line we added in this recipe. Inside the routes, try the following when specifying the component for the /massive route:

routes: [  {    path: '/',    name: 'Hello',    component: Hello  },  {     path: '/massive',    name: 'Massive',    component: import('@/components/Massive')  }]

This will be equivalent to what we have done before, because Webpack will take the line and instead of directly importing the code of the Massive component, it will create a different js file, loaded lazily. ...

Get Vue.js 2 Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.