I’ve encountered a problem with a component generation using anglular-cli ng-cli doesn’t add the brand-new created component to the app module:
$ ng g component Try
installing component
create src\app\try\try.component.css
create src\app\try\try.component.html
create src\app\try\try.component.spec.ts
create src\app\try\try.component.ts
update src\app\app.module.ts
No app module found. Please add your new class to your component.
I didn’t move any file. The project structure is default. The src\app\app.module.ts
exists and has the following content:
import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';
import {RouterModule} from '@angular/router';
import {AppComponent} from './app.component';
import {ROUTES} from "./app.routes";
@NgModule({
imports: [
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot(ROUTES)
],
declarations: [
AppComponent
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {
}
Everything looks like ok.
So, finally, let’s close my issue. I'm very sorry, I’ll be verbose, since this problem have been making my nerves.
As to me, it was some king of bug in the latest version of ng-cli or probably in its incompatibility with latest version of related components.
The source of problem was in my updating of all the modules mentioned in package.json
up to the latest stable version.
Problem was confidently reproducible. However by now it looks like Angular Team has solved something and, after the last updating, everything has become fine. What I did to solve it:
npm uninstall -g angular-cli @angular/cli
npm uninstall angular-cli @angular/cli -–save-dev
npm cache clean
npm install -g @angular/cli@latest
npm install --save-dev @angular/cli@latest
# let’s update all the local again packages to the latest ones with this funny utility:
npm install -g npm-check-updates
ncu -u -a --packageFile package.json
rm -rf node_modules
npm install
Now I have the following versions and everything is working:
"devDependencies": {
"@angular/cli": "^1.0.0-beta.31",
"@angular/compiler-cli": "^2.4.7",
"@types/jasmine": "2.5.42",
"@types/node": "^7.0.5",
"angular2-template-loader": "^0.6.2",
"bootstrap": "^4.0.0-alpha.6",
"codelyzer": "~2.0.0",
"css-loader": "^0.26.1",
"css-to-string-loader": "^0.1.2",
"file-loader": "^0.10.0",
"html-loader": "^0.4.4",
"html-webpack-plugin": "^2.28.0",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "3.2.0",
"karma": "1.4.1",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.1.0",
"karma-remap-istanbul": "^0.6.0",
"protractor": "~5.1.1",
"pug-html-loader": "^1.1.0",
"pug-loader": "^2.3.0",
"raw-loader": "^0.5.1",
"stylus": "^0.54.5",
"stylus-loader": "^2.4.0",
"ts-loader": "^2.0.0",
"ts-node": "2.1.0",
"tslint": "^4.4.2",
"typescript": "~2.1.6",
"typings": "^2.1.0",
"url-loader": "^0.5.7",
"webpack": "^2.2.1",
"webpack-dev-server": "^2.3.0"
}
Let's try again:
$ ng generate component NewOne
installing component
create src\app\new-one\new-one.component.css
create src\app\new-one\new-one.component.html
create src\app\new-one\new-one.component.spec.ts
create src\app\new-one\new-one.component.ts
update src\app\app.module.ts
Fine.
Try this:
ng generate component menu(Component name) --module=app(root app module).module
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With