Skip to content

Getting Started

Quickly add ABIType to your TypeScript project

This section will help you start using ABIType in your TypeScript project. You can also try ABIType online in a TypeScript Playground.

Install

pnpm add abitype

Usage

Since ABIs can contain deeply nested arrays and objects, you must either assert ABIs to constants using const assertions or use the built-in narrow function (works with JavaScript). This allows TypeScript to take the most specific type for expressions and avoid type widening (e.g. no going from "hello" to string).

const erc20Abi = [...] as const
const erc20Abi = <const>[...]
import { narrow } from 'abitype'
const erc20Abi = narrow([...])

Once your ABIs are set up correctly, you can use the exported types and utilities to work with them. You can also import already set-up ABIs from the abitype/abis entrypoint to get started quickly.

import { 
type ExtractAbiFunctionNames<abi extends Abi, abiStateMutability extends AbiStateMutability = AbiStateMutability> = Extract<abi[number], { type: "function"; stateMutability: abiStateMutability; }>["name"]

Extracts all AbiFunction names from Abi.

ExtractAbiFunctionNames
} from 'abitype'
import {
const erc20Abi: readonly [{ readonly type: "event"; readonly name: "Approval"; readonly inputs: readonly [{ readonly indexed: true; readonly name: "owner"; readonly type: "address"; }, { readonly indexed: true; readonly name: "spender"; readonly type: "address"; }, { readonly indexed: false; readonly name: "value"; readonly type: "uint256"; }]; }, ... 9 more ..., { ...; }]
erc20Abi
} from 'abitype/abis'
type
type Result = "symbol" | "name" | "allowance" | "balanceOf" | "decimals" | "totalSupply"
Result
=
type ExtractAbiFunctionNames<abi extends Abi, abiStateMutability extends AbiStateMutability = AbiStateMutability> = Extract<abi[number], { type: "function"; stateMutability: abiStateMutability; }>["name"]

Extracts all AbiFunction names from Abi.

ExtractAbiFunctionNames
<typeof
const erc20Abi: readonly [{ readonly type: "event"; readonly name: "Approval"; readonly inputs: readonly [{ readonly indexed: true; readonly name: "owner"; readonly type: "address"; }, { readonly indexed: true; readonly name: "spender"; readonly type: "address"; }, { readonly indexed: false; readonly name: "value"; readonly type: "uint256"; }]; }, ... 9 more ..., { ...; }]
erc20Abi
, 'view'>

What's next?

After setting up your project with ABIType, you are ready to dive in further! Here are some places to start: