When working on a big scaled application, sometimes you want to load and asynchronously instantiate part of it. If you worked on a big client-side application with a bundler like Webpack, you probably know how code-splitting works.
If you read about Injex's Webpack Runtime, you noticed that we use the
require.context() to load the files inside the project. The problem with this approach is that we're bundling all the code together.
@lazy() decorator you create a class that implements the
ILazyModule interface. The
import method should load and return a Constructor inside a Promise, then the constructor is called with args you pass in. You can use the
import method for lazy-loading the code.
To use the
@lazy() decorator, put it above an exported class that implements the
ILazyModule interface. Lines 9 and 11 will create a chunk using Webpack's code-splitting feature.
Notice how the lazy-loaded class (HomePage) not defined by the
@define() decorator since it's get registered when loaded by the
@lazy() module, but it's not preventing you from using the