0% compiling and 10% building modules (rc5)

[elvisbegovic]

- [x ] bug report -> please search issues before submitting

Because of AoT By Default

Versions.

Angular CLI: 1.5.0-rc.5
Node: 6.11.0
OS: win32 x64
Angular: 5.0.0-rc.7
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router
@angular/cli: 1.5.0-rc.5
@angular-devkit/build-optimizer: 0.0.31
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.34
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.0-rc.5
@schematics/angular: 0.0.48
typescript: 2.5.3
webpack: 3.8.1

Repro steps.

update cli from rc3 to rc5 (and angular from rc5 to rc7)

The log given by the failure.

when launch ng serve first time it block on0% compiling step then when edit file it block at 10% building modules step

otherwise it compile BUT on browser we can see errors on console a lot template not found and I fixed this by export bootstrap module export const bootstrap = () => platformBrowserDynamic().bootstrapModule(AppModule); for AoT can I consider to export this ? becasue otherwise not works ng s with aot

so problem here is it takes a while on 0% and 10%

Desired functionality.

tell me in console if this errors happends and how fix it

Mention any other details that might be useful.

• was working in rc3
• I just want to specify if I want create new project with cli like : ng new ok I get Cannot find module '@angular-devkit/schematics'
• my components looks like :

  @Component({
  selector: 'tsab-aaaa',
  templateUrl: './aaaa.component.html',
  styleUrls: ['./aaaa.component.css']
  })

RESULT IN GIF

Juste removing one space in file I wait so:

[filipesilva]

Hey, you mention that that happened because of AOT by default. Can you test if using ng serve --no-aot makes it faster? There was also a bug in rc.7 where more files than needed we're being marked for recompilation so it might be related.

[filipesilva]

Regarding the errors you get on the console, are those templates yours? autocomplete-langue.component.html etc. Or are they from a library?

[elvisbegovic]

@filipesilva thanks it seems I don't have this with "--no-aot" BUT I can't confirm because I can't build withng s --no-aot because of error at end https://gist.github.com/istiti/f5213f4b9a0e92c4664bf9069bb7b990

is this known issue if yes how can I fix these "module build failed" then will see if happens without aot

ps: yes autocomplete.component.html is my template (it block at 10% in each file I edited) on GIF I just edited this file and save

[filipesilva]

@istiti I think I have an idea of what's breaking. Can you show me your tsconfig.json please? Your lazy routes are not included in the tsconfig so you those those errors:

bail.module.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.

[karptonite]

@filipesilva I'm having a similar issue with --no-aot (aot works fine). Worth submitting a separate issue?

[elvisbegovic]

@filipesilva

U uodated cli from 1.4.7 to rc5 how I can lnow this ?!? And whats is the syntax to add lazylod module inside tcsonfig ? Can’t cli do this alone like before? What i need todo please? Thx

Tsconfig.app : https://gist.github.com/istiti/0696f6ff8454c4138c9b2f987dbdb0d5

Tsconfig : https://gist.github.com/istiti/c533f83a227cf74e681938adc0c052cb

[asadsahi]

Having exactly same issue as @istiti 's, both aot and no-aot builds don't work with same versions of cli and angular framework upgrade as @istiti mentioned.

[filipesilva]

We have a couple of changes in 1.5 that only happen when you also update to Angular 5. We'll put out a migration guide for those cases.

I think the errors on loading .html files are because of https://github.com/angular/angular-cli/issues/8234. HMR doesn't seem to support AOT so if you are using --hmr on serve you need to turn off aot via --no-aot. My bad, see https://github.com/angular/angular-cli/issues/8234#issuecomment-340188237

Your tsconfigs don't see to be excluding the lazy modules so not sure why they are showing an error. @istiti @asadsahi @karptonite if you can get me a reproduction that shows those errors I'd really like to look into it, without it I'm just trying to guess your setup.

@karptonite is your issue #8216? I'm investigating that one separately.

[filipesilva]

Heya @istiti @asadsahi @karptonite I'm going to close this in favor of https://github.com/angular/angular-cli/issues/8234. I'm pretty sure it's the same root problem and I have been investigating it much more in depth here. Please subscribe to that issue for updates.

Also, thanks a lot for helping me debug this, these bugs are sometimes really hard to find.

[elvisbegovic]

Hope you sure what you do, donno if its same, because i Didn’t run with hmr but yes i have main setting with hmr way so maybe same issue

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

Will try tomorrow to give you zip of cleaned project but with almost 100modules 50-60 lazylod won’t be easy this will lost me a lot time :(

New green project it works and it very very fast but with mine lot error cant run without ait and with aot i need wait 50seconds before cli compile file I changed !

[filipesilva]

I'm still investigating but it seems like it's about the bootstrap replacement like I mentioned in https://github.com/angular/angular-cli/issues/8234#issuecomment-340202362:

// doesn't work
const bootstrap = () => platformBrowserDynamic().bootstrapModule(AppModule);

// works
function bootstrap () {
  return platformBrowserDynamic().bootstrapModule(AppModule);
}

Give me one or two days to see if I can fix that before taking the time to send your project @istiti. It might not be needed if I can get a fix from this.

[bmayen]

I'm able to build, but with default AOT, the build also hangs for me on "building modules" for over a minute. --not-aot doesn't hang here. FWIW, I removed HMR from this project to test this.

[elvisbegovic]

@filipesilva can yo please tell me what I need put in "files or "include" to avoid this error

Module build failed: Error: C:\...societe\societe.module.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\...@ngtools\webpack\src\angular_compiler_plugin.js:693:23)
    at plugin.done.then (C:\...@ngtools\webpack\src\loader.js:467:39)
 @ ./src/$$_lazy_route_resource lazy
 @ ./node_modules/@angular/core/esm5/core.js
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

Just to remember my tsconfig:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

and tsconfig.app

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "baseUrl": "./",
    "module": "es2015",
    "types": ["iban"]
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

[filipesilva]

@istiti you shouldn't have to change anything, I think #8215 will fix those issues you're seeing. I'll keep the updates coming in https://github.com/angular/angular-cli/issues/8234.

[filipesilva]

@bmayen #8215 should also address the hang ups by making the initial step faster.

[filipesilva]

@istiti @karptonite @bmayen the fix for this is coming out as @angular/cli@1.5.0-rc.8. Please try it together with @angular/core@5.0.0-rc.8 (and other Angular packages) and let me know if you're still seeing this.

[karptonite]

@filipesilva I never saw the exact AOT bug described in this issue. However, rc.8 does seem to fix the bug with AOT that I described in #8216. That is, When I make a change when serving in dev mode with AOT, I no longer get the Cannot read property 'text' of undefined.

I'm not sure if your fix was intended to fix the issue with --no-aot, described here https://github.com/angular/angular-cli/issues/8207#issuecomment-339984163 --that was the bug I mentioned above that I was able to reproduce. However, that bug is not fixed. My repro herehttps://github.com/angular/angular-cli/issues/8216#issuecomment-340198636 will still fail on serving with --no-aot. It seems to be specific to cases where I use external packages that are imported directly as directives rather than as modules.

[karptonite]

@filipesilva And by the way, great work on the AoT bug. Thanks for your hard work on this!

[bmayen]

Will test ASAP. Thanks!

[filipesilva]

@karptonite I couldn't take a real look at https://github.com/angular/angular-cli/issues/8216#issuecomment-340198636 before those other problems were taken care of, but I will now. Will post updates there.

BTW if you're having bad performance in ng serve with Angular 5 and the new CLI, please let me know in https://github.com/angular/angular-cli/issues/8259. There are instructions there on how you can take CPU profiles which will help me see what's being slow in your project.

[asadsahi]

@filipesilva thanks, most of the issues have resolved. However, I am having one issue which is confusing.

I am using angular2-notifications in my project and that fails with AOT mode with following error, but it works without aot. Confusion lies in this error being same before fix and this time round this is the only remaining issue. Error:

[0] ERROR in ./node_modules/angular2-notifications/src/simple-notifications/components/simple-notifications.component.ngfactory.ts
[0] Module build failed: Error: c:\Users\Asad\ngnode-fullstack\node_modules\angular2-notifications\src\simple-notifications\components\simple-notifications.component.ngfactory.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
[0]     at AngularCompilerPlugin.getCompiledFile (c:\Users\Asad\ngnode-fullstack\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:624:23)
[0]     at plugin.done.then (c:\Users\Asad\ngnode-fullstack\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\loader.js:467:39)
[0]     at <anonymous>
[0]     at process._tickCallback (internal/process/next_tick.js:188:7)
[0]  @ ./src/app/core/components/header/header.component.ngfactory.js 20:0-150
[0]  @ ./src/app/app.component.ngfactory.js
[0]  @ ./src/app/app.module.ngfactory.js
[0]  @ ./src/main.ts
[0]  @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

[filipesilva]

@asadsahi would love to look at it. Definitely looks related to the lib. Can you open a new issue with a reproduction please?

[asadsahi]

will do thanks.

[angular-automatic-lock-bot[bot]]

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.}