tessl/npm-ng-packagr

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

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Pending

The risk profile of this skill

Overview

Eval results

Files

Configuration

Name: tessl/npm-ng-packagr
Author: tessl

ng-packagr supports comprehensive configuration through JSON files and programmatic options, with JSON schema validation for both package and entry point configurations.

Capabilities

NgPackagr Options

Primary configuration options for controlling the build process.

interface NgPackagrOptions {
  /** Whether or not ng-packagr will watch for file changes and perform an incremental build */
  watch?: boolean;
  /** Enable/disable build caching (default: true except in CI environments) */
  cacheEnabled?: boolean;
  /** Custom cache directory path (default: auto-detected system cache) */
  cacheDirectory?: string;
  /** Enable and define the file watching poll time period in milliseconds */
  poll?: number;
}

Usage Examples:

import { ngPackagr } from "ng-packagr";

// Build with caching disabled
await ngPackagr()
  .forProject('./ng-package.json')
  .build({
    cacheEnabled: false
  });

// Watch mode with custom poll interval
await ngPackagr()
  .forProject('./ng-package.json')
  .build({
    watch: true,
    poll: 2000
  });

CLI Arguments

Configuration options when using ng-packagr from the command line.

interface CliArguments {
  /** Path to the project file 'package.json', 'ng-package.json', or 'ng-package.js' */
  project: string;
  /** Whether or not ng-packagr will watch for file changes and perform an incremental build */
  watch?: boolean;
  /** Path to a tsconfig file */
  config?: string;
  /** Enable and define the file watching poll time period in milliseconds */
  poll?: number;
}

Configuration Files

ng-package.json

Main configuration file for Angular packages. Based on the NgPackageConfig schema.

Example ng-package.json:

{
  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
  "dest": "dist/my-library",
  "deleteDestPath": true,
  "lib": {
    "entryFile": "src/public_api.ts",
    "cssUrl": "inline"
  },
  "assets": [
    "src/assets/**/*"
  ],
  "allowedNonPeerDependencies": [
    "lodash",
    "rxjs"
  ]
}

Key Configuration Properties:

dest (string): Destination folder for distributable binaries (default: "dist")
deleteDestPath (boolean): Delete output path before build (default: true)
lib.entryFile (string): Entry file to the public API (default: "src/public_api.ts")
lib.cssUrl (string): CSS URL handling - "none" or "inline" (default: "inline")
assets (array): List of files to copy into the package
allowedNonPeerDependencies (array): Dependencies allowed in dependencies/devDependencies
keepLifecycleScripts (boolean): Keep 'scripts' section in package.json (default: false)

ng-entrypoint.json

Configuration file for secondary entry points in Angular libraries.

Example ng-entrypoint.json:

{
  "$schema": "../../node_modules/ng-packagr/ng-entrypoint.schema.json",
  "lib": {
    "entryFile": "src/secondary/public_api.ts",
    "flatModuleFile": "secondary-module",
    "cssUrl": "inline"
  }
}

Configuration in package.json

ng-packagr configuration can be embedded directly in package.json:

{
  "name": "my-angular-library",
  "ngPackage": {
    "dest": "dist/my-library",
    "lib": {
      "entryFile": "src/public_api.ts"
    }
  }
}

Advanced Configuration

TypeScript Configuration

Custom TypeScript configuration can be provided:

import { ngPackagr } from "ng-packagr";

// With custom tsconfig file
await ngPackagr()
  .forProject('./ng-package.json')
  .withTsConfig('./tsconfig.lib.json')
  .build();

// With programmatic TypeScript config
await ngPackagr()
  .forProject('./ng-package.json')
  .withTsConfig({
    compilerOptions: {
      target: 'ES2022',
      lib: ['ES2022', 'DOM']
    }
  })
  .build();

Caching Configuration

Build caching can be configured programmatically:

import { ngPackagr } from "ng-packagr";

await ngPackagr()
  .forProject('./ng-package.json')
  .build({
    cacheEnabled: true,
    cacheDirectory: './custom-cache-dir'
  });

The cache directory defaults to: