Version 1.1.3 fails in browser - Buffer is not defined

[karl]

We wanted to use the package to create hashes in Chrome, but on initial testing it seems like this package doesn't work in the browser.

When attempting to import the package it fails with the error message:

Buffer is not defined

You can see an minimal example in this Code Sandbox:
https://codesandbox.io/s/x2xyrq2plp

[calvinmetcalf]

how are you building it, are you building it in an enviroment like browserify or webpack that adds node globals ?

[karl]

With a bit more investigation it looks like the issue could be that we are using Webpack with a target of electron but I was testing the resulting bundle in Chrome. I’ll confirm if that is the problem tomorrow.

If the electron target is the problem then I’m not sure why it is failing in Code Sandbox!

[ColeWDavis]

I am getting a similar error trying to use it with aws-amplify-react-native.

Cant find variable: Buffer in make-hash.js

[lfernando-silva]

Seems it is a problem when using it in a not CommonJS context (such react-native). In this cases, you cannot use native nodejs modules.

For me, it worked (react-native)

1. Install rn-nodeify globally
2. Execute rn-nodeify --install "Buffer"
3. Include a require at make-hash.js => var Buffer = require('buffer').Buffer (this file is not in the reposiroty. Seems its created at npm install )

[maxime1992]

Using AWS congnito, I've encountered this error after upgrade to angular and CLI v6. Still don't know how to solve that.

[maxime1992]

In case anyone is having that problem after upgrading to Angular 6 and using cognito, I've written a SO answer that might help: https://stackoverflow.com/a/50377270/2398593

[MLoughry]

Of note, the current alpha of webpack drops support for automatic NodeJS polyfills, so I'm running into this issue testing out their alpha.

https://github.com/webpack/changelog-v5/blob/master/README.md#automatic-nodejs-polyfills-removed

Automatic Node.js Polyfills Removed

In the early days, webpack's aim was to allow running most node.js modules in the browser, but the module landscape changed and many module uses are now written mainly for frontend purposes. webpack <= 4 ships with polyfills for many of the node.js core modules, which are automatically applied once a module uses any of the core modules (i.e. the crypto module).

While this makes using modules written for node.js easy, it adds these huge polyfills to the bundle. In many cases these polyfills are unnecessary.

webpack 5 stops automatically polyfilling these core modules and focuses on frontend-compatible modules.

MIGRATION:

• Try to use frontend-compatible modules whenever possible.
• It's possible to manually add a polyfill for a node.js core module. An error message will give a hint on how to achieve that.
• Package authors: Use the browser field in package.json to make a package frontend-compatible. Provide alternative implementations/dependencies for the browser.