Angular-cli: In app.module place the app.component import last

Created on 8 Jan 2020  路  10Comments  路  Source: angular/angular-cli

In order to make it easier to cut and paste component imports in the router module, Instead of:

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { StepperComponent } from './stepper/stepper.component';

Do

import { AppRoutingModule } from './app-routing.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { StepperComponent } from './stepper/stepper.component';
import { AppComponent } from './app.component';



schematicangular good first issue help wanted triage #1 feature

Most helpful comment

I think that makes sense. I'd even move the non-local imports all the way to the top.

Would you like to implement this change?

All 10 comments

I think that makes sense. I'd even move the non-local imports all the way to the top.

Would you like to implement this change?

hey,
I would like to give it a go.
As a new contributor I would need some guidance if possible :)

I think that makes sense. I'd even move the non-local imports all the way to the top.

Would you like to implement this change?

Heya @zadokdaniel, thanks for taking a look!

So this happens on a generator, and generators are relatively easy to test which makes it easier to work on. All generators are in https://github.com/angular/angular-cli/tree/master/packages/schematics, and have unit tests. The unit tests can be ran with yarn test.

The first thing is to figure out which generator does it and reproduce the problem. The issue report didn't actually include that.

@fireflysemantics what was the command you used when you saw this happening? Can you also provide the result of ng version please?

@filipesilva Hello, What are trying to solve here? In the original issue only app.component is mentioned. Are we trying to move all non-local imports to top?

@krishnaanaril yes, that is the idea. The way we add these imports is by reading the source file AST and inserting new imports in the appropriate place. So the algorithm we use to do that would need to handle local/non-local better.

I'm still not sure in what situations this occurs so it's also important to isolate the problematic insertions.

Is anyone working on this?

I have not encountered this being an issue with other developers. Am I reading this right that this to to make copy/paste easier?

Hi - Sorry for the late reply - Just saw the other comments now.

After having done a few more project I've started to always just delete the routing module and place the routes directly into the app module.

This is easier because the app module has to have all the components for declaration anyways, so it's just easier to define the routes there too.

I wonder if creating a separate routing module should be an option on the new command, so that users that want that get that, otherwise the routing will just be generated right into the app.module?

--------answer
yes you can do it by using the command as -ng new --routing
->it will create a new project with a separate routing module
I hope that this was your problem, if not then sorry i am just new to github community

--------answer
yes you can do it by using the command as -ng new --routing
->it will create a new project with a separate routing module
I hope that this was your problem, if not then sorry i am just new to github community
it is ng new project_name --routing
i dont now how it got removed from my comment

Was this page helpful?
0 / 5 - 0 ratings

Related issues

rwillmer picture rwillmer  路  3Comments

brtnshrdr picture brtnshrdr  路  3Comments

sysmat picture sysmat  路  3Comments

IngvarKofoed picture IngvarKofoed  路  3Comments

donaldallen picture donaldallen  路  3Comments