# ng-packagr

> Compile and package Angular libraries in Angular Package Format (APF)

Latest version **22.1.1** (published 2026-08-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install ng-packagr
pnpm add ng-packagr
yarn add ng-packagr
bun add ng-packagr
```

Provides the command `ng-packagr`.

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads; no esm support.

## Facts

| | |
|---|---|
| Version | 22.1.1 |
| Published | 2026-08-04 |
| First published | 2017-05-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | ^22.22.3 \|\| ^24.15.0 \|\| >=26.0.0 |
| Dependencies | 20 |
| Unpacked size | 719.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 1858 |
| Author | David Herges |
| Maintainers | alan.agius4 |
| Keywords | apf, angular-package-format, angular, angular-library, angular-components, component-library, typescript, css, scss |

## Links

- npm: https://www.npmjs.com/package/ng-packagr
- Repository: https://github.com/ng-packagr/ng-packagr
- Issues: https://github.com/ng-packagr/ng-packagr/issues
- npm.io page: https://npm.io/package/ng-packagr

## Dependencies (20)

- [ajv](https://npm.io/package/ajv.md) ^8.17.1
- [ora](https://npm.io/package/ora.md) ^9.0.0
- [less](https://npm.io/package/less.md) ^4.2.0
- [rxjs](https://npm.io/package/rxjs.md) ^7.8.1
- [sass](https://npm.io/package/sass.md) ^1.81.0
- [esbuild](https://npm.io/package/esbuild.md) ^0.28.0
- [piscina](https://npm.io/package/piscina.md) ^5.0.0
- [postcss](https://npm.io/package/postcss.md) ^8.4.47
- [chokidar](https://npm.io/package/chokidar.md) ^5.0.0
- [commander](https://npm.io/package/commander.md) ^15.0.0
- [tinyglobby](https://npm.io/package/tinyglobby.md) ^0.2.12
- [browserslist](https://npm.io/package/browserslist.md) ^4.26.0
- [injection-js](https://npm.io/package/injection-js.md) ^2.4.0
- [jsonc-parser](https://npm.io/package/jsonc-parser.md) ^3.3.1
- [dependency-graph](https://npm.io/package/dependency-graph.md) ^1.0.0
- [@rollup/wasm-node](https://npm.io/package/@rollup/wasm-node.md) ^4.24.0
- [rollup-plugin-dts](https://npm.io/package/rollup-plugin-dts.md) ~6.4.1
- [@rollup/plugin-json](https://npm.io/package/@rollup/plugin-json.md) ^6.1.0
- [find-cache-directory](https://npm.io/package/find-cache-directory.md) ^6.0.0
- [@ampproject/remapping](https://npm.io/package/@ampproject/remapping.md) ^2.3.0

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 22.1.1 (latest) — 2026-08-04
- 22.2.0-next.6 (next) — 2026-09-10
- 22.2.0-next.5 — 2026-09-02
- 22.2.0-next.4 — 2026-08-26
- 22.2.0-next.3 — 2026-08-14
- 21.2.7 — 2026-08-04
- 21.2.6 — 2026-07-31
- 22.2.0-next.2 — 2026-07-29
- 22.2.0-next.1 — 2026-07-29
- 22.2.0-next.0 — 2026-07-29
- 22.1.0 — 2026-07-29
- 22.0.2 — 2026-07-24
- 22.1.0-rc.0 — 2026-07-24
- 22.1.0-next.4 — 2026-07-24
- 22.1.0-next.3 — 2026-07-01
- … 391 more at https://npm.io/package/ng-packagr/versions

## README

# ng-packagr

> Compile and package Angular libraries in Angular Package Format (APF)


[![npm](https://img.shields.io/npm/v/ng-packagr.svg?style=flat-square)](https://www.npmjs.com/package/ng-packagr)
[![npm License](https://img.shields.io/npm/l/ng-packagr.svg?style=flat-square)](https://github.com/ng-packagr/ng-packagr/blob/main/LICENSE)
[![CircleCI](https://img.shields.io/circleci/project/github/ng-packagr/ng-packagr/main.svg?label=Circle%20CI&style=flat-square)](https://circleci.com/gh/ng-packagr/ng-packagr)

[![GitHub stars](https://img.shields.io/github/stars/ng-packagr/ng-packagr.svg?label=GitHub%20Stars&style=flat-square)](https://github.com/ng-packagr/ng-packagr)
[![npm Downloads](https://img.shields.io/npm/dw/ng-packagr.svg?style=flat-square)](https://www.npmjs.com/package/ng-packagr)
[![Renovate enabled](https://img.shields.io/badge/renovate-enabled-brightgreen.svg?style=flat-square)](https://renovateapp.com/)

## Installation

```bash
npm install -D ng-packagr
```

## Usage Example

Let's walk through a _getting started_ that'll build an Angular library from TypeScript sources and create a distribution-ready npm package:
create a `ng-package.json` file and run `ng-packagr -p ng-package.json`
– Here we go:

```json
{
  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
   ...
}
```

You can easily run _ng-packagr_ through a npm/yarn script:

```json
{
  "scripts": {
    "build": "ng-packagr -p ng-package.json"
  }
}
```

Now, execute the build with the following command:

```bash
$ yarn build
```

The build output is written to the `dist` folder, containing all those _binaries_ to meet the Angular Package Format specification.
You'll now be able to go ahead and `npm publish dist` your Angular library to the npm registry.

Do you like to publish more libraries?
Is your code living in a monorepo?
Create one `package.json` per npm package, run _ng-packagr_ for each!

## Features

* :gift: Implements [Angular Package Format](https://angular.dev/tools/libraries/angular-package-format)
  * :checkered_flag: Bundles your library in FESM2022
  * :school_satchel: npm package can be consumed by [Angular CLI](https://github.com/angular/angular-cli), [Webpack](https://github.com/webpack/webpack), or ESM Bundlers
  * :dancer: Creates type definitions (`.d.ts`)
* :mag_right: Creates [scoped and non-scoped packages](https://docs.npmjs.com/misc/scope) for publishing to npm registry
* :surfer: Inlines Templates and Stylesheets
* :sparkles: CSS Features
  * :camel: Runs [SCSS](http://sass-lang.com/guide) preprocessor, supporting custom include paths
  * :monkey: Adds vendor-specific prefixes
  * :tiger: Embed assets data


## How to…
- [Copy Assets](docs/copy-assets.md)
- [Embed Assets in CSS](docs/embed-assets-css.md)
- [Managing Dependencies](docs/dependencies.md)
- [Change the Entry File of a Library](docs/entry-file.md)
- [Change Configuration Locations](docs/configuration-locations.md)
- [Override tsconfig](docs/override-tsconfig.md)
- [Use PostCSS](docs/postcss-config.md)
- [Add Style Include Paths](docs/style-include-paths.md)
- [Package Secondary Entrypoints (sub packages)](docs/secondary-entrypoints.md)

## Knowledge

[Angular Package Format documentation](https://angular.dev/tools/libraries/angular-package-format)

Packaging Angular Libraries - Jason Aden at Angular Mountain View Meetup ([Jan 2018, 45min talk](https://www.youtube.com/watch?v=QfvwQEJVOig&t=3612s))

Create and publish Angular libs like a Pro - Juri Strumpflohner at NG-BE ([Dec 2017, 30min talk](https://youtu.be/K4YMmwxGKjY))

[![Juri Strumpflohner - Create and publish Angular libs like a Pro](https://img.youtube.com/vi/K4YMmwxGKjY/0.jpg)](https://youtu.be/K4YMmwxGKjY)

Packaging Angular - Jason Aden at ng-conf 2017 ([28min talk](https://youtu.be/unICbsPGFIA))

[![Packaging Angular - Jason Aden](https://img.youtube.com/vi/unICbsPGFIA/0.jpg)](https://youtu.be/unICbsPGFIA)


Create and publish Angular libs like a Pro - Juri Strumpflohner at ngVikings, this time demoing building Angular libraries with ng-packagr, with NX as well as Bazel ([March 2018, 30min talk](https://youtu.be/Tw8TCgeqotg))

[![Juri Strumpflohner - Create & Publish Angular Libs like a PRO at ngVikings](https://img.youtube.com/vi/Tw8TCgeqotg/0.jpg)](https://youtu.be/Tw8TCgeqotg)

## Contributing to ng-packagr

[General contribution guidelines](./CONTRIBUTING.md)

If you like to submit a pull request, you'll find it helpful to take a look at the [initial design document where it all started](./docs/DESIGN.md).

To orchestrate the different tools, ng-packagr features a [custom transformation pipeline](docs/transformation-pipeline.md#a-transformation-pipeline). The transformation pipeline is built on top of RxJS and Angular Dependency Injection concepts.

---
_Source: https://npm.io/package/ng-packagr · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._