React Native Crypto

Common errors

• Unable to resolve module `crypto` from `path/to/your/file.js`

  cause The React Native bundler cannot find a definition for the `crypto` module, typically because `rn-nodeify` was not run or the `shim.js` file was not correctly imported.
  fix First, ensure `npm i --save-dev rn-nodeify` and then run `./node_modules/.bin/rn-nodeify --hack --install`. Second, verify that `import './shim.js'` is the *first* line in your main application entry file.

• ReferenceError: Can't find variable: crypto

  cause The `crypto` global or imported module is not defined at runtime. This often happens if the `shim.js` is not loaded, or loaded too late, or if `rn-nodeify` failed to correctly configure the shims.
  fix Ensure `import './shim.js'` is the absolute first statement in your root `index.js` or platform-specific entry files. Double-check that `rn-nodeify` was run with `--hack --install`.

• Invariant Violation: `new NativeEventEmitter()` requires a non-null argument.

  cause This error frequently arises from `react-native-randombytes` (a peer dependency of `react-native-crypto`) not being correctly linked as a native module in your React Native project.
  fix Follow the linking instructions for `react-native-randombytes` carefully. For React Native >= 0.60, this usually involves `cd ios && pod install` after `npm install`. For older versions, use `react-native link react-native-randombytes`.

Warnings

• deprecated This package is officially deprecated by its maintainers. It is strongly recommended to migrate to `react-native-get-random-values` combined with `crypto-browserify` for active maintenance and better compatibility.
  Fix: Migrate your implementation to use `react-native-get-random-values` and `crypto-browserify` instead. Ensure proper polyfills are in place for Buffer if needed.
• breaking Requires `rn-nodeify` for shimming, which modifies your `package.json` files and creates a `shim.js` entry point. This 'hack' can be intrusive and may cause conflicts with other build tools or React Native upgrades.
  Fix: Carefully follow the `rn-nodeify` installation instructions, ensuring you back up your `package.json` before running `--hack`. Be prepared for potential conflicts during upgrades or if other modules also require similar shimming.
• gotcha The `shim.js` file created by `rn-nodeify` *must* be imported as the very first line in your application's entry file (e.g., `index.js` or `index.android.js`/`index.ios.js`). Failure to do so will result in `crypto` or other Node.js core modules being undefined when first accessed.
  Fix: Ensure `import './shim.js'` is the absolute first statement in your main application entry file, before any other imports or code.
• gotcha Linking the `react-native-randombytes` peer dependency requires platform-specific steps. For React Native versions >= 0.60, manual `cd iOS && pod install` is needed after `npm install`. For older versions, `react-native link react-native-randombytes` was used.
  Fix: Always refer to the `react-native-randombytes` documentation for the correct linking procedure based on your React Native version. Incorrect linking will lead to runtime errors related to native modules.

Install

• npm install react-native-crypto npm
• yarn add react-native-crypto yarn
• pnpm add react-native-crypto pnpm

Imports

• crypto
  wrong:

  const crypto = require('crypto')

  correct:

  import crypto from 'crypto'

  The shim.js file created by rn-nodeify exports the crypto module as a default export, making a named import difficult without remapping. Requires `./shim.js` to be imported first.
• createHash
  wrong:

  const { createHash } = require('crypto')

  correct:

  import { createHash } from 'crypto'

  While `crypto` itself is a default export, specific methods like `createHash` can be destructured as named imports after the module is globally shimmmed. Requires `./shim.js` to be imported first.
• ./shim.js

  import './shim.js'

  This import *must* be the very first import in your application's entry file (e.g., `index.js`, `index.ios.js`, `index.android.js`) to ensure all Node.js core shims are loaded before any other module attempts to use them.

Quickstart

Demonstrates how to set up `react-native-crypto` by importing the `shim.js` and then performing common cryptographic operations like hashing, random byte generation, and PBKDF2 key derivation.

import './shim.js';
import crypto from 'crypto';

// Example: Hashing data
const dataToHash = 'Hello, React Native Crypto!';
const hash = crypto.createHash('sha256');
hash.update(dataToHash);
const hashedData = hash.digest('hex');
console.log('SHA256 Hash:', hashedData);

// Example: Generating random bytes
const randomBytes = crypto.randomBytes(16);
console.log('Random Bytes (hex):', randomBytes.toString('hex'));

// Example: PBKDF2 key derivation
const password = 'mysecretpassword';
const salt = crypto.randomBytes(16);
crypto.pbkdf2(password, salt, 100000, 64, 'sha512', (err, derivedKey) => {
  if (err) throw err;
  console.log('Derived Key (hex):', derivedKey.toString('hex'));
});