Angular 2 ERROR in Cannot determine the module for class ManagersService i

2.5k Views Asked by At

When trying to build using ng build -prod I am getting the following error

ERROR in Cannot determine the module for class ManagersService in C:/Test/src/app/shared/common/managers/managers.service.ts! Add ManagersService to the NgModule to fix it.

I have AppModule, AppCommonModule and CustomModuleA. ManagersService is in AppCommonModule. CustomModuleA has a route that uses ManagersComponent(this component uses ManagersService) of AppCommonModule. AppCommonModule is imported in both the AppModule and CustomModuleA

I have added the service to the AppCommonModule providers. I dont understand what I am missing here.

Note: With ng serve this works like a charm. No error.

This is the ManagersComponent which belongs to AppCommonModule

@Component({
    templateUrl: './managers.component.html',
    providers: [ManagersService]
})
export class ManagersComponent extends AppComponentBase {
    @ViewChild('createOrEditManagerModal') createOrEditManagerModal: CreateOrEditManagerModalComponent;

    constructor(public managersService: ManagersService) {
    }

This is the AppCommonModule

@NgModule({
    imports: [
        FormsModule,
        ReactiveFormsModule        
    ],
    declarations: [
        ManagersComponent        
    ],
    providers: [
        ManagersService,
    ],
    exports: [      
        ManagersComponent,
    ]
})

and this is the CustomModuleA

@NgModule({   
    imports: [
        CommonModule,
        FormsModule,
        HttpModule,
        ModalModule,
        TabsModule,
        TooltipModule,
        AppCommonModule,        
    ],
     declarations: [
        CompA     
    ],
    providers: [
       SomeOtherService
    ]
})

export class CustomModuleA { }

This is the CustomAModuleRouting

NgModule({
    imports: [
        RouterModule.forChild([
            {
                path: '',
                children: [                    
                    {
                        path: 'compA',
                        component: CompA,                       
                    },                    
                    {
                        path: 'managers',
                        component: ManagersComponent,                        
                    },
                ]
            }
        ])
    ],
    exports: [
        RouterModule
    ]
})
1

There are 1 best solutions below

0
On

I don't see your imports in AppCommonModule but I'm guessing you have two files containing ManagersService and are only importing one of them (not src/app/shared/common/managers/managers.service.ts). Deleting the offending dupe file will fix your problem.

The --prod switch triggers AOT compilation which will attempt to compile every .ts file it finds. ng serve uses JIT compilation which is why the problem doesn't manifest itself there.