Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including ngx-library-assets with all npm packages installed. Try it out:

ngx-library-assets lists no main file and has no index.js, so it can't be directly required. If this is a mistake, please let us know. It may however contain internal files that you can require manually:

require("@angular/cli/package.json"); // @angular/cli is a peer dependency. // require("ngx-library-assets/[??]")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

ngx-library-assets v1.0.2

Angular builders to include assets from libraries into applications


Angular builders to include assets from libraries into applications

Why use this

When changing files within a monorepo, it's best to keep affected projects to a minimum. Assets for libraries are not automatically copied when building the application that depend on them. A change to angular.json is mostly ruled as a change affecting every project in the monorepo. To reduce the need to alter angular.json every time a new library is needed for an application, and to avoid creating 'shared' libraries with assets, this package can be used. With this package, the libraries can keep their assets in their own source. Including assets from an existing library into an application is as easy as to update 1 file in that application, making it the only affected application.

How to use this

  1. Install using yarn or npm: yarn add -D ngx-library-assets
  2. In angular.json:
  • set the builder for the serve target to ngx-library-assets:dev-server
  • set the builder for the build target to ngx-library-assets:browser
  1. In your application, add an include.json file inside src/assets
  "$schema": "<relative path to node_modules>/ngx-library-assets/include-schema.json",
  "libs": [
      "name": "<name of library>",
      "assetsRoot": "<boolean, optional, default = false>"


The name of the Angular project to include assets from. This should be the name of the project as it is described in angular.json. If this name is not found in the workspace, a warning will appear in the console.


When set to false or absent, all assets of that library will be placed in subfolders. This means, all files will be placed in /assets/<lib-project-name> keeping their folder structure.

When set to true, all assets of that library, apart from translations will be placed in the assets type root folder. This means, all files (except folder i18n) will be placed in /assets/images keeping their folder structure. But the content of folder i18n will still be placed in /assets/<lib-project-name>/i18n Be careful that the assets don't have the same names, they will overwrite each other.


This repository contains an example workspace with a basic Angular application and 2 libraries. The shared library has option assetsRoot set to true. The my-lib library has option assetsRoot absent (default = false). The application's include.json also mentions an non-existing library, named example-non-existing-lib. To run the example project, cd into example and run npm install and then npm start.

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free