使用 TypeChain 从智能合约 ABI 生成类型声明

前言

web3 项目中,前端不可缺少地需要调用智能合约的代码,但是智能合约只有合约地址及对应的 ABI 文档,而没有相应的 typescript 类型声明。本文讲述如何使用 typechain 将智能合约的 ABI 文件自动生成类型声明,这样可以在项目中使用对应的属性和方法。

实现过程

1. 安装依赖

如标题所述,项目需要安装 typechain 库:

javascript 复制代码
yarn add typechain @typechain/ethers-v5 -D

2. 编写脚本

而后,需要在项目 package.json 文件中编写 scripts 脚本:

javascript 复制代码
"typechain": "typechain --out-dir src/types/contracts --target ethers-v5 'src/abis/*.json'",

脚本命令中,由 --out-dir 指定 src/types/contracts 为输入目录,而目标目录则为 src/abis/*.json 文件。

执行脚本

最后执行 yarn typechain 命令就行。

总结

通过采用 TypeChain 并将其集成到开发环境中,便可以轻松地与合约交互并提升整体开发人员体验。

相关推荐
kyriewen6 小时前
你的前端滤镜慢得像PPT?用Rust+WebAssembly,一秒处理4K图
前端·rust·webassembly
kyriewen116 小时前
你等的Babel编译,够喝三杯咖啡了——用Rust重写的SWC,只需眨个眼
开发语言·前端·javascript·后端·性能优化·rust·前端框架
IT_陈寒6 小时前
SpringBoot自动配置坑了我,原来要这样绕过去
前端·人工智能·后端
东方小月6 小时前
Claude Code 完整上手指南:MCP、Skills、第三方模型配置一次搞定
前端·人工智能·后端
XZ探长7 小时前
基于 Trae Solo 移动办公修复 Vue3 前端服务问题
前端
蝎子莱莱爱打怪7 小时前
Claude Code 省 Token 小妙招:RTK + Caveman 组合拳
前端·人工智能·后端
Momo__7 小时前
Vue 3.6 Vapor Mode:跳过虚拟 DOM,性能极致优化
前端·vue.js
少年白马醉春风丶7 小时前
从零构建 AIGC 无限画布:AIGCCanvasFlow 技术全解析
前端·后端·aigc
OpenTiny社区8 小时前
生成式 UI 藏大招!看似露营案例,实则电商集成 GenUI SDK 干货
前端·ai编程·交互设计
Awu12278 小时前
🍎Vue官方Skills深度解读:那些被悄悄藏起来的宝藏
前端·aigc·claude