Application fails to bundle in modern projects built with Vite 5+ (Rollup), including frameworks like Nuxt.js (Nitro) or Next.js+Vite

[aniadev]

Summary

When using MeshJS (@meshsdk) in modern projects built with Vite 5+ (Rollup) — including frameworks like Nuxt.js (Nitro) or Next.js — the application fails to bundle or run in the browser.

This appears to be caused by @meshsdk's dependencies on Node.js-only packages (via @cardano-sdk), such as:

• serialize-error
• node-polyfill
• Node core modules (util, stream, crypto, etc.)

Additional Context

• Modern bundlers (Vite 5+, Rollup, Turbopack) have dropped automatic Node.js polyfill support.
• SSR runtimes like Nuxt 3's Nitro server remove Node core polyfills entirely, making Node-only dependencies unusable on the server.
• The problem persists even when manually adding polyfills and globalThis shims, indicating the root cause is deeper — i.e., reliance on Node-only APIs that cannot run in browser or SSR environments without major refactor.

Steps to reproduce the bug

1. Create a new project with Vite 5+ or Nuxt 3 / Next.js configured to use Rollup.
2. Install @meshsdk/core.
3. Import and use any MeshJS API in a browser-targeted component.
4. Build and run the project.

Actual Result

Even after:

• Installing and configuring node-polyfill
• Adding globalThis shims

…the application still fails at runtime with errors such as:

Uncaught ReferenceError: exports is not defined

or

Uncaught TypeError: import_serialize_error.default is not a function

Expected Result

The application should bundle successfully and run in the browser without requiring manual Node polyfills.

SDK version

all version

Environment type

• Node.js
• Browser
• Browser Extension
• Other

Environment details

MeshJS version: 1.8.0
Vite version: 5.x
Framework: (e.g., Nuxt 3, Next 14, React, etc.)
SSR: Yes / No
Node version: 22.18.0
Browser: Chrome, Firefox, Brave

[JustLeif]

This is my vite config for for Svelte 5 (I don't see why it wouldn't work on nuxt as well):

import tailwindcss from '@tailwindcss/vite';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import { nodePolyfills } from 'vite-plugin-node-polyfills';

export default defineConfig({
	plugins: [
		tailwindcss(),
		sveltekit(),
		nodePolyfills({
			globals: { Buffer: true, global: true },
			exclude: ['fs'],
			protocolImports: true
		})
	],
// other imports
});

Maybe the vite-plugin-node-polyfills plugin is more stable.

[JustLeif]

This is my vite config for for Svelte 5 (I don't see why it wouldn't work on nuxt as well):

import tailwindcss from '@tailwindcss/vite';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import { nodePolyfills } from 'vite-plugin-node-polyfills';

export default defineConfig({
plugins: [
tailwindcss(),
sveltekit(),
nodePolyfills({
globals: { Buffer: true, global: true },
exclude: ['fs'],
protocolImports: true
})
],
// other imports
});

Maybe the vite-plugin-node-polyfills plugin is more stable.

Sidenote, I exclude fs from the plugin config because I use it in my serverside code and I don't want it to be polyfilled in the clientside bundle.

[aniadev]

@JustLeif Thanks for sharing your config

I think I’ve found the root cause of the issue — it’s mainly due to Rollup polyfill failing because of ESM/CJS interop.
That’s why some configs (like yours with vite-plugin-node-polyfills) seem more stable, while others break depending on how the interop is handled.

Have you also tested this setup with Nuxt? I’m curious if the same stability holds there too.

[Ben-Tai]

@aniadev did you resolve this issue? Im also stuck.
getting errors:
✘ [ERROR] Could not read from file: ... /node_modules/stream-browserify/web
✘ [ERROR] Could not read from file: ... /node_modules/util/types