Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 7 - Custom library - cannot export simple class

Tags:

angular

I created a custom library that I published to use in my application

import { AccordionComponent } from 'my-angular-lib';
import { AccordionItemComponent } from 'my-angular-lib';

these two components are indeed included and display correctly

but, when I add a simple class which is not a directive/component..

export class Tools {
...
}

it just does not find it from my library module, as I compile my application

ERROR in src/app/app.component.ts(10,10): error TS2305: Module '"...../node_modules/my-angular-lib/my-angular-lib"' has no exported member 'Tools'.

although I declared it in the public-api.ts, I still cannot use it

export * from './lib/helpers/tools.class';

I also tried to add it in the main library module but it complained it had no @Directive/@Component tag

this is how I use it in my application

import { Tools } from 'my-angular-lib';

all the other components can be used and are found in the name space of my library without any issue

I already read many threads but none give me an alternative answer to solve this

Appreciate any help on this

[edit:]

if I try to add it to the imports/exports, I get

 Please add a @Pipe/@Directive/@Component annotation.

Why can't I just export it ?

my-angular-lib.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';  
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';

import { AccordionComponent } from './widgets/accordion/accordion.component';
import { AccordionItemComponent } from './widgets/accordion/accordionItem.component';

import { PaginationComponent } from './widgets/pagination/pagination.component';
import { PaginationService } from './widgets/pagination/pagination.service';

import { PasswordComplexityComponent } from './widgets/passwordComplexity/passwordComplexity.component';

import { UpDownComponent } from './widgets/updown/updown.component';

import { Tools } from './helpers/tools.class';

@NgModule({
  declarations: [
      AccordionComponent,
      AccordionItemComponent,
      PaginationComponent,
      PasswordComplexityComponent,
      UpDownComponent,
      Tools
  ],
  imports: [
      CommonModule,
      FormsModule
      ],
  exports: [
      AccordionComponent,
      AccordionItemComponent,
      PaginationComponent,
      PasswordComplexityComponent,
      UpDownComponent,
      Tools
  ],
  providers:[PaginationService]
})
export class MyAngularLibModule { }

public-api.ts

export * from './lib/my-angular-lib.module';

export * from './lib/widgets/accordion/accordion.component';
export * from './lib/widgets/accordion/accordionItem.component';

export * from './lib/widgets/pagination/pagination.component';
export * from './lib/widgets/pagination/pagination.service';

export * from './lib/widgets/passwordComplexity/passwordComplexity.component';

export * from './lib/widgets/updown/updown.component';

export * from './lib/helpers/tools.class';
like image 901
user7082181 Avatar asked Dec 08 '25 05:12

user7082181


1 Answers

In my Case removing the declare key word solve the build problem,

export declare class myClass{
    ...
}

Turns to

export class myClass{
    ...
}
like image 151
Masoud Bimmer Avatar answered Dec 10 '25 19:12

Masoud Bimmer



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!