examples icon indicating copy to clipboard operation
examples copied to clipboard

Add NodeGlobalsPolyfillPlugin to vite config on sveltekit example

Open ocluf opened this issue 1 year ago • 0 comments

Currently the sveltekit example uses the inject plugin to add the Buffer module in vite.config.ts.

 build: {
    target: "esnext",
    rollupOptions: {
      // Polyfill Buffer for production build
      plugins: [
        inject({
          modules: { Buffer: ["buffer", "Buffer"] },
        }),
      ],
    },
  }, 

This makes sure important packages work when building a project, but not when the project is in dev mode. I got it working there by adding

import { NodeGlobalsPolyfillPlugin } from "@esbuild-plugins/node-globals-polyfill";
import { NodeModulesPolyfillPlugin } from "@esbuild-plugins/node-modules-polyfill";

// rest of the config 

  optimizeDeps: {
    esbuildOptions: {
      // Node.js global to browser globalThis
      define: {
        global: "globalThis",
      },
      plugins: [
        NodeModulesPolyfillPlugin(), //added this
        NodeGlobalsPolyfillPlugin({
          buffer: true,
        }),
      ],
    },
  }, 

ocluf avatar May 14 '24 14:05 ocluf