Skip to content

Multiple Applications

yaqzi edited this page Feb 18, 2018 · 3 revisions

Angular Seed supports multiple applications with shared codebase! The default application which by default goes with the seed resides in src/client/app. For another application, called "todo", which uses the code from "app" use:

  1. Create a directory called "todo" in src/client.
  2. In "todo" directly reference files located in "app". For instance, in order to use the shared module use:
// src/client/todo/app.module.ts
import { NgModule } from '@angular/core';
import { SharedModule } from '../app/shared/shared.module';

@NgModule({
  imports: [SharedModules.forRoot()],
  // ...
})
  1. In order to start your application in development mode use:
npm start -- --app todo
  1. In order to build your application for production:
# AoT disabled
npm run build.prod -- --app todo

# AoT enabled
npm run build.prod.exp -- --app todo

For the production build, ONLY the used by the app "todo" files will be included in the app.js bundle.

Note: If you have to override SystemJS Builder's config in project.config.ts make sure that you declare paths for each project (for more information take a look at tools/config/seed.config.ts).

If you're getting 404 error for shared modules make sure that you have all your shared projects in seed.config.ts like so:

packages: {
  [this.BOOTSTRAP_DIR]: {
      defaultExtension: 'js'
  },
  'app': {
      defaultExtension: 'js'
  },
  'sharedCommons': {
      defaultExtension: 'js'
  },
  'oneMoreSharedProject': {
      defaultExtension: 'js'
  }
}