davidmyersdev/vite-plugin-node-polyfills

Bug: require is not defined using Remix Vite

areichman opened this issue · 6 comments

Summary

I'm trying to migrate an app from the Classic Remix Compiler (CommonJS) to their newer Remix Vite plugin (ESM). Our Remix config file defines the polyfills and globals that we are currently using:

  ...
  browserNodeBuiltinsPolyfill: {
    modules: {
      zlib: true,
      buffer: true,
      path: true,
      process: true,
    },
    globals: {
      Buffer: true,
      process: true,
    },
  },
  ...

As expected, upon moving to Remix Vite, we encounter the following error without any polyfill logic defined in our Vite config file:

Uncaught Error: Module "zlib" has been externalized for browser compatibility. Cannot access "zlib.createGzip" in client code. See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
at Object.get (__vite-browser-external:zlib:3:11)
at _index.tsx:2:26

However, adding this Vite plugin produces a require is not defined error.

plugins: [
    nodePolyfills({
      include: ['zlib'],
      globals: {Buffer: true, process: true},
    })
  ]
vite-polyfill-error

If I simply try to add all polyfills without any plugin options, e.g. nodePolyfills(), I get the following error instead:

[ERROR] Could not read from file: /Users/aaron/Git/my-app/node_modules/node-stdlib-browser/esm/mock/empty.js/promises
../../node_modules/@remix-run/node/dist/upload/fileUploadHandler.js:17:23:
17 │ var promises = require('node:fs/promises');

Is there another step or configuration option I'm missing?

TypeScript 5.4.3
Remix 2.8.1
vite-plugin-node-polyfills 0.22.0

[ERROR] Could not read from file: /Users/aaron/Git/my-app/node_modules/node-stdlib-browser/esm/mock/empty.js/promises

Running into this issue as well when migrating Remix to use Vite.

Same issue here

I'm seeing this issue as well. Specifically, when running shopify hydrogen codegen

In my Vite config:

   nodePolyfills({
      include: ['util'],
    }),

Error message: Cannot find module './mock/empty.js'

Shopify CLI is also using node-stdlib-browser which could be causing a compatibility issue?