> ## Documentation Index
> Fetch the complete documentation index at: https://docs.privacyboost.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Installation

# Installation

## Package Installation

Install the Privacy Boost TypeScript SDK using your preferred package manager:

```bash theme={null}
# npm
npm install @sunnyside-io/privacy-boost

# yarn
yarn add @sunnyside-io/privacy-boost

# pnpm
pnpm add @sunnyside-io/privacy-boost
```

## Bundler Configuration

The SDK includes WebAssembly (WASM) modules that require specific bundler configuration.

### Vite

Vite works out of the box. No additional configuration needed.

### Webpack 5

Add the following to your `webpack.config.js`:

```javascript theme={null}
module.exports = {
  experiments: {
    asyncWebAssembly: true,
  },
  module: {
    rules: [
      {
        test: /\.wasm$/,
        type: 'webassembly/async',
      },
    ],
  },
};
```

### Next.js

Add to your `next.config.js`:

```javascript theme={null}
/** @type {import('next').NextConfig} */
const nextConfig = {
  webpack: (config) => {
    config.experiments = {
      ...config.experiments,
      asyncWebAssembly: true,
    };
    return config;
  },
};

module.exports = nextConfig;
```

For App Router, also add to your layout:

```typescript theme={null}
// app/layout.tsx
export const dynamic = 'force-dynamic';
```

### Create React App

CRA requires `react-app-rewired` to modify webpack:

```bash theme={null}
npm install react-app-rewired
```

Create `config-overrides.js`:

```javascript theme={null}
module.exports = function override(config) {
  config.experiments = {
    ...config.experiments,
    asyncWebAssembly: true,
  };
  return config;
};
```

Update `package.json` scripts:

```json theme={null}
{
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build"
  }
}
```

### Rollup

```javascript theme={null}
import { wasm } from '@rollup/plugin-wasm';

export default {
  plugins: [
    wasm({
      sync: ['*.wasm'],
    }),
  ],
};
```

### esbuild

```javascript theme={null}
import { build } from 'esbuild';
import { wasmLoader } from 'esbuild-plugin-wasm';

build({
  plugins: [wasmLoader()],
});
```

## Content Security Policy

If your application uses CSP, add the following directives:

```html theme={null}
<meta http-equiv="Content-Security-Policy"
  content="script-src 'self' 'wasm-unsafe-eval';
           connect-src https://indexer.example.com;">
```

## TypeScript Configuration

Recommended `tsconfig.json` settings:

```json theme={null}
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  }
}
```

## Node.js Usage

For Node.js applications:

```bash theme={null}
npm install @sunnyside-io/privacy-boost
```

Ensure you're using Node.js 18+ which includes native fetch support.

For Node.js \< 18, add a fetch polyfill:

```bash theme={null}
npm install node-fetch
```

```typescript theme={null}
import fetch from 'node-fetch';
globalThis.fetch = fetch as unknown as typeof globalThis.fetch;

import { PrivacyBoost } from '@sunnyside-io/privacy-boost';
// ...
```

## Verifying Installation

Test your installation:

```typescript theme={null}
import { PrivacyBoost } from '@sunnyside-io/privacy-boost';

async function test() {
  try {
    const sdk = await PrivacyBoost.create({
      appId: 'your-app-id',
      serverUrl: 'https://indexer.example.com',
    });
    console.log('SDK initialized successfully');
  } catch (error) {
    console.error('SDK initialization failed:', error);
  }
}

test();
```

## Troubleshooting

### "WebAssembly is not defined"

Ensure your bundler supports WebAssembly and you're running in a browser or Node.js environment that supports WASM.

### "Failed to load WASM module"

Check that:

1. Your bundler is configured correctly
2. The WASM file is being served with the correct MIME type (`application/wasm`)
3. Your CSP allows `wasm-unsafe-eval`

### TypeScript errors

Ensure you have TypeScript 4.7+ and the correct `moduleResolution` setting in `tsconfig.json`.

## Next Steps

* [Getting Started](./getting-started)