简体   繁体   中英

Angular2: Very strange behaviour, error complaining about a component that's not imported even though it is imported in app.module

I am busy with an Angular2 app and experiencing something very strange... I created a new component using angular-cli called GoodsReceivedComponent. when I import the component into my app.module.ts and app.routing.ts I don't get any build errors but when I add the path to GoodsReceived in my app.routing.ts I get an error saying GoodsReceivedComponent isn't part of any module but it is imported into my app.module... Any idea what might be going wrong here?

my code:

goods-received.component.ts:

export class GoodsReceivedComponent implements OnInit {

in app.module.ts:

import { GoodsReceivedComponent } from './Components/goods-received/goods-received.component';

declarations: [
    AppComponent,
    ProductComponent,
    CheckBarcodesComponent,
    HomeComponent,
    NavigationComponent,
    SettingsComponent,
    StockTransactionItemComponent,
    StockTakeComponent,
    spinners.CircleComponent,
    LoaderComponent,
    ErrorComponent,
    GoodsReceivedComponent  
  ],

in app.routing.ts:

  import { GoodsReceivedComponent } from './components/goods-received/goods-received.component';

  const appRoutes : Routes = [
{path: "settings", component: SettingsComponent },
    {path: "checkBarcodes", component: CheckBarcodesComponent },
    {path: "home", component: HomeComponent},
    {path: "", redirectTo: 'home', pathMatch: 'full'},
    {path: "stockTake", component: StockTakeComponent}
    {path: "goodsReceived", component: GoodsReceivedComponent}
];

my error:

runtime_compiler.js:215Uncaught Error: Component GoodsReceivedComponent is not part of any NgModule or the module has not been imported into your module.
    at RuntimeCompiler._createCompiledHostTemplate (http://localhost:4200/main.bundle.js:38664:19)
    at http://localhost:4200/main.bundle.js:38623:37
    at Array.forEach (native)
    at http://localhost:4200/main.bundle.js:38621:45
    at Array.forEach (native)
    at RuntimeCompiler._compileComponents (http://localhost:4200/main.bundle.js:38612:43)
    at RuntimeCompiler._compileModuleAndComponents (http://localhost:4200/main.bundle.js:38539:37)
    at RuntimeCompiler.compileModuleAsync (http://localhost:4200/main.bundle.js:38530:21)
    at PlatformRef_._bootstrapModuleWithZone (http://localhost:4200/main.bundle.js:27267:25)
    at PlatformRef_.bootstrapModule (http://localhost:4200/main.bundle.js:27249:21)
RuntimeCompiler._createCompiledHostTemplate @ runtime_compiler.js:215
(anonymous) @ runtime_compiler.js:174
(anonymous) @ runtime_compiler.js:172
RuntimeCompiler._compileComponents @ runtime_compiler.js:163
RuntimeCompiler._compileModuleAndComponents @ runtime_compiler.js:90
RuntimeCompiler.compileModuleAsync @ runtime_compiler.js:81
PlatformRef_._bootstrapModuleWithZone @ application_ref.js:328
PlatformRef_.bootstrapModule @ application_ref.js:310
(anonymous) @ main.ts:12
__webpack_require__ @ bootstrap 1f81207…:52
(anonymous) @ zone.js:1428
__webpack_require__ @ bootstrap 1f81207…:52
webpackJsonpCallback @ bootstrap 1f81207…:23
(anonymous) @ main.bundle.js:1
client:38 [WDS] Errors while compiling.
client:80 [default] C:\Users\Deon\Documents\trade-link\barcode-checker\src\app\app.routing.ts:16:1 
',' expected.
errors @ client:80
sock.onmessage @ socket.js:37
EventTarget.dispatchEvent @ eventtarget.js:51
(anonymous) @ main.js:274
SockJS._transportMessage @ main.js:272
EventEmitter.emit @ emitter.js:50
WebSocketTransport.ws.onmessage @ websocket.js:35
wrapFn @ zone.js:698
ZoneDelegate.invokeTask @ zone.js:265
Zone.runTask @ zone.js:154
ZoneTask.invoke @ zone.js:335

In the app.module.ts file there is a typo in the import statement

This line:

import { GoodsReceivedComponent } from './Components/goods-received/goods-received.component';

should be:

import { GoodsReceivedComponent } from './components/goods-received/goods-received.component';

Note the './Components' after 'from' should be './components'

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM