ethers.js: Build fails with latest Angular

Ethers Version

6.1.0

Search Terms

angular

Describe the Problem

Typescript shows this error when compiling:

Error: node_modules/ethers/types/providers/provider-ipcsocket.d.ts:1:23 - error TS1452: 'resolution-mode' assertions are only supported when `moduleResolution` is `node16` or `nodenext`.

1 /// <reference types="node" resolution-mode="require"/>

moduleResolution node16 or nodenext are not working with official angular setup & node is currently a default for new angular project. & due to this error build command is failing.

& as a workaround I have added "skipLibCheck": true in tsconfig.

Code Snippet

No response

Contract ABI

No response

Errors

No response

Environment

node.js (v12 or newer)

Environment (Other)

Angular CLI

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Comments: 33 (13 by maintainers)

Most upvoted comments

FYI, there is now an Angular environment CI test, thanks to your work. So, the CI will fail if there are any future issues building an Angular app.

See: https://github.com/ethers-io/ethers.js/blob/main/.github/workflows/test-env.yml#L56

Thanks! 😃

That version is still 3 months old, but it is likely fine. But if you look through the entire lock file, there are some places that specify a 5 year old (!!) version of babel. I’m not sure which dependency it pulls asyncToGenerator from, and that is the dependency to keep an eye on.

Tomorrow I will make a few small changes locally to verify that is the problem and will also create a smaller proof-of-concept to demonstrate if it is the problem.

I don’t know Angular, so I’m just reading through their code as best I can.

Oh, the node16 just gets rid of the warning re: reference types="blah" and the "type": "module" gets rid of the commonjs warning. Those are just warnings, so I’m not worried about them.

Those are separate from the this._getOptions problem.

When I looked at the package-lock they use all sorts of old versions of babel across their dependencies. It might just be a matter of updating whichever dependency is responsible for the asyncToGenerator compiler. I’m not exactly sure where that is yet.

I don’t really understand how this isn’t a larger problem for them; surely ethers can’t be the only library that uses arrow functions inside a method? :p

Weird. I’m not even sure why it injects that line. The other .d.ts files don’t seem to have that; perhaps due to the net package? I’ll look into this.

because this module use lib ā€œnetā€ which is belong node lib

Sure, here are the steps:

  • Install Angular CLI: npm install -g @angular/cli
  • Generate new app using: ng new ethers-test-app
  • Run yarn/npm start to see if app is working
  • install ethers yarn add ethers or npm i ethers & import ethers lib in app.component.ts
  • Run yarn/npm start again to see compile error due to ethers import
  • Replace the content of app.component.ts & app.component.html with content in sample repo https://github.com/aksdevac/test-ethers-v6-angular/tree/main/src/app
  • Add skipLibCheck true in tsconfig.json to get rid off compile error
  • Run app again & click on Connect button to see the error.

& ethers is not in package lock because I installed it using yarn, forgot to add package-lock in .gitignore.