Skip to main content
Version: 2.1.x

Appxiom React SDK Installation

Detailed documentation is available at Appxiom React SDK.

@appxiom/4react initializes the Appxiom browser SDK and adds React-aware instrumentation for application lifecycle activity and useRef leak detection. It depends on @appxiom/web, which npm installs automatically.

Requirements​

  • React 18 or React 19.
  • A browser environment. The SDK uses browser APIs and must not run during server-side rendering.
  • Node.js 18 or later for package installation and builds.

Installation​

Install the React integration and React. @appxiom/web is installed automatically as a dependency.

npm install @appxiom/4react react

Vite​

@appxiom/4react depends on @appxiom/web, which includes a WebAssembly binary. During local development, exclude both packages from Vite dependency optimization so Vite preserves the binary's source-relative URL:

JavaScript / TypeScript​

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  optimizeDeps: {
    exclude: ['@appxiom/4react', '@appxiom/web'],
  },
});

After adding the configuration, clear Vite's optimized-dependency cache and restart the development server:

rm -rf node_modules/.vite
npm run dev -- --force

This setting only affects Vite's development dependency optimizer. It is safe to keep in the configuration for production builds.

Production Deployment​

Build and deploy the application normally. For a Vite application:

npm run build

The production build emits Appxiom's WebAssembly binary as an asset and rewrites its loader URL. Deploy the complete build output, including the generated .wasm file, without renaming or omitting assets.

Your CDN or web server must return this header for WebAssembly assets:

Content-Type: application/wasm

Ensure SPA fallback rules do not return index.html for .wasm requests. Returning HTML instead of the binary causes errors such as expected magic word 00 61 73 6d.