Uniswap / Uniswap/interface

Package management: import from ethers

Open
#3,085 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

refactor
Dominant language
TypeScript
Stars
5.5k
Forks
5.4k
PR merge metrics
No merged PRs in 30d

Description

@ethersproject's are added to deps via ethers, but imported directly. This was done to improve tree-shaking, but it is making bundling the lib more complicated.

Instead, if tree-shaking works by depending directly on ethers, we should do that instead.

Context (and motivation), from Slack:
image

it’s the @ethersproject stuff - and because @ethersproject has its own dependencies, those are being listed as well. The regex is a little off (my mistake), and so the subfolder for @ethersproject is unlisted.
What’s happening is that interface devDepends on ethers, not @ethersproject. ethers then depends on nearly every @ethersproject. Even if you move ethers to deps (vs devDeps), microbundle cannot handle the indirect dependency.
The fix here isn’t my favorite: you need to identify exactly which @ethersproject subfolder you’re depending on directly, and add it to deps. The other deps are indirect, and so should go away once you do that. The best way I know to do that is just manual inspection 🤷
Example: https://github.com/Uniswap/interface/pull/3080/commits/7702a2aa750517e8aae64353cf58f7065b0ec03b
8:15
The root issue - I think - is that ethers works because of a hack: it includes all the other @ethersprojects as deps, so they’re included and just tree-shaken out. However, microbundle won’t tree-shake unless something is explicitly listed as a dependency, and ethers is the dependency here, not @ethersproject. It might actually work better if we import from ethers - I haven’t tried that; we’re currently importing from @ethersproject because I thought it was tree-shaking better with interface (see https://github.com/Uniswap/interface/blob/5413303d24bdaadb6a16654f5108cbdd83ad43c6/.eslintrc.json#L65-L68).

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the direct-import and dependency configuration referenced in .eslintrc.json, then compare the dependency changes in pull request 3080 commit 7702a2. Determine whether importing from ethers or listing the directly imported @ethersproject subfolders produces a bundle microbundle can handle. Done means the dependency declarations match the direct imports and the library bundles with the intended tree-shaking behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
build-system, tooling
Issue type
Refactor
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
32/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.