Angular2 module has no exported member

Question

For a website with authentication in Angular2  I want to use a component of the authentication submodule in the main app component  However  I keep getting the following error    app app component ts 3 10   error TS2305  Module    lt dir gt  app auth auth module   has no exported member  SigninComponent    even after exporting SigninComponent   The project folder structure is as shown below     app auth auth module ts    import   NgModule         from   angular core   import   CommonModule     from   angular common   import   FormsModule      from   angular forms    import   RegisterComponent      from    components register component   import   SigninComponent      from    components signin component   import   HomeComponent      from    components home component    import   AuthService   from    services auth service   import   AuthHttp   from    services auth-http     NgModule     imports          CommonModule        FormsModule        declarations          RegisterComponent        SigninComponent        HomeComponent        providers          AuthService        AuthHttp        exports          RegisterComponent        SigninComponent        HomeComponent        export class AuthModule      app auth components signin component ts   import   Component   from   angular core   import   Router   from   angular router   import   AuthService   from     services auth service     Component       selector   signin       templateUrl   app auth signin html     export class SigninComponent               app app component ts   import   Component  OnInit   from   angular core   import   Router  RouterOutlet   from   angular router   import   SigninComponent  RegisterComponent   from    auth auth module   import   AuthHttp   from    auth services auth-http   import   AuthService   from    auth services auth service     Component       selector   myapp       templateUrl   app app html      export class AppComponent implements OnInit               app app module ts   import   NgModule        from   angular core   import   BrowserModule   from   angular platform-browser   import   FormsModule     from   angular forms   import   HttpModule      from   angular http   import   RouterModule   from   angular router   import   AppRoutingModule   from    app-routing module   import   AuthModule   from    auth auth module    import   AppComponent   from    app component    import   AuthService   from    auth services auth service   import   AuthHttp   from    auth services auth-http     NgModule     declarations          AppComponent        AuthService        AuthHttp        bootstrap    AppComponent      imports           BrowserModule        FormsModule        HttpModule        AuthModule        AppRoutingModule        providers          AuthService        AuthHttp        export class AppModule

User · Answer

I had the component name wrong it is case sensitive  in either app rounting ts or app module ts

User · Answer

Also some of common cases    maybe you export class with  default  prefix like so   export default class Module      just remove it   export class Module      this is solve the issue for me

User · Answer

For my case  I restarted the server and it worked

User · Answer

I got similar issue  The mistake i made was I did not add service in the providers array in app module ts  Hope this helps  Thank You

User · Answer

You do not need the line   import   SigninComponent  RegisterComponent   from    auth auth module     in your app component ts as you already included the AuthModule in your app module ts  AutModule import is sufficient to use your component in the app   The error that you get is a TypeScript error  not a Angular one  and it is correct in stating that there is no exported member  as it searches for a valid EC6 syntax for export  not angular module export  This line would  thus work in your app component ts   import   SigninComponent   from    auth components signin component

User · Answer

This error can also occur if your interface name is different than the file it is contained in  Read about ES6 modules for details  If the SignInComponent was an interface  as was in my case  then   SignInComponent   should be in a file named SignInComponent ts

User · Answer

For me such issue occur when I had multiple export statements in single  ts file

User · Answer

Working with atom  1 21 1 ia32     i got the same error  even though i added a reference to my pipe in the app module ts and in the declarations within app module ts  solution was to restart my node instance    stopping the website and then doing ng serve again    going to localhost 4200 worked like a charm after this restart

User · Answer

In my module i am exporting classes this way    export   SigninComponent   from    SigninComponent   export   RegisterComponent   from    RegisterComponent     This allow me to import multiple classes in file from same module    import   SigninComponent  RegisterComponent  from     auth module     PS  Of course  Fjut answer is correct  but same time it doesn t support multiple imports from same file  I would suggest to use both answers for your needs  But importing from module makes folder structure refactorings more easier

User · Answer

I was facing same issue and I just started app with new port and everything looks good   ng serve --port 4201

[javascript] Angular2 module has no exported member

Examples related to javascript

Examples related to angular

Examples related to typescript

Examples related to angular2-modules