# Imports

All these methods expose a constructor with the same SealdSDK constructor function interface.

In general, importing the SDK and its plugins directly should work in most cases.

However, you may want more control over which version of the SDK is used, which polyfills are included, etc. This guide will explain all possible options and their differences.

# Browser

There are 3 ways to use the Seald SDK in your browser, depending on your needs and your web app architecture.

# Polyfilled library

In the same way, you can import the following files for plugins:

This is a bundle, which already includes all necessary libraries, dependencies, and polyfills.

Use this method if you are using a bundler such as webpack, but you do not want to configure your bundler to include necessary polyfills.

# Library

This imports @seald-io/sdk/browser/seald-sdk.js, which is the wrapper for the browser.

In the same way, you can import the following files for plugins:

Use this method if you are using a bundler such as webpack. For this purpose, see the Custom bundling and transpilation section.

This method is recommended, as it reduces the duplication of dependencies and polyfills, so it minimizes the final size of your application.

# Bundle

Copy the file @seald-io/sdk/browser/seald-sdk.browser.js into your project, then load it in a <script> tag.

In the same way, you can copy the following files for plugins:

  • @seald-io/sdk-plugin-ssks-password/browser/seald-sdk-plugin-ssks-password.browser.js
  • @seald-io/sdk-plugin-ssks-2mr/browser/seald-sdk-plugin-ssks-2mr.browser.js

For example, to import the SDK and the SSKS-Password plugin:

This is a bundle, which already includes all necessary libraries, dependencies, and polyfills.

It exposes the Seald SDK constructor function in the global variable window.SealdSDK.

Plugins are exposed in the global variables:

  • window.SealdSDKPluginSSKSPassword
  • window.SealdSDKPluginSSKS2MR

# Node.js / Electron

import SealdSDK from '@seald-io/sdk'

const seald = SealdSDK({ appId, apiURL })

This imports the Node wrapper for the Seald SDK.

You may want to use this on your NodeJS server, in an Electron desktop application, for your unit-tests ...

# React-Native

# Installation

The Seald SDK for react-native has peer dependencies that must be installed separately:

  • react-native-modpow
  • @react-native-async-storage/async-storage (for versions 0.11.X and earlier, it was the @react-native-community/async-storage package)
  • react-native-scrypt
  • react-native-rsa-native
  • expo-random

You can install them with the command:

npm i -S react-native-modpow @react-native-async-storage/async-storage react-native-scrypt react-native-rsa-native expo-random

All packages are autolinked, for Android. For iOS, you may need to run cd ios && pod install.

# Bundle

The library exposed by default is a bundle, which already includes all necessary libraries, dependencies, and polyfills.

In the same way, you can import the following files for plugins:

# Library

If your application is itself transpiled, you can import the source library. This will allow you to optimise the size of your application.

This library will need to be transpiled before it can be used. See the Custom bundling and transpilation section.

In the same way, you can import the following files for plugins:

# Custom bundling and transpilation

To transpile the SDK, you may need to enable polyfilling of Node's internal modules.

Here is an example configuration for the Webpack 5 bundler :

module.exports = {
  // ... ,
  node: {
    global: true
  },
  resolve: {
    fallback: {
      assert: require.resolve('assert/'),
      fs: false,
      path: require.resolve('path-browserify'),
      events: require.resolve('events/'),
      constants: require.resolve('constants-browserify'),
      os: require.resolve('os-browserify/browser'),
      util: require.resolve('util/'),
      stream: require.resolve('stream-browserify'),
      crypto: false
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      process: 'process/browser',
      Buffer: ['buffer', 'Buffer'],
      setImmediate: ['timers-browserify', 'setImmediate'],
      clearImmediate: ['timers-browserify', 'clearImmediate']
    })
  ]
  // ...
}

You may need to install as devDependencies the packages assert path-browserify events constants-browserify os-browserify util stream-browserify process buffer timers-browserify.

For more details, see the webpack documentation (opens new window).

# React-Native

Some SDK dependencies have specific implementations for React-Native declared as aliases in the "react-native" field of their package.json field. This field is automatically used by metro (opens new window).

If you use an intermediate bundler before using metro (like webpack), you will need to specify it. You will also need to declare the native React-Native dependencies as external. With webpack, you need to add the following options:

module.exports = {
  externals: [
    'react-native',
    'react-native-modpow',
    'react-native-scrypt',
    'react-native-rsa-native',
    '@react-native-async-storage/async-storage',
    'expo-random',
    'react-native/Libraries/Utilities/PolyfillFunctions'
  ],
  resolve: {
    aliasFields: ['react-native', 'browser', 'main']
  }
}