Add flag to ng generate component that skips adding ngOnInit() interface.

[realtomaszkula]

🚀 Feature request

Command (mark with an x)

• [ ] new
• [ ] build
• [ ] serve
• [ ] test
• [ ] e2e
• [x] generate
• [ ] add
• [ ] update
• [ ] lint
• [ ] extract-i18n
• [ ] run
• [ ] config
• [ ] help
• [ ] version
• [ ] doc

Description

Generating components with ng g c component-name always generates a component implementing ngOnInit() interface.

Many components do not benefit from implementing such interface. A good example might be a dumb component, that uses mostly @Input() and @Output().

Right now there is no way to override this behaviour so if you want to generate a dumb component, you need to:

1. remove ngOnInit() method,
2. remove implements OnInit clause from the component class,
3. remove the OnInit import from '@angular/core';

This has to be repeated for every component generated, so it gets old really fast 🤷

Describe the solution you'd like

Ideally, there should be an option to generate a component that does not implement the ngOnInit() hook.

Maybe something like this could work: ng g c component-name --skip-on-init or ng g c component-name --skip-lifecycle

It would match the naming of flags such as --skip-tests or --skip-selector.

[alan-agius4]

Thoughts @mgechev about removing ngOnInit from the generated component code?

Note: It's unlikely that we'd expose a flag to add/remove the ngOnInit.

[muhammadawaisshaikh]

I want to take over this 🙌

[y-nut]

I usually remove the ngOnit as well but I don't like the flag approach on the generator. I would prefer to set it up in the project config file and then add a flag when creating the project like ng new project --skip-lifecycle

[realtomaszkula]

I don't have a strong preference for having the --skip flag. As long as there is a way to generate the component without the ngOnInit() :+1:

[mgechev]

We started generating ngOnInit to encourage folks to not put complex logic in the constructor and make the component more testable.

I, personally, keep the hook less than 1% of the time.

To me it makes sense to remove it from the component generator, but would like to collect more community feedback before we move forward.

[ashish-koshy]

Thank you! @realtomaszkula for bringing attention to this.

@alan-agius4 @mgechev I was ready with a PR to have this added in.

While I do agree that the hook encourages devs to avoid stuffing the constructor, having it forced/hardcoded within the template takes away from the flexibility of having schematics. I think the same applies to the empty constructor as well.

It would be ideal to update the schema with properties that allow us to make them optional.

P.S: Working on enterprise projects, this also interferes with shared linters that force us to avoid having empty hooks or contructors in the code before being allowed to push our changes. Its annoying to have to take that extra step to clear the code when we are trying to quickly test or prototype something.

[SanderElias]

@twerske, @mgechev I think it makes sense to clean up the schematics so that it doesn't add the OnInit. While on this, also remove the constructor. given the inject() function it makes less sense now to have it there by default.

one additional thought. Would it be possible to have the language server add/update the OnInit/OnDestroy/... implements fag when a user added one of the life-cycle hooks to the body of the class? Similar to automatic importing works?

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