use library in angular-cli app

[BernhardRode]

Hi Minko,

I want to develop a "library" and use it in a standard angular-cli app. Using the library installed as a dependency, works like a charm. Linking it via yarn/npm throws

So first of all i got the current angular-cli

➜ npm install -g angular-cli@1.0.0-beta.26 yarn

Set up a default angular-cli based demo

/developer/src

➜ ng new demo --skip-npm --skip-git
[.... a lot of output....]

/developer/src/demo

➜ yarn
[.... a lot of output....]
➜ yarn add ngresizable
[.... a lot of output....]
➜ yarn start
yarn start v0.19.1
$ ng serve
** NG Live Development Server is running on http://localhost:4200. **
Hash: 0479f21a0ad77b2f6a7b
Time: 5941ms
chunk {0} main.bundle.js, main.bundle.map (main) 1.9 kB {2} [initial] [rendered]
chunk {1} styles.bundle.js, styles.bundle.map (styles) 10.1 kB {3} [initial] [rendered]
chunk {2} vendor.bundle.js, vendor.bundle.map (vendor) 2.51 MB [initial] [rendered]
chunk {3} inline.bundle.js, inline.bundle.map (inline) 0 bytes [entry] [rendered]

===> Works ....

Now to the problem =)

/developer/src/ngresizable

➜ yarn link
yarn link v0.19.1
success Registered "ngresizable".
info You can now run yarn link "ngresizable" in the projects where you want to use this module and it will be used instead.
✨ Done in 0.14s.

/developer/src/demo

➜ demo yarn link "ngresizable"
yarn link v0.19.1
success Registered "ngresizable".
✨ Done in 0.15s.

No try to start the server

/developer/src/demo

➜ yarn start
yarn start v0.19.1
$ ng serve
** NG Live Development Server is running on http://localhost:4200. **
Hash: 0479f21a0ad77b2f6a7b
Time: 5941ms
chunk {0} main.bundle.js, main.bundle.map (main) 1.9 kB {2} [initial] [rendered]
chunk {1} styles.bundle.js, styles.bundle.map (styles) 10.1 kB {3} [initial] [rendered]
chunk {2} vendor.bundle.js, vendor.bundle.map (vendor) 2.51 MB [initial] [rendered]
chunk {3} inline.bundle.js, inline.bundle.map (inline) 0 bytes [entry] [rendered]

ERROR in Error encountered resolving symbol values statically. Could not resolve ngresizable relative to /developer/src/demo/src/app/app.module.ts., resolving symbol AppModule in /developer/src/demo/src/app/app.module.ts, resolving symbol AppModule in /developer/src/demo/src/app/app.module.ts

ERROR in ./src/app/app.module.ts
Module build failed: Error: /developer/src/demo/src/app/app.module.ts (6,35): Cannot find module 'ngresizable'.)
at _checkDiagnostics (/developer/src/demo/node_modules/@ngtools/webpack/src/loader.js:145:15)
at /developer/src/demo/node_modules/@ngtools/webpack/src/loader.js:172:17
@ ./src/main.ts 5:0-45
@ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts
webpack: bundle is now VALID.

I tried to fix this for some days now... but i can't get my head around, whats missing....

Maybe you have some ideas...

Thanks

[mgechev]

The package's content distributed in npm contains all the assets from the dist directory. If you create a symlink to ngresizable instead of ngresizable/dist, npm/yarn will not be able to resolve the package.

Let me know if this helps.