Angular-cli: NPM LINK does not work with angular app generated by angular cli

Created on 18 Jan 2018 · 4Comments · Source: angular/angular-cli

I am trying to use npm link to develop my angular app as an custom shared npm module and consume it in another angular app. Please let me know if I am missing something here.

angular cli verion: 1.6.3

   _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/

Angular CLI: 1.6.3
Node: 8.9.4
OS: win32 x64
Angular: 5.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.3
@angular-devkit/build-optimizer: 0.0.38
@angular-devkit/core: 0.0.25
@angular-devkit/schematics: 0.0.48
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.3
@schematics/angular: 0.1.13
@schematics/schematics: 0.0.13
typescript: 2.4.2
webpack: 3.10.0

`node --version: v8.9.4` and `npm --version : 5.6.0`.
Windows 10
VsCode  1.19.1 ( 64 bit)

Repro steps

SAMPLE APP ATTACHED HERE
npm-link-with-angular-app.zip

Step 1
Unzip the attached file
open lib app in vs code and run below script

npm install
ng build 
cd dist
npm link
````

*   STEP 2
Open website app in vscode and run below script

npm install
npm link greeter-app
ng build

### Observed behavior

PS Z:rupeshrndng-linkwebsitewebsite> ng build
Date: 2018-01-18T18:22:00.448Z
Hash: 5ece352c69fd79907b40
Time: 3754ms
chunk {inline} inline.bundle.js, inline.bundle.js.map (inline) 5.83 kB [entry] [rendered]
chunk {main} main.bundle.js, main.bundle.js.map (main) 303 bytes [initial] [rendered]
chunk {polyfills} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 323 bytes [initial] [rendered]
chunk {styles} styles.bundle.js, styles.bundle.js.map (styles) 11.4 kB [initial] [rendered]

ERROR in src/app/app.module.ts(6,29): error TS2307: Cannot find module 'greeter-app'.

PS Z:rupeshrndng-linkwebsitewebsite>
```

Desired behavior

IT should be able to link with my greet-app and I can import greet module and use the component from the greet-app.
Use case: I want to create on lib app where I will put some modules (feature module) which I want to consume in another angular app. However I want to locally test this using npm link.
I expect to see: I should be able to use npm link in my website app and consume lib app.

Mention any other details that might be useful (optional)

I have attached my sample app please download the zip file unzip it and open lib and website 2 apps in 2 different VsCode editor and then just do npm install and run npm link.

Source

rupeshtiwari

Most helpful comment

Such a sad solution though......... :-1:

aemonge on 25 Jul 2018

👍13

All 4 comments

Hi anyone doing npm link with angular project generated via angular cli can suggest the work around or point out any mistakes that might be happening is welcome.

rupeshtiwari on 19 Jan 2018

Hi,

We don't support Library building with the CLI right now. We do support linking libraries built properly inside a CLI application.

Closing this as it's not supported.