Migrate Angular functions to common library

Question

Our Angular project has evolved to have a bunch of functions that don't really belong in any class (in addition to all the normal classes of course). We now need a new Angular project that wants to also use some of these functions. These are all private and will never be in a public repo

I've made a new project and am using it but all the imports look like

import { func1 } from "common-library"

i.e. there's no concept of a namespace here.

How do I structure this such that I end up with something like

import { func1 } from "common-library/functionset1"
import { func1 } from "common-library/functionset2"

And ditto for the classes. I want to to avoid the possibly of a class with a generic name like Item causing a conflict in the future

I've made a new project Could you elaborate? Did you follow the steps in the docs to create a new Angular library, based on ng-packagr? — JSON Derulo
– JSON Derulo, Commented Oct 17, 2024 at 10:46
I can't see anything in that doc to answer my specific question. The guide I followed was dev.to/jsanddotnet/…. To be clear, the library was created using "ng generate library ..." — tony
– tony, Commented Oct 17, 2024 at 10:49
ng generate library creates a library based on ng-packagr. What you are looking for are secondary entry points: github.com/ng-packagr/ng-packagr/blob/main/docs/… — JSON Derulo
– JSON Derulo, Commented Oct 17, 2024 at 10:56
That does look like what I'm after. I'll read up and play with that before I go any further. Thanks! — tony
– tony, Commented Oct 17, 2024 at 10:59

JSON Derulo · Accepted Answer · 2024-10-17 11:16:12Z

1

You can achieve this with secondary entry points. To create one, make sure to follow this folder structure:

common-library
├── src
|   ├── public_api.ts
|   └── *.ts
├── ng-package.json
├── package.json
└── functionset1
    ├── src
    |   ├── public_api.ts
    |   └── *.ts
    └── ng-package.json
└── functionset2
    ├── src
    |   ├── public_api.ts
    |   └── *.ts
    └── ng-package.json

The content of the ng-package.json file inside functionset1 and functionset2 can be simply {}.

Also make sure that your common-library/src/public_api.ts file exports something, even if you don't have anything to export. Otherwise there will be a build error, see this GitHub issue. For example:

export const emptyPackage = true;

answered Oct 17, 2024 at 11:16

JSON Derulo

18.9k11 gold badges63 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Migrate Angular functions to common library

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related