Can not determine the module class x Component in location/x.component.ts add xcomponent to Ng Module to fix it. Angular 4

[bisho012]

I am not on the production phase on my web ... the project is working good ... I used

ng serve --o
ng build 

and it is working great .... then I tried :-

ng build --prod

this error appeared

 Cannot determine the module for class CategoriesComponent in C:/project/src/app/Components/categories/categories.component.ts! Add CategoriesComponent to the NgModule to fix it.

I know that I made a mistake ... I made 2 components with the same name but I removed the wrong one.

and here is the code of app.Module.ts file :-

    import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule , Routes } from '@angular/router';

import { FormsModule } from '@angular/forms';
import { FlashMessagesModule } from 'angular2-flash-messages';

import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabase } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';

import { AppComponent } from './app.component';
import { OrdersComponent } from './Components/orders/orders.component';
import { ItemsComponent } from './Components/items/items.component';
import { NavbarComponent } from './Components/navbar/navbar.component';
import { LoginComponent } from './Components/login/login.component';
import { RegisterComponent } from './Components/register/register.component';

import { OrdersService } from './services/orders.service';
import { AdditemsService } from './services/additems.service';
import { AddcategoriesService } from './services/addcategories.service';
import { LoginService } from './services/login.service';
import { RegisterService } from './services/register.service';
import { AddresturantService } from './services/addresturant.service';

import { AllordersComponent } from './components/allorders/allorders.component';
import { CategoriesComponent } from './components/categories/categories.component';
import { RestaurantsComponent } from './Components/restaurants/restaurants.component';

const appRoutes: Routes = [
  {path: '', component: OrdersComponent},
  {path: 'register', component: RegisterComponent},
  {path: 'login', component: LoginComponent},
  {path: 'items', component: ItemsComponent},
  {path: 'categories', component: CategoriesComponent},
  {path: 'restaurants', component: RestaurantsComponent}
];

export const firebaseConfig = {

};

@NgModule({
  declarations: [
    AppComponent,
    OrdersComponent,
    ItemsComponent,
    NavbarComponent,
    LoginComponent,
    RegisterComponent,
    AllordersComponent,
    CategoriesComponent,
    RestaurantsComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    FlashMessagesModule,
    AngularFireModule.initializeApp(firebaseConfig),
    RouterModule.forRoot(appRoutes)
  ],
  providers: [
    AngularFireDatabase,
    AngularFireAuth,
    OrdersService,
    AdditemsService,
    AddcategoriesService,
    LoginService,
    RegisterService,
    AddresturantService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

I removed the component that was wrong and left the right one. What shall I do to make the production accept these components !

any suggestions ?

[mrunks]

I too am experiencing this problem.

We are using 1.5.0 for the CLI on Windows 10 x64

[markfullmer]

Subscribing. I've encountered the same issue with ng build --prod, but not on ng serve. See this thread, too: https://github.com/angular/angular/issues/13590

[shaukatwaqarangular]

i have resolved this issue by removing multiple component classes with the same name.

[sundeepyama]

I have fixed it just by matching the import statement with casing on the file name.

File name: communityInformation.component.ts

[Anderman]

Thx. I had the same problem with also was caused by file casing

[e5enrico]

I had to remove a duplicate component class that wasn't declared in @NgModule. The fact that it wasn't imported and declared in the ngModule allowed ng serve to work.

[gwest7]

My component was not in app.module.ts declarations. (Thought it would be excluded though.)

[yedidisatya]

I don't have multiple class with the same name and casing also is fine but still, I am getting this error.

[johnnysainz]

I had the same error caused by a pipe that I forgot to declare in a module. In dev it works fine without declaring. This wasn't happening in Angular 6, but happens in 7

[waqasraza123]

My component was not in app.module.ts declarations. (Thought it would be excluded though.)

this fixed it for me as well. The component was not included in the app.module.ts file imports

[ShrJoshi28]

I also having the same error: ERROR in : Cannot determine the module for class CCURLActionComponent in C:/Users/HP/Desktop/default-2/default/src/app/content/pages/header/action/aslaAction/aslaActionURL/asla-url-action.component.ts! Add CCURLActionComponent to the NgModule to fix it.

how to solve this error.

[bjowes]

I also resolved this by fixing casing in an import statement. However, in my case the casing error was not in the app.module.ts file, but in one of the guards. So be sure to check the import casing in ALL the ts files in the project!

[joshvito]

I fixed this error by moving some export interface IModel..... from a component file to a dedicated file for models. It appears like the compiler/trans-piler saw the component as not being declared in any NgModule, even though the component was not used.

My project structure is multiple projects, and it was only causing the failure in the projects that were not using the component in question.

I also having the same error: ERROR in : Cannot determine the module for class CCURLActionComponent in C:/Users/HP/Desktop/default-2/default/src/app/content/pages/header/action/aslaAction/aslaActionURL/asla-url-action.component.ts! Add CCURLActionComponent to the NgModule to fix it.

how to solve this error.

[D252874]

I have the same error but I don't have any duplicate's and using the same file naming convention everywhere. I am lazy loading my components so they are not in the app.module.

everywhere I do the same thing but at this specific component, it doesn't work.

when I get rid of the link in the module it creates the same error twice.

[RaviKumar1611]

I had the same error because I changed the folder name (upper case) to (lower case). It was working fine with ng serve and ng build but give error when I tried to build for production. I change the folder name in import statement on module file and it fixed the issue for me.

[NIHAR-SARKAR]

I had the same problem, Folder name casing was the reason for this .

[SaliZumberi]

solved this issue by removing a duplicate of same component

[siddharthagit]

I have the same issue with an Abstract component.

[Messhias]

I still have this issue. I created another project and add only the components which giving this error and guess what?! Still same issue.

I even switched the components name to A,B, C and D, still same issue. Why always angular build in production mode it's painful? Every time when I add an new component it's same issue and after some time I try build with prod randomly and works. What's the problem with angular?

[gtmtech-pro]

User has added CategoriesComponent in two place means two different file have same registration in module. First search and delete one place entry and rebuild again for pointing to prod

Error : Cannot determine the module for class CategoriesComponent in C:/project/src/app/Components/categories/categories.component.ts! Add CategoriesComponent to the NgModule to fix it.

100% working for me

[sarahbriveraa]

One more possibility: My issue was I renamed a folder lowercase to match the paths. For reasons beyond my expertise, the folder "appeared" to be lowercase, but with a fresh clone of the git repository, that folder rename never was applied other than visually on my system.

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