8

I've created an Angular lib (mylib) using the cli and have created a symlink using npm link from the dist directory.

I've created an Angular app using the cli and have linked the lib using npm link mylib.

I am able to consume mylib from the app and use components, servics, etc. in the application.

After running "ng build --watch" on the lib and "ng serve" on the app, if I make a change to a .ts file in the lib and save, the lib will rebuild and then the app will rebuild and those changes are reflected in the application.

However, if I make a change to an html or scss file in the lib, it will build and and then the app will rebuild but those changes are NOT reflected in the application. The "ng serve" window does show that the vendor.js "chunk" changed but it also says "Warning in Emitted no files." right after. I should add that even if the template/styles are inline (in the ts component file) it will still not reflect those changes either.

When I use chrome dev tools and look at the sources, vendor.js is updated with the latest change to the template and styles args to the component.

The only way I can get the changes to show up is to terminate ng serve and run it again.

Windows 10, Angular 10, NPM 6.14.10, Node 14.15.4

Thanks in advance!

Mike
  • 665
  • 6
  • 14
  • I have exactly the same problem. Sorry I also found no solution. I tried everything with Ivy, no Ivy, Hrm and so forth. It seems kind of weird since HTML is part of the Js Bundle. And Typescript changes are working as expected. – bndamm May 28 '21 at 14:16
  • 1
    Did you ever find a solution to this? I'm seeing the exact same issue -- npm link work and my Angular application automatically running under ng serve refreshes when it detects changes from my library (which is running using ng build --watch), but those changes don't actually show up. If I terminate my ng serve and re-run it then my changes are visible. – JKasper11 Jun 15 '21 at 18:47

1 Answers1

0

If you update your paths in tsconfig.json it'll pick up the changes. I do not know what effect this has on published builds though. I haven't tested.

I have a lib called "core" and my paths looks like the following.

  "paths": {
    "core": [
      "projects/core/src/core-api",
      "dist/core/core",
      "dist/core"
    ],
},

"core-api" is where I have my components, services, and modules exported. The default name when using the angular cli is "public-api".

Tyler
  • 1,134
  • 1
  • 10
  • 12