Angular serve library

Question

In latest versions of Angular cli, we can use ng g library lib-name command to create library. As mentioned in the Angular docs :

ng serve <project>

And:

<project>   The name of the project to build. Can be an app or a library.

So, we can serve library. But when I serve I get the following errors:

Project 'ngx-tab-component' does not support the 'serve' target.
Error: Project 'ngx-tab-component' does not support the 'serve' target.
at ServeCommand.initialize (C:\Users\vahidnajafi\angular\ngx-tab-app\node_modules\@angular\cli\models\architect-command.js:53:19)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
at Function.Module.runMain (module.js:695:11)
at startup (bootstrap_node.js:191:16)
at bootstrap_node.js:612:3

Answer 1

You can update path in main tsconfig.json from

"paths": {
  "library": {
    "dist/library"
  }
}

to

"paths": {
  "library": {
    "projects/library/src/public-api"
  }
}

Then you don't need to start separate build for your library and rebuild also works.

Answer 2

The project where you generate your library in serves as a host to debug and test it.

Simply import your library in your host application module, make sure all dependencies are available and serve the host application. All changes you make inside your library are directly live reloaded into your host application.

Note: You have to import projects/foo-lib/src/public_api, not 'dist/foo-lib' though

Use your official library name, for example @foo/foo-library, angular will find it in the correct location.