手把手复刻 Uniswap V2：从部署合约到前端跑起来，一次打通全链路
文章目录
引言
在把 Uniswap V2 的 Interface 跑起来之前，很多人卡的并不是“前端怎么启动”，而是合约地址、链参数和 SDK 常量这些最容易被忽略、但一旦错了就会全盘崩掉的基础配置：Factory/Router/WETH/Multicall 到底在哪里查？不同链的合约地址怎么对齐？INIT_CODE_PAIR_HASH 为什么必须从你自己的 Pair bytecode 推出来？SDK 里哪些常量必须同步修改，前端又需要额外适配哪些配置（浏览器链接、supportedChainIds、tokenlist、多链 multicall 等）？
一、路由合约地址
（1）进入以太坊区块链浏览器，快速找到 Uniswap V2 路由合约地址
（2）下滑，找到 Uniswap V2: Router 2，这个就是路由合约
二、WETH 合约 和 工厂合约地址
（1）点击 Contract 可以看到开源的合约信息，然后在 Read Contract 里面，点击，获取合约中读方法的值，就是我们需要的合约地址了。
（2）打开合约地址，找到这三个地址的源代码，然后把这三个合约的源代码进行复制，然后分别新建到对应的文件中去
三、 Multicall 合约
四、合约代码进行编译
将以上四个合约的源码复制下来，打开 Remix，新建文件夹和四个合约文件，进行编译
注意：
在 Remix 上编译的时候，记得看一下以太坊区块链浏览器每个合约的编译版本，gas 优化数，记得对照着写
五、部署合约
（一）部署工厂合约
（1）选择要部署哪条区块链，可以在 Chainlist传送🚪 里面去看，并添加到钱包里去。这里我选择了以太坊的 Sepolia 测试网，大家可以自行选择
（2）打开工厂合约，在主合约里面添加这行代码，能够读取出 配对合约的 byteCode，编译出来的哈希值
bytes32 public constant INIT_CODE_PAIR_HASH =
keccak256(abi.encodePacked(type(UniswapV2Pair).creationCode));
（3）构造函数中的 _feeToSette 手续费设置员，设置为自己当前这个合约地址
（4）展开部署好的合约，调用 INIT_CODE_PAIR_HASH 常量，将32位的 hash 值，复制到路由合约的 hex 里面去，注意要把 0x 去掉
（二）部署 WETH 合约
这里是直接部署一个自己的 WETH 合约，没有去找官方的 WETH 合约
（三）部署路由合约
（四）部署 Multicall 合约
六、获取前端 Interface
找到干净的 V2 版本，日期为 2020年9月1日（传送🚪）
七、前端修改 SDK
（1）找到前端的 SDK，日期为 2020年8月6日（传送🚪）
（2）将这两个文件下载到本地代码编译器中
（3）将刚刚部署的路由合约地址、INIT_CODE_HASH，复制到此文件里面，记得保存哦
（4）修改 链 id，增加 Sepolia 的链 id
（5）修改刚刚部署的 WETH 的合约地址
（6）进入 v2-sdk 的文件夹目录，进行安装依赖
输入
npm i 或 npm install 
八、修改前端 Interface
（1）把链 id 新增至 index.ts 文件中
（2）将 Muliticall 合约复制到这里面来
（3）安装前端 interface 代码的依赖
（4）访问 Uniswap v2 的 tokenlist 列表（传送🚪）
可以将这个 json 文件 下载下来，放进 public 目录下。
我们可以把 这个 json 文件，放到 Github 里面，通过 raw 去读取。或者找到一个服务器去存放，墙内地址去存放这些代币信息，这样就有一个链接可以往在这里面，我们是直接把 tokenlist 放在 lists.ts 文件里面的，但是需要修改 token 列表的时候，前端需要重新部署
（5）复制到 lists.ts 文件中去，注意需要加 `` 把 json 变为字符串数组
（6）导出 Sepolia 链 id
（7）找到 Sepolia 浏览器的域名 ，复制 https://sepolia.etherscan.io/tx 部分
（8） 在二级域名里，把 Sepolia 的新增进来
如果不是以太坊兼容链，那么需要修改
九、发布 npm 包
（1）注册 npm 并登录
（2）进入到 sdk 的目录下，输入 npm login 进行登录
（3）修改 package.json 的 name，不能有重名的，否则会发布失败
版本号这里 改成了 1.0.0 因为是第一次提交
可通过此命令去查询包名是否有重复，没有就可以用
npm view yoona1020-sepolia-sdk name version --json
（4）进行 npm pubilsh 之后，发现失败了，没有 token
（5）我们去 npm 官网，生成一个新的 token
Packages: Read and write Scope 覆盖
All packages（或至少覆盖你要发的包）
（6）输入 notepad $env:USERPROFILE.npmrc
将生成的 token 复制进去，记得保存
注意：不要加引号；也不要把 token 写到项目目录的 .npmrc，优先写在用户目录
（7）验证 token 是否成功
npm whoami 能输出你的 npm 用户名：说明认证成功
npm ping 返回 pong：说明能正常连 registry
（8）发布成功，但是我的包名改成了 scope 包 再发布的，注意看我的 name 的值，发布为：@你的用户名/包名。这类包通常更不容易被当作垃圾包，同时也更符合“个人 fork/练习版本”的发布语义。
下次发布的时候，只需要改版本号，进行发布就好啦
十、修改前端 Interface，使用新的 npm 包
（1）注意进入 interface 的目录，然后移除 uniswap 的包
（2）拷贝自己的包名，进行安装包，将 uniswap 的 sdk，换成我们自己发布的 sdk 了。
（3）将 uniswap 的 sdk 全部替换成我们的
（4）进行本地测试,
输入 npm start
测试没问题之后，可以部署到自己的 GitHub 仓库，然后部署到 vercel 上，可以让大家一起体验啦！
总结
到这里，核心闭环已经完成：合约层（Factory/Router/WETH/Multicall）部署成功，INIT_CODE_PAIR_HASH 从 Pair 的 creationCode 正确导出并回填；SDK 层 完成常量同步并发布到 npm；前端层 完成路由地址、链支持、浏览器链接、multicall 与 tokenlist 的适配，能够在目标网络上正常运行和部署。
最后强调三点最容易踩坑、但也最关键的“验收标准”：
地址一致性：Factory/Router/WETH/Multicall 四个地址必须在 SDK 与 Interface 两端完全一致，且对应同一条链的 chainId。
INIT_CODE_PAIR_HASH 必须来源于你当前编译产物：只要 Pair 合约 bytecode、编译器版本或优化参数变化，hash 就会变化；hash 不匹配会导致 Pair 地址推导错误，进而影响路径、交易与查询。
Multicall 的价值在“批量读”：前端大量状态依赖多次链上 read，Multicall 能显著减少 RPC 往返与加载时间，是 Interface 体验能否“像官方一样顺滑”的关键。
后续如果你要扩展到更多链，建议把这套流程进一步产品化：把链的参数（chainId、factory/router/weth/multicall、explorer base url、tokenlist url）抽成一份配置文件，做到“新增一条链 = 新增一段配置”，从而把迁移成本从“改代码”降到“填参数”。这样你就拥有了一套可持续维护的 Uniswap V2 多链部署与前端适配框架。
