@tbd54566975/web5-react-native-polyfills
TypeScript icon, indicating that this package has built-in type declarations

2.1.0 • Public • Published

Background

This package provides an opinionated set of polyfills to:

  • enable web5 to work on react-native with no custom setup
  • increase performance using C++ native libraries similar to what underpins Node and Browser

Pitch

Use this package if:

  • You're just getting started.
  • You want to get up and running quickly on react native and don't want to spend time perfectly tweaking all of your globals and polyfills.

Anti-pitch

Don't use this package if:

  • You want to perfectly understand the global namespace and everything that's going on with your RN runtime and JS engine.
  • You prefer to self manage the versions of all of these dependencies.
  • You don't want us to version these dependencies for you.

Polyfills

Package Description
@craftzdog/react-native-buffer Supply node Buffer with C++
react-native-blob-jsi-helper Supply Blob arrayBuffers with C++.
blob-polyfill.ts Supply Blob.stream() and Blob.arrayBuffer(). Add Uint8Array support for Blob.constructor().
react-native-quick-crypto Supply the node crypto API with C++ OpenSSL
@peculiar/webcrypto Supply the crypto.subtle webcrypto API with react-native-quick-crypto C++ OpenSSL
event-target-polyfill Supply new EventTarget() with JS
realistic-structured-clone Supply global.structuredClone with JS
web-streams-polyfill Supply ReadableStream WritableStream with JS
readable-stream Supply node stream with JS
react-native-url-polyfill Supply the web & node new URL() API with JS
text-encoding Supply new TextDecoder() with JS
@azure/core-asynciterator-polyfill Supply AsyncIterator with JS

Usage

Install this package along with the following peer packages:

yarn add @tbd54566975/web5-react-native-polyfills react-native-quick-crypto @craftzdog/react-native-buffer react-native-blob-jsi-helper

Add the following code to the top of your index.js entrypoint:

import '@tbd54566975/web5-react-native-polyfills';

Add the following two entries inside the plugins key of your babel.config.js:

["@babel/plugin-proposal-private-methods", { loose: true }],
      [
        "module-resolver",
        {
          alias: {
            crypto: "react-native-quick-crypto",
            stream: "readable-stream",
            buffer: "@craftzdog/react-native-buffer"
          },
        },
      ],

For example (Expo):

// babel.config.js
module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      ['@babel/plugin-proposal-private-methods', { loose: true }],
      [
        'module-resolver',
        {
          alias: {
            crypto: 'react-native-quick-crypto',
            stream: 'readable-stream',
            buffer: '@craftzdog/react-native-buffer',
            'bn.js': 'react-native-bignumber',
          },
        },
      ],
    ],
  };
};

Readme

Keywords

Package Sidebar

Install

npm i @tbd54566975/web5-react-native-polyfills

Weekly Downloads

15

Version

2.1.0

License

Apache

Unpacked Size

32 kB

Total Files

13

Last publish

Collaborators

  • tbd-releases
  • frankhinek
  • michaelneale
  • csuwildcat
  • mistermoe
  • alrubinger
  • mktbd