angularnpm-link

npm link to project with multiple libraries that reference each other


We have a core project in Angular that contains 19 libraries. Many of these libraries reference other libraries in the core project. Normally, this is published and my Angular project installs the libraries that it needs.

I need to test something in one or more of the core libraries from my application. I have set up a link command to link all of these libraries and can see the changes in my application's node_modules folder. I can also see the list of core libraries when I run npm ls -g --link So I know that my application is linking to each of these libraries as expected. However, when I attempt to build or start my application, I get a list of errors on every import in each core library that references another core library.

For example, @core/B imports components from @core/A. Both @core/A and @core/B are linked to the app. When I attempt to build the app, I receive the following error: ../../../../Core/Core/dist/core/b/lib/my_folder/my-component.component.d.ts:4:34 - error TX2307: Cannot find module '@core/a' or its corresponding type declarations. import { AnotherComponent } from '@core/a';

Besides linking these items, what else do I need to do to allow core projects to reference each other without rewriting anything in the core project?

Thanks in advance!


Solution

  • To get this to work, the angular.json file needs to have "preserveSymlinks": true under the architect/build/options of the app.