Consuming your library in a local application during development, WebpackDevServer example

Tried to preview a module with npm link on a project that uses not AngularCLI (as it is a Hybrid ng1-ng2 app), but a WebpackDevServer. Everything rebuilds on new package build.

But when page refreshes with built version of package - getting an Error: Unexpected value '[object Object]' imported by the module 'AppModule'. Please add a @NgModule annotation., which is fixed under AngularCLI, by adding --preserve-symlinks flag to ng serve.

Exact same version works great, when built -> pushed to GitHub -> npm upgrade package_name into project.

Maybe you can advice a solution for a Webpack in this case? Would be also great to have a knowledge on Why this is happening.

[raphael-volt]

In .angular-cli.json add:

"defaults": {
    "styleExt": "css",
    "component": {},
    "build": {
      "preserveSymlinks": true
    }
  }

From https://github.com/angular/angular-cli/issues/6195

[RubenVermeulen]

I think be woth missed this in de docs.

" If you get Error: Unexpected value ‘[object Object]’ imported by the module ‘AppModule’. Please add a @NgModule annotation., then try:

$ ng serve --preserve-symlinks

to make sure the consuming application searches for the peer dependencies in the application’s node_modules directory."