question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Buffer is not defined error with CRA

See original GitHub issue

The standalone client will throw this error with CRA and package "react-scripts": "^5.0.0":

image

The reason is that Webpack 5 and CRA v5 don’t add fallbacks for nodejs modules any more.

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:11
  • Comments:20

github_iconTop GitHub Comments

16reactions
OmBayuscommented, Jul 7, 2022
npm install buffer
window.Buffer = window.Buffer || require("buffer").Buffer;

function App() {
...
}
12reactions
wnz99commented, Feb 9, 2022

Personally, I think that the documentation should not state that the package is compatible with browser, if it depends on modules only available on nodeJS. The browser version should include anything necessary to run out of the box, imho.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Uncaught ReferenceError: Buffer is not defined - Stack Overflow
Answering my own question. Two things helped to resolve the issue: Adding plugins section with ProviderPlugin into webpack.config.js.
Read more >
Buffer is not defined. Using Phantom Wallet, Solana and ...
I was using the @solana/web3.js library, client-side version. I got this error suddenly ...
Read more >
How to polyfill Buffer with Webpack 5 - viglucci.io
The "buffer is not defined" error is a common error that can occur when trying to use the Buffer Node.js API in an...
Read more >
ReferenceError: exports is not defined in TypeScript | bobbyhadz
If you are getting the error for code that runs in the browser, try defining a global exports variable above the script tags...
Read more >
To v5 from v4 - webpack
Make sure your build has no errors or warnings ... Try to set the following options in your webpack 4 configuration and check...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found