Skip to main content

Dependency Injection

Explanation​

Child App has integrated Dependency Injection mechanism, which is deeply connected to Root App DI.

Modules and providers passed to createChildApp will be unique for this Child App and will not be available in Root App or other Child Apps.

Advanced topic - How Child App and Root App DI connected.

Usage​

To add extra dependencies in Child App DI, you need to pass modules and providers to createChildApp method:

import { provide } from '@tramvai/core';
import { createChildApp } from '@tramvai/child-app-core';
import { CommonChildAppModule, COMBINE_REDUCERS } from '@tramvai/module-common';
import { RootCmp } from './components/root';

// eslint-disable-next-line import/no-default-export
export default createChildApp({
  name: 'fancy-child',
  render: RootCmp,
  // works the same as `modules` in `createApp`
  modules: [CommonChildAppModule],
  // works the same as `providers` in `createApp`
  providers: [
    provide({
      provide: COMBINE_REDUCERS,
      useValue: MyOwnStore,
    }),
  ],
});

Some basic tramvai packages exports Child App specific modules, this modules never should be used in Root App:

  • CommonChildAppModule from @tramvai/module-common
  • RouterChildAppModule from @tramvai/module-router
  • ClientHintsChildAppModule from @tramvai/module-client-hints