Server Side Rendering (Nuxt.js)

To use nuxt, we've created a package that defines a nuxt module so that all the hooks and utilities are imported automatically.

Install quirks nuxt package:

npm install @quirks/nuxt

If you are using version v1 of yarn you must manually install the peer dependencies, as this version of yarn does not automatically resolve them.

Add Quirks module inside nuxt.config.ts:

nuxt.config.ts

export default defineNuxtConfig({
  modules: ["@quirks/nuxt"],
});

Add quirks.ts inside plugins folder:

/plugins/quirks.ts

import {
  chain as osmosis,
  assets as osmosisAssetList,
} from 'chain-registry/mainnet/osmosis';
import type { Config } from "@quirks/store";
import { keplrExtension, leapExtension } from "@quirks/wallets";
 
const config: Config = {
  wallets: [keplrExtension, leapExtension],
  chains: [osmosis],
  assetsLists: [osmosisAssetList],
};
 
export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(quirksPlugin, config);
});

You can start using it as described inside quick start.

Server Side Rendering (Nuxt.js)

On this page