Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

280
Views
Angular 4.0.0 could not find bootstrap code

Error : Tried to find bootstrap code, but Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.

main.ts

getHttp().get('/assets/config.json').toPromise()
 .then((res: Response) => {
 let conf = res.json();
 platformBrowserDynamic().bootstrapModule(createAppModule(conf));
})

I am using angular-cli. With angular v2.3.1 this code was working fine.

I want to fetch json and pass it to @Ngmodules providers

{ provide: Config, useValue: conf } 
about 4 years ago · Santiago Trujillo
3 answers
Answer question

0

If the data you are fetching from config.json are just about a configuration of an application module and you are trying to create a Config service to store them, I think the best would be to assign it to the environment and read it in your Config service later. The environment is available in main.ts, so no hacking (createAppModule) needed.

import { environment } from './environments/environment';
import { AppModule } from './app/';

getHttp().get('/assets/config.json').toPromise()
   .then((res: Response) => {
       let conf = res.json();
       environment.settings = conf;
       platformBrowserDynamic().bootstrapModule(AppModule);
});

You must also declare all new properties of environment in your src/environments/environment.ts file.

about 4 years ago · Santiago Trujillo Report

0

The accepted answer didn't work for me. Extracting the bootstrapModule part will let Angular find the bootstrap code.

import { environment } from './environments/environment';
import { AppModule } from './app/';

const bootstrap = () => {
  platformBrowserDynamic().bootstrapModule(AppModule);
};

getHttp().get('/assets/config.json').toPromise()
    .then((res: Response) => {
       let conf = res.json();
       environment.settings = conf;
       bootstrap();
});
about 4 years ago · Santiago Trujillo Report

0

The cli is attempting to use ahead of time compilation. Because of this, it needs to be able to find your main NgModule.

Usually the AOT compiler is able to do this statically just by looking for bootstrap calls. However you are not immediately bootstrapping, so the compiler needs you to explicitly tell it the name of your app module so it can compile it and all of it's components.

Solutions

ng eject and manually configure entryModule

The preferred solution is to tell the cli the name of your entryModule. This will allow AOT to work and give you all of it's benefits. However the cli does not currently support this(But there is a PR for adding an option #4077).

The current workaround is to use ng eject --aot to switch to a manual webpack based build. Then you can configure your entryModule directly.

  1. ng eject --aot
  2. Open webpack.config.js and search for new AotPlugin
    • Add the following and replace your AppModule name
      entryModule: 'path/to/app.module#AppModule'

Skip AOT

You can entirely skip this issue by using the --no-aot flag if you just need to get a build working. This isn't recommended as your app will be much slower and larger than it normally would(it will have to compile components at runtime and you will have to ship the compilier which is large).

ng prod --no-aot

about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!