AOT Compiler looks for files in wrong path #2592

Activity

1. filipesilva commented on Oct 10, 2016

   

   filipesilva

   on Oct 10, 2016

   Contributor

   More actions

   We've only started to support AoT compilation in beta16/17 with the --aot flag in the serve and build commands (and it's still under testing). There was no support at all in beta.10.
2. filipesilva

   closed this as completedon Oct 10, 2016
3. NiceGuyNimni commented on Nov 2, 2016

   

   NiceGuyNimni

   on Nov 2, 2016

   More actions

   I have the same issue in @angular/compiler-cli": "^2.1.2

   Any ideas?
4. skendrot commented on Dec 13, 2016

   

   skendrot

   on Dec 13, 2016

   More actions

   Up?! Seeing this with 2.2.4
5. skendrot commented on Dec 13, 2016

   

   skendrot

   on Dec 13, 2016

   More actions

   Found this in the docs:

   Component-relative Template URLS
   The AoT compiler requires that @component URLS for external templates and css files be component-relative. That means that the value of @Component.templateUrl is a URL value relative to the component class file. For example, an 'app.component.html' URL means that the template file is a sibling of its companion app.component.ts file.

   Ok, so that's fine. Instead of 'app/app.component.html you use app.component.html. But if you do this you can no longer debug the application because you will get an error that the file ~/app.component.html does not exist.

   So, the docs say:

   JiT-compiled applications that use the SystemJS loader and component-relative URLs must set the @Component.moduleId property to module.id. The module object is undefined when an AoT-compiled app runs. The app fails with a null reference error unless you assign a global module value in the index.html like this:

   I have no idea what this means. There are no samples that show this. Where do you set moduleId? what is the id of the module?
6. skendrot commented on Dec 13, 2016

   

   skendrot

   on Dec 13, 2016

   Last edited by skendrot

   More actions

   Thanks to Visual Studio go to definition, I found that an NgModule has an id?: string property. and that the Component has a moduleId?: string property.

   @NgModule({
       id: 'MyApp',
       imports: [BrowserModule],
       declarations: [AppComponent ],
       bootstrap: [AppComponent ]
   })
   

   In the Component:

   @Component({
       selector: 'my-app',
       moduleId: 'MyApp',
       templateUrl: 'app.component.html',
       styleUrls: ['app.component.css']
   })
   

   Even with these changes, and adding window.module = 'aot'; to the script of the index page it still tries to get the html file relative to the host server

   👍React with 👍1Reacted by Huan Li
7. skendrot commented on Dec 18, 2016

   

   skendrot

   on Dec 18, 2016

   More actions

   Filed issue: angular/angular#13553
8. baigali93 commented on Jul 17, 2017

   

   baigali93

   on Jul 17, 2017

   More actions

   Any solutions? I want to use JIT for development and AOT for production using SystemJS but have to manually add/remove the __moduleName property for both.
9. angular-automatic-lock-bot commented on Sep 7, 2019

   

   angular-automatic-lock-botbot

   on Sep 7, 2019

   More actions

   This issue has been automatically locked due to inactivity.
   Please file a new issue if you are encountering a similar or related problem.

   Read more about our automatic conversation locking policy.

   _{This action has been performed automatically by a bot.}
10. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Sep 7, 2019