diff --git a/docs/ilc_app_interface.md b/docs/ilc_app_interface.md index 82861def..470a1d94 100644 --- a/docs/ilc_app_interface.md +++ b/docs/ilc_app_interface.md @@ -16,7 +16,7 @@ ILC also supports apps that have client side rendering only. During the course of a single-spa page, registered applications are loaded, bootstrapped (initialized), mounted, unmounted, and unloaded. ILC (with the help of the [single-spa](https://single-spa.js.org/)) provides hooks into each phase via `lifecycles`. -See more information about the [lifecycle functions here](https://single-spa.js.org/docs/building-applications#lifecyle-props). +See more information about the [lifecycle functions here](https://single-spa.js.org/docs/building-applications/#lifecyle-props). ### Custom props that are passed to every app @@ -25,3 +25,27 @@ See more information about the [lifecycle functions here](https://single-spa.js. * `getCurrentBasePath(): string` - returns same value as `basePath` param in `routerProps` query parameter * `errorHandler(error, errorInfo = {}): void` - app MUST use it to propagate all unhandled errors * `appId` - Unique application ID, if same app will be rendered twice on a page - it will get different IDs + + +### Init code during app bundle loading + +Sometimes you need to run some initialization code right after app bundle will be loaded in the browser and usually you +want to be able to pass some configuration properties to that code. + +ILC allows you to export a function called `mainSpa(props)` that will receive application properties that were defined in +_Registry_ in it's first argument. +This function should return an object with "single-spa" [lifecycle functions](https://single-spa.js.org/docs/building-applications/#lifecyle-props). + +**Example of possible use case:** +```javascript +// File specified as Webpack entry point +export const mainSpa = (props) => { + if (props.publicPath) { + __webpack_public_path__ = props.publicPath; + } else { + console.warn(`Can't determine value of the "__webpack_public_path__", falling back to default one...`); + } + + return require('./app-bootstrap'); // Returns: {bootstrap: () => {}, mount: () => {}, unmount: () => {}} +}; +``` \ No newline at end of file