Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed to resolve import "vite-plugin-node-polyfills/shims/buffer" #81

Closed
OliverWich opened this issue Feb 13, 2024 · 16 comments
Closed
Labels
fund missing reproduction This issue does not provide a reproducible example of the problem.

Comments

@OliverWich
Copy link

OliverWich commented Feb 13, 2024

When using a version higher than 0.17.0, and polyfilling a bunch of stuff (see vite config snippet below), I get the following error:
image

The relevant section of my vite config is this:

"plugins": [
// ...
 nodePolyfills({
      globals: {
        Buffer: true,
        global: true,
        process: true,
      },
      include: [
        'fs',
        'path',
        'crypto',
        'stream',
        'util',
        'http',
        'https',
      ],
    }),
// ...
]

With this config everything works fine in 0.17.0 but in the testet versions 0.19.0 and 0.21.0 the error occurs

When trying to include "buffer" in the include array, it also fails because there is no polyfill for it (or it gets already polyfilled by the globals section above).
( ERROR: [plugin: node-stdlib-browser-alias] Cannot find module 'vite-plugin-node-polyfills/shims/buffer' from '.')

Upvote & Fund

  • I'm now using Polar.sh, so you can upvote and help fund this issue.
  • I receive the funding once the issue is completed and you have confirmed it.
  • Thank you in advance for helping to prioritize and fund my work.
Fund with Polar
@OliverWich OliverWich changed the title Failed to resolve import "vite-plugin-node-polyfills/shims/buffer" from Failed to resolve import "vite-plugin-node-polyfills/shims/buffer" Feb 20, 2024
@shellscape
Copy link

shellscape commented Feb 28, 2024

Just got bit by this one on v0.21.0 @davidmyersdev this is a gnarly regression, could we get a fix in por favor?

FWIW this is due to the class node module resolution not finding anything at vite-plugin-node-polyfills/shims/buffer because the built files exist at vite-plugin-node-polyfills/shims/buffer/dist

@raduciobanu22
Copy link

raduciobanu22 commented Mar 12, 2024

Similar issue here, version 0.17.0 works though.

nickgros added a commit to nickgros/synapse-web-monorepo that referenced this issue Mar 12, 2024
Across entire project
- Upgrade TypeScript to v5.4.2
- Upgrade Vite to v5
- Upgrade Vite plugins to latest versions (except vite-plugin-node-polyfills)
- Upgrade tsup to v8
- Upgrade esbuild to v0.20
- Change tsconfig moduleResolution to "bundler" (Vite 5 compatibility)
-

vite-config
- Replace @esbuild-plugins/node-globals-polyfill, @esbuild-plugins/node-modules-polyfill,rollup-plugin-polyfill-node with vite-plugin-node-polyfills. Pin to v0.17.0 because of davidmyersdev/vite-plugin-node-polyfills#81
- Update vite-plugin-svgr config to handle breaking changes in v4

synapse-react-client
- Expose ThemeTypes module augmentation via package.json `exports`
- Update storybook-vite config to use same SVGR config

apps
- Append `?url` to SVG imports used as URLs so they are handled by Vite
- Add 'vite/client' types for SVG URL import compatibility with TypeScript
nickgros added a commit to nickgros/synapse-web-monorepo that referenced this issue Mar 12, 2024
Across entire project
- Upgrade TypeScript to v5.4.2
- Upgrade Vite to v5
- Upgrade Vite plugins to latest versions (except vite-plugin-node-polyfills)
- Upgrade tsup to v8
- Upgrade esbuild to v0.20
- Change tsconfig moduleResolution to "bundler" (Vite 5 compatibility)
-

vite-config
- Replace @esbuild-plugins/node-globals-polyfill, @esbuild-plugins/node-modules-polyfill,rollup-plugin-polyfill-node with vite-plugin-node-polyfills. Pin to v0.17.0 because of davidmyersdev/vite-plugin-node-polyfills#81
- Update vite-plugin-svgr config to handle breaking changes in v4

synapse-react-client
- Expose ThemeTypes module augmentation via package.json `exports`
- Update storybook-vite config to use same SVGR config

apps
- Append `?url` to SVG imports used as URLs so they are handled by Vite
- Add 'vite/client' types for SVG URL import compatibility with TypeScript
nickgros added a commit to nickgros/synapse-web-monorepo that referenced this issue Mar 12, 2024
Across entire project
- Upgrade TypeScript to v5.4.2
- Upgrade Vite to v5
- Upgrade Vite plugins to latest versions (except vite-plugin-node-polyfills)
- Upgrade tsup to v8
- Upgrade esbuild to v0.20
- Change tsconfig moduleResolution to "bundler" (Vite 5 compatibility)
-

vite-config
- Replace @esbuild-plugins/node-globals-polyfill, @esbuild-plugins/node-modules-polyfill,rollup-plugin-polyfill-node with vite-plugin-node-polyfills. Pin to v0.17.0 because of davidmyersdev/vite-plugin-node-polyfills#81
- Update vite-plugin-svgr config to handle breaking changes in v4

synapse-react-client
- Expose ThemeTypes module augmentation via package.json `exports`
- Update storybook-vite config to use same SVGR config

apps
- Append `?url` to SVG imports used as URLs so they are handled by Vite
- Add 'vite/client' types for SVG URL import compatibility with TypeScript
@choiwonpyo
Copy link

Hello, also, I got same issue. I accepted my senior's comment. just change version to "0.17.0".
And it works. Thank you bros.

@choiwonpyo
Copy link

choiwonpyo commented Mar 14, 2024

Um... Something happens.

I can build with latest version. (not 0.17.0) when I add "vite-plugin-node-polyfills" at the "top-level" of monorepo.

my project status is.

  • Using yarn berry. (PnP zero install)
  • monorepo
    • apps/~
    • packages/~
  • apps/client using "vite"
  • using turborepo for managing 'monorepo'

before "vite", I was developing with "cra".

Because I'm amature yet, I can not pick the reason why this situation happens...

  • As Above comment, And scan that repo, pnpm user seems to have Same issue. (not only yarn berry)

Situation

    1. I just "yarn add -D ~" at the "top level of monorepo" by mistake.
    1. After, I move to "apps/client" dir, And command "yarn add -D ~".
    1. two package.json file has "vite-plugin-node-polyfills" dependency.
    1. yarn turbo build. -> client build successfully.
    1. "why success??" -> I just remove the top level dependency. and yarn install at the top level.
    1. command yarn turbo build -> client build fail.

After that experience, I have some test.

I don't know why this solve the problem...

  • monorepo top level dependency, solve the problem.

mkilpatrick added a commit to yext/pages that referenced this issue Mar 18, 2024
This also locks vite-plugin-node-polyfills to 0.17.0 until
davidmyersdev/vite-plugin-node-polyfills#81 is
fixed. It also addresses a vulnerability found via SemGrep in
browserify-sign which is a transitive dependency. This was solved by
bumping the minor versions of many transitive deps in pnpm-lock.yaml.

---------

Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
@tommymarshall
Copy link

Running into this issue as well -- it occurs from within a lerna repo and a common package is referencing Buffer (but not using vite).

@17Amir17
Copy link

Hello, also, I got same issue. I accepted my senior's comment. just change version to "0.17.0". And it works. Thank you bros.

This

@KateAstrid
Copy link

Changing the version to 0.17.0 helps me as well. Thank you @raduciobanu22 🙏

@davidmyersdev davidmyersdev added the missing reproduction This issue does not provide a reproducible example of the problem. label Jul 4, 2024
@davidmyersdev
Copy link
Owner

I wasn't able to reproduce this error with just the config provided above. I'll need a StackBlitz or CodeSandbox example in order to diagnose the issue and get a fix together.

@blake-regalia
Copy link

Happens for me when polyfilling crypto on v0.22.0, and the import comes from the ethers package:

Rollup failed to resolve import "vite-plugin-node-polyfills/shims/global" from "app/node_modules/ethers/lib.esm/crypto/crypto-browser.js".

As with others, downgrading to v0.17.0 resolves the issue.

@Flamenco
Copy link

Same here. Using Quasar/Vite. Needed to go back to version ~0.17.0

@GiovaniGuizzoYUB
Copy link

GiovaniGuizzoYUB commented Aug 27, 2024

Going back to v0.17.0 clears the Buffer error, but gives me this:

TypeError: Cannot destructure property 'Uint8Array' of 'globalThis' as it is undefined.
    at node_modules/.pnpm/[email protected]_patch_hash=zkkuxompt5d553skpnegwi5wuy/node_modules/buffer/index.js (helpers.ts:226:31)
    at __require (helpers.ts:13:60)
    at shims/dist/index.js (helpers.ts:1919:46)
    at __init (helpers.ts:10:66)
    at shims/banner/index.cjs (helpers.ts:1927:13)
    at __require (helpers.ts:13:60)
    at helpers.ts:1933:5
    at helpers.ts:1934:3

Also, I would like to note that this error and the Buffer not foun only occur in vite dev. The built application works as expected.

@GiovaniGuizzoYUB
Copy link

For those of you coming here with a problem with Buffer or any other polyfill, maybe this will help you:

Import the plugin before your react or vue plugin in the Vite config file. For some reason, if I import it after, it won't work.

So this will work:

plugins: [nodePolyfills(), react(), TanStackRouterVite()],

but this won't:

plugins: [react(), TanStackRouterVite(), nodePolyfills()],

@OliverWich
Copy link
Author

We've just updated to 0.22.0 and using nodePolyfills() as the first vite plugin as @GiovaniGuizzoYUB suggested seems to work fine. (And makes a ton of sense if you think about it :D)

I'll close this now, as it is fixed for us, but for some, downgrading to 0.17.0 might still be a valid "fix".

@Flamenco
Copy link

Flamenco commented Sep 2, 2024

With Quasar, including the plugin v 0.22 first still does not work.

quasar.config.ts

{
  vitePlugins: [
  [nodePolyfills, {include: ['buffer', 'path']}, {server: false}],
   // ...
}
[vite]: Rollup failed to resolve import "vite-plugin-node-polyfills/shims/buffer" from "/Users/steven/dev/projects/ct/ct-urm/src/v3/plugins/resource/platformResourceProvider.ts".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

@Flamenco
Copy link

Flamenco commented Sep 2, 2024

I was able to fix this by monkey-patching the Vite plugin

const nodePolyfillsFix = (options?: PolyfillOptions | undefined): Plugin => {
  const origPlugin = nodePolyfills(options)
  return {
    ...origPlugin,
    resolveId(this, source: string, importer: (string | undefined), opts: any) {
      const m = /^vite-plugin-node-polyfills\/shims\/(buffer|global|process)$/.exec(source)
      if (m) {
        return `node_modules/vite-plugin-node-polyfills/shims/${m[1]}/dist/index.cjs`
      } else {
        if (typeof origPlugin.resolveId === 'function') {
          return origPlugin.resolveId.call(this, source, importer, opts)
        }
      }
    }
  }
}

Or more simply because the plugin does not currently define resolveId.

const nodePolyfillsFix = (options?: PolyfillOptions | undefined): Plugin => {
  return {
    ...nodePolyfills(options),
    resolveId(source: string) {
      const m = /^vite-plugin-node-polyfills\/shims\/(buffer|global|process)$/.exec(source)
      if (m) {
        return `node_modules/vite-plugin-node-polyfills/shims/${m[1]}/dist/index.cjs`
      }
    }
  }
}

@way2ex
Copy link

way2ex commented Oct 14, 2024

I still suffer this issue with v0.22.0 and changing the sort of plugins does not work for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
fund missing reproduction This issue does not provide a reproducible example of the problem.
Projects
None yet
Development

No branches or pull requests