Voyager is using NodeJS modules which are problematic browser bundles

[silkroadnomad]

When importing voyager into a browser app in order to add an orbitdb to voyager, it is necessary to use polyfills in order to suppress compilation and bundling errors.

It would be easier if that library works out of the box for browser and NodeJS without configuring polyfills.
Not sure if that is possible by providing a separate build for browsers.

[silkroadnomad]

Node.js Module Resolution Fix for Browser Environment

Problem

The application was encountering the following error during runtime:

Uncaught TypeError: Failed to resolve module specifier "path". Relative references must start with either "/", "./", or "../".

This occurred because Node.js built-in modules (particularly path) were being directly imported in browser environments where they aren't natively available.

Solution

The issue was resolved by implementing a comprehensive polyfill strategy in the Vite configuration:

1. Properly configured vite-plugin-node-polyfills with protocolImports: true
2. Added explicit aliases for all Node.js built-ins used in the application
3. Pre-bundled polyfill packages to ensure they're properly transformed
4. Set appropriate global definitions to maintain compatibility

Implementation Details

// In vite.config.ts
resolve: {
      alias: {
            // Explicit aliasing for Node.js built-ins
            path: 'path-browserify',
            'node:path': 'path-browserify',
      }
},
optimizeDeps: {
      esbuildOptions: {
          define: {
              global: 'globalThis',
          },
          format: 'esm',
      },
      include: ['path-browserify']
}

npm install path-browserify --save-dev

[silkroadnomad]

It turned out those changes aren't enough and I did another change on the voyager side.