Classes added by `ng generate class` are not watched for recompilation (Windows 10 x64)

[HWiese1980]

Bug Report or Feature Request (mark with an x)

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

Versions.

Windows 10 (!!!)
node: v6.11.1
npm: 3.10.10
@angular/cli: 1.5.0-beta.4
node: 6.11.1
os: win32 x64
@angular/animations: 4.4.4
@angular/common: 4.4.4
@angular/compiler: 4.4.4
@angular/core: 4.4.4
@angular/forms: 4.4.4
@angular/http: 4.4.4
@angular/platform-browser: 4.4.4
@angular/platform-browser-dynamic: 4.4.4
@angular/router: 4.4.4
@angular/cli: 1.5.0-beta.4
@angular/compiler-cli: 4.4.4
@angular/language-service: 4.4.4
typescript: 2.3.4

Repro steps.

• Create a new project ng new TestRecompilation
• Add a class by ng generate class TestClass
• Serve the app ng serve
• Edit and save the class file test-class.ts
  • Nothing happens
• Edit and save a component class file like app.component.ts
  • Recompilation is triggered

The log given by the failure.

Console output? There are no error messages...

Desired functionality.

Recompilation should be triggered for any TypeScript file including those generated by ng generate class Blubb.

Mention any other details that might be useful.

I installed the current @angular/cli beta because of this behavior, hoping that it had been fixed already. But it still occurs in beta.4.

[clydin]

Is the class in question used/referenced within the application? If not, the class would not be part of the application’s dependency graph and the described behavior should be correct.

[HWiese1980]

Yes, it is. I'm using it in one of my custom components which in fact does get recompiled upon change.

[HWiese1980]

Recompilation is triggered when I import the corresponding classes in the app.module.ts and create dummy instances from them in the AppModule class. That's a working workaround, though I still wonder why it doesn't work if they are only imported and used in components.

[HWiese1980]

@clydin Is it possible to somehow debug/output the dependency graph, like, visually? I'd like to verify that the classes really are in the dependency graph and if not to figure out where the gap is in the graph.

[montella1507]

@HWiese1980 is is not only for generated classes:
#7995

[hansl]

Forget my last comment, this is the same issue as #7995. Closing that one since this is older. Investingating.

[hansl]

@HWiese1980

I cannot reproduce this. Using your steps, adding the following lines to the app.component.ts will trigger rebuilds when I change the test class:

import {TestClass} from './test-class';

new TestClass();

Do you have a project we can look at?

[hansl]

(in the meantime I'll follow the steps from #7995)

[hansl]

Okay I know what's going on. In order for import { X } from './some-file'; to be transpiled to a require() call, X needs to be used in the file. Otherwise the import is simply removed. This is by design. So you need to do new X, OR you need to call import './some-other-file' which should have side effects.

Now #7995 is a different bug which is actually a real issue (I'm reopening it and explaining what's happening there).

I'm going to close this issue as Working As Intended. Classes / functions that are simply imported from another file are discarded if they're not used in that file. After extensive testing, the CLI works as intended by not triggering a rebuild on code that did not change (since the file is only referenced and not actually used).

[HWiese1980]

I think it's not mentioned in the Getting Started tutorials that you have to instanciate new classes in the app.component.ts in order for them to be watched for changes. I might have overlooked it though. In that case I'd say its mention is not placed prominently enough.

I think from a logical standpoint it should be sufficient for the change watchdog to use the class in at least one of the application's sub-components as long as that component or one of its ((great-)grand-)parents is imported in the app.component.ts (it is not automatically imported there by ng generate component) and/or the app module because it is only automatically imported there by the ng generate. That's how I understand a dependency tree after all and that's how I would expect a CLI to work: to do everything necessary for an application part (component, service, class etc) to work out of the box - which definitely includes triggering recompilation on change.

It might not be a bug but its at least a huge pitfall for beginners (like me). I use the angular cli to create a new component by means of ng generate component blah. The component gets automatically imported in the app.module.ts, however not so in app.component.ts. Then I create a class using ng generate class blubb. I intend to use that class in my component. I import it there of course because I assume that that will be sufficient. But it seems it is not. In addition I have to import it in app.component.ts and instanciate a dummy object of it there? That's a bit inconvinient, don't you think? Even if it's by design, as you say, it should be prominently mentioned somewhere in the Getting Started docs.

[angular-automatic-lock-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.}