Nimiq Web Client Vite Integration
Integrate Nimiq Web Client with Vite for fast blockchain development with minimal configuration.
Quick Start with Templates
Get started instantly with our pre-configured starter templates:
bash
npx degit onmax/nimiq-starter/starters/vue-ts my-nimiq-app
cd my-nimiq-app && pnpm install && pnpm dev
bash
npx degit onmax/nimiq-starter/starters/react-ts my-nimiq-app
cd my-nimiq-app && pnpm install && pnpm dev
Installation
Quick Start
Install the Nimiq Web Client and required Vite plugins:
bash
pnpm add @nimiq/core
pnpm add -D vite-plugin-top-level-await vite-plugin-wasm
bash
npm install @nimiq/core
npm install -D vite-plugin-top-level-await vite-plugin-wasm
bash
yarn add @nimiq/core
yarn add -D vite-plugin-top-level-await vite-plugin-wasm
bash
bun add @nimiq/core
bun add -D vite-plugin-top-level-await vite-plugin-wasm
Configuration
Basic Vite Setup
Update your vite.config.js
or vite.config.ts
:
javascript
import { defineConfig } from 'vite'
import wasm from 'vite-plugin-wasm'
export default defineConfig({
plugins: [wasm()],
worker: {
format: 'esnext',
plugins: () => [wasm()],
},
optimizeDeps: {
exclude: ['@nimiq/core'],
},
// Additional build configuration for Nimiq
build: {
target: 'esnext',
rollupOptions: {
output: {
format: 'esnext',
},
},
},
})
Usage Example
js
import init, { Client, ClientConfiguration } from '@nimiq/core/web'
await init()
const config = new ClientConfiguration()
const client = await Client.create(config.build())
await client.waitForConsensusEstablished()