Installation
This guide explains how to integrate the Cross SDK into a React application step by step.
1. Project Setup
1.1. Prepare Your Project
- Make sure your JavaScript-based project is ready to use the Cross SDK.
1.2. Configure npm to use CROSS Nexus Package Registry
Create a .npmrc
file in the root of your project and add the following settings:
registry=https://registry.npmjs.org/
@to-nexus:registry=https://package.cross-nexus.com/repository/cross-sdk-js/
1.3. Install the Cross SDK
Install the Cross SDK in your project:
npm install @to-nexus/sdk
yarn add @to-nexus/sdk
pnpm add @to-nexus/sdk
2. Set Environment Variables
Create a .env
file and add the required environment variables:
VITE_PROJECT_ID=your_project_id_here
VITE_NODE_ENV=production
PROJECT_ID=your_project_id_here
NODE_ENV=production
projectId
is required. You must use a valid project ID.
If you don't have one, please contact the Cross team.nodeEnv
is required and must be set toproduction
:production
: Production environment for general usersdevelopment
: For CROSS chain developers only (developer permission required)
3) SDK Initialization
3.1 Initialize the SDK
Initialize the SDK in the entry point of your application:
// React Example
import {
initCrossSdk,
} from '@to-nexus/sdk/react'
const projectId = "your_project_id_here"
initCrossSdk(projectId)
// Vanilla JS Example
import { initCrossSdkWithParams } from '@to-nexus/sdk';
const metadata = {
name: 'Cross SDK',
description: 'Cross SDK for HTML',
url: 'https://to.nexus',
icons: ['https://contents.crosstoken.io/wallet/token/images/CROSSx.svg']
};
// Your unique project id provided by Cross Team. If you don't have one, please contact us.
const projectId = window?.VITE_PROJECT_ID || 'your_project_id_here';
const redirectUrl = window.location.href;
const crossSdk = initCrossSdkWithParams({
projectId,
redirectUrl,
metadata,
themeMode: 'light'
});
Updated 5 days ago