How to deal with __vite-browser-external errors

[xzilja]

I need to use EventEmitter that is part of nodejs core "events" package, thus have polyfilled it in a following way

import { defineConfig } from "vite";
import polyfillNode from "rollup-plugin-polyfill-node";

export default function defineConfig({
    build: {
      rollupOptions: {
        plugins: [polyfillNode()],
      }
    },
    optimizeDeps: {
      exclude: ["events"],
    },
  });

However am still getting errors like this

Error: 'EventEmitter' is not exported by __vite-browser-external

[awacode21]

I am dealing with same problem getting those kind of errors for MSW and it is completely breaking the build:

[ferdicus]

I had the same exact issue as you - am also using MSW, this stackoverflow answer helped to solve it. I didn't have to add all of the answer into my config, the build process worked with this:

import { defineConfig } from 'vite';
import path from 'node:path';
import RubyPlugin from 'vite-plugin-ruby';
import ReactPlugin from '@vitejs/plugin-react';

export default defineConfig({
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'app/javascript/App/'),
      timers: 'rollup-plugin-node-polyfills/polyfills/timers',
    },
  },
  plugins: [RubyPlugin(), ReactPlugin()],
});

this is the relevant part for our issue timers: 'rollup-plugin-node-polyfills/polyfills/timers',

you need to install "rollup-plugin-node-polyfills" as a devDependancy, no need to import it in the config file though

[Snouzy]

Thanks ! worked for me

[awacode21]

@iljadaderko
where you able to solve this?

[arlegotin]

@awacode21 @iljadaderko I had the same problem using @aws-sdk:

'request' is not exported by __vite-browser-external, imported by node_modules/...

Found a solution here, might be useful.

If you also facing this error (I believe it's related):

Uncaught ReferenceError: global is not defined

this issue might help.

[abiswas97]

I faced the same issue while using DeckGL. I found Vite Node Polyfills which helped.

import { defineConfig } from 'vite'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    nodePolyfills({
      // To exclude specific polyfills, add them to this list.
      exclude: [
        'fs', // Excludes the polyfill for `fs` and `node:fs`.
      ],
      // Whether to polyfill specific globals.
      globals: {
        Buffer: true, // can also be 'build', 'dev', or false
        global: true,
        process: true,
      },
      // Whether to polyfill `node:` protocol imports.
      protocolImports: true,
    }),
  ],
})

[lambou]

Thanks!

[justJubair]

Thanks a lot @abiswas97, you saved my day.

[vdegenne]

Does anyone know how I can write my own empty polyfills? I am using a lib that uses fs, fs/promises, path etc but I know I'm not using functions from these imports, how can I just provide empty modules for those?

[vdegenne]

I ended up writing

resolve: {
  alias: {
    'node:fs': './empty-polyfills.js',
    'fs/promises': './empty-polyfills.js',
    'fs': './empty-polyfills.js',
    // etc...
  }
}

and in empty-polyfills.js I can write:

export function rm (path) { return null }
// etc...