Nowadays, one of the most challenging parts of frontend development is error handling. Sometimes we don't want to think about the worst cases or we just don't have time to handle them because of deadlines but it doesn't mean they aren't important.
Today, I'm going to talk about dynamic import error handling. Although this topic is about Vuejs, you can see this as a generic solution for other view libraries.
With this code above, we only handle the success scenario. If we want to handle failure case, we can create a generic component which isn't imported dynamically and then return it on catch like below.
This generic DynamicImportError component will be loaded on initial request. What if our initial request fails? Well... I think that is different problem.
You can say that DynamicImportError will increase initial bundle size, but it is a dummy component and it only informs visitors that something went wrong so it won't have a big size. In my opinion it has a pretty low opportunity cost.