Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem to import module #14

Closed
raphdom opened this issue Aug 3, 2017 · 15 comments
Closed

Problem to import module #14

raphdom opened this issue Aug 3, 2017 · 15 comments

Comments

@raphdom
Copy link

raphdom commented Aug 3, 2017

I install the od-virtualscroll using:

yarn add od-virtualscroll

But when I try to import the module on my own module doesn't find it:

import {VirtualScrollModule} from 'od-virtualscroll';

"Cannot find module od-virtualscroll'

I have my code using angular-cli and angular4

Can anyone help me, certainly I'm doing something wrong

@dhormale
Copy link

dhormale commented Aug 7, 2017

Getting same error on
npm i -S od-virtualscroll OR npm install od-virtualscroll --save

FYI...

npm install od-virtualscroll --save
+-- UNMET PEER DEPENDENCY @angular/[email protected]
+-- UNMET PEER DEPENDENCY @angular/[email protected]
`-- [email protected]

@dinony
Copy link
Owner

dinony commented Aug 8, 2017

I had a problem with ngc upgrading from 4.1 to 4.2 - in summary: the ngc's output differed from 4.1, so the build was broken. I'm pretty sure this is related to this issue. I hope to get some spare hours to look into this again this week.

@dinony dinony added this to the Upgrade library milestone Aug 10, 2017
@ronzeidman
Copy link

@dinony
Copy link
Owner

dinony commented Aug 14, 2017

Thanks a lot! Will check it this week.

@JBorgia
Copy link

JBorgia commented Aug 16, 2017

Running into the same problem here. Haven't yet had a chance to try it, but definitely enthused to see it in action. Thanks ahead of time, Dinony!

@dinony
Copy link
Owner

dinony commented Aug 18, 2017

Issue / Observation

I'm using the recommended angularCompilerOptions (see tsconfig.json)
with the flatModuleOutFile option to create a fesm.

  • ngc v4.1.3 does output a fesm file
  • ngc >=4.2 does not output a fesm file

Quickfix

As a quick fix to this issue, I've published v1.0.1 of the lib with compilation relying on v4.1.3 of ngc. For the lib, the peer dependencies are set to >=4.

I've tried to use the lib with the latest Angular version (currently 4.3.5) and it worked. As a proof, I've updated od-vsstatic to Angular 4.3.5 and will also update all the other demos.

Help

Unfortunately, I could not find good documentation on ngc and for me it is currently just a beautiful time sink to find out what the actual problem is - therefore the quickfix with 4.1.3. Furthermore, there seem to be regressions in ngc >= 4.2.

In the long term, I obviously want to upgrade to the newest ngc version.

ngc

If somebody has a clue what's going on in ngc >= 4.2 and why the output differs, I'm very thankfull for hints.

Test

I'm also very thankful if somebody tests the new release with the newest Angular version, both using npm and yarn, as extra confirmation.

Thanks!

@ronzeidman
Copy link

Works for me (AOT, angular 4.3.5, npm 5.3.0, node 8.4.0)

@dinony
Copy link
Owner

dinony commented Aug 23, 2017

Thanks! Haven't heard from the others, yet. I assume it is silently working - so closing this issue for now.

@dinony dinony closed this as completed Aug 23, 2017
@JBorgia
Copy link

JBorgia commented Aug 23, 2017

Working here as well

@dhormale
Copy link

Worked for me...
angular/compiler: ^4.0.1
angular/cli: 1.2.7
node: v6.11.2
npm: 3.10.10

@raphdom
Copy link
Author

raphdom commented Aug 25, 2017

Worked for me as well, thanks a lot.

@kenisteward
Copy link

kenisteward commented Oct 17, 2017

@dinony I recently came into this issue and resolve it with something very silly. It seems for the main/module/es2015/typings fields in package.json for compiler over 4.2 you need to give the full relative path e.g.

Your Package.json

  "main": "dist/bundles/od-virtualscroll.umd.js",
  "typings": "dist/fesm15/od-virtualscroll.d.ts",
  "module": "dist/fesm5/od-virtualscroll.js",
  "es2015": "dist/fesm15/od-virtualscroll.js"

becomes

  "main": "./dist/bundles/od-virtualscroll.umd.js",
  "typings": "./dist/fesm15/od-virtualscroll.d.ts",
  "module": "./dist/fesm5/od-virtualscroll.js",
  "es2015": "./dist/fesm15/od-virtualscroll.js",

I know this might seem odd but i made these changes and i was able to use FESM's in another internal project with my library being set that way. If you want I can try it with your library or you can do it and let me know if it worked.

As an added note. The typescript team prefers "types" over "typings" but they do the same thing I believe. I just don't know if it will be deprecated or is already.

@dinony
Copy link
Owner

dinony commented Oct 19, 2017

@kenisteward AH strange! Thanks a lot, will give it a try this week.. hope it will work!

Yep, "types" seems to be the preferred/default property. In the Module Resolution section of the TS docs they use types. In the Angular Package Format 4.0 spec "typings" is used.
I think I will switch to "types".

@dinony
Copy link
Owner

dinony commented Oct 24, 2017

@kenisteward I think I misunderstood what you were saying. You had problems consuming this lib and fixed it by changing it's package.json file by specifying the relative paths as stated? If so, I don't think that this is related to the initial issue here.

The problem here was (afaik) that ngc >= 4.2 did not produce a fesm, like ngc 4.1 did before, in this project setup. So, my initial reaction was to limit this package to Angular peer dependecies >=4.1<4.2, which, of course, let to the issues described initially. Then I noticed that the compiler output of ngc 4.1 can be used in Angular projects >=4.1 - which led to the quickfix described above.

Does somebody know, is there any specification of ngc or @angular/compiler-cli, where we could learn about the compatibility of the compiler output or about possible breaking changes due to recompilation? Last night I experimented with the latest Angular version (4.4.6) and ngc produced the correct outputs as expected. I would like to make a new release with the new compiler, but I would like to learn more about the compatibility.
E.g. When I compile the lib with v4.4.6, will it be usable in projects <4.4.6?
This needs quite some black-box testing to get some certainty :/

@kenisteward
Copy link

kenisteward commented Oct 26, 2017

@dinony I didn't try to consume this library. I've created on my own library and was having the same issues you were. I fixed my issues by adding those changes and thought that might help your issues with compiler >=4.2. I'm compiling mine with compiler 4.4.6 and consuming it with an Angular 4.1.3 app and I'm having no troubles.

As far as I could tell the only difference was changing that path in the package.json so consuming the app properly finds the files it is looking from.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants