DEV Community

loading...

Discussion on: 1-line solution for importing and registering your Vue component

Collapse
raheel98 profile image
Raheel Khan

It's not a good idea to use this all the time. Importing components this way tells webpack to split the components into separate chunks. In your example this will result in 3 separate requests for the components being used instead of them being bundled together which will slow down the page load.

This approach is good if you are using components that are not initially rendered (and may not end up being needed) as it will reduce the initial bundle size. For example if you have a modal component that only becomes visible (using v-if) if the user clicks a button and there is a reasonable chance they won't click the button at all. In that case it might be better to import the component this way (dynamic import) and not have that component included in the initial bundle.