Nimiq Web Client in Nuxt ​

The Nimiq Web Client ships with support for Nuxt.

Installation ​

bash
npm install @nimiq/core@next
npm install -D vite-plugin-top-level-await vite-plugin-wasm
bash
yarn add @nimiq/core@next
yarn add -D vite-plugin-top-level-await vite-plugin-wasm
bash
pnpm add @nimiq/core@next
pnpm add -D vite-plugin-top-level-await vite-plugin-wasm
bash
bun add @nimiq/core@next
bun add -D vite-plugin-top-level-await vite-plugin-wasm
info

Currently, Vite does not support WebAssembly out of the box. To enable WebAssembly support, you need to install the vite-plugin-wasm plugin. Learn more here.

Update your nuxt.config.js:

javascript
import wasm from 'vite-plugin-wasm'
import topLevelAwait from 'vite-plugin-top-level-await'

export default defineNuxtConfig({
  vite: { 
    plugins: [ 
      wasm(), 
      topLevelAwait(), 
    ], 

    optimizeDeps: { 
      exclude: ['@nimiq/core'], 
    }, 
  }, 

  // Only if you are using SSR or @nimiq/core in the server,
  // otherwise use `ssr: false` or `<ClientOnly />`
  // Check https://github.com/unjs/nitro/issues/1952 for more info
  nitro: { 
    experimental: { 
      wasm: true
    }, 
  }, 
})

Now you are ready to go!

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()

Contribute ​

You can help us improve this guide by contributing to the Nimiq Web Client documentation on GitHub. Simply click the Edit this page button at the bottom of the page to suggest changes.