The Reveal SDK AI features are currently in beta, and we welcome your feedback to help us improve for the final release.
Please report any issues or suggestions through our support channels.
Installing the AI Client SDK
The Reveal SDK AI Client is a TypeScript/JavaScript library that provides AI capabilities for your web applications. It works alongside the base Reveal SDK to add intelligent features like insights, dashboard generation, and conversational AI.
Prerequisites
Before installing the AI Client SDK, ensure you have:
- The base Reveal SDK Server installed and configured
- The Reveal SDK AI Server installed and configured
- Node.js 18+ and npm 9+ installed (for package-based installation)
Installation Methods
Install Using npm (Recommended)
The recommended way to install the AI Client SDK is through npm:
- npm
- Yarn
- pnpm
- Bun
npm install @revealbi/api
yarn add @revealbi/api
pnpm add @revealbi/api
bun add @revealbi/api
Install Using CDN
For quick prototyping and demos, you can use the unpkg CDN:
<script src="https://unpkg.com/@revealbi/api/dist/index.umd.js"></script>
Or using jsDelivr:
<script src="https://cdn.jsdelivr.net/npm/@revealbi/api/dist/index.umd.js"></script>
TypeScript Support
The AI Client SDK is written in TypeScript and includes complete type definitions. No additional @types packages are needed.
Framework-Specific Setup
Vanilla JavaScript
Using ES Modules
<!DOCTYPE html>
<html>
<head>
<title>Reveal AI</title>
</head>
<body>
<div id="app"></div>
<script type="module">
import { RevealSdkClient } from 'https://unpkg.com/@revealbi/api/dist/index.js';
RevealSdkClient.initialize({
hostUrl: 'https://your-server.com'
});
</script>
</body>
</html>
Using UMD Bundle
<!DOCTYPE html>
<html>
<head>
<title>Reveal AI</title>
<script src="https://cdn.jsdelivr.net/npm/@revealbi/api/dist/index.umd.min.js"></script>
</head>
<body>
<div id="app"></div>
<script type="text/javascript">
rv.RevealSdkClient.initialize({
hostUrl: 'https://your-server.com'
});
</script>
</body>
</html>
Angular
In your main.ts file, initialize before bootstrapping the application:
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { RevealSdkClient } from '@revealbi/api';
import { AppModule } from './app/app.module';
RevealSdkClient.initialize({
hostUrl: 'https://your-server.com'
});
platformBrowserDynamic()
.bootstrapModule(AppModule)
.catch(err => console.error(err));
React
In your index.tsx or main.tsx file, initialize before rendering:
import React from 'react';
import ReactDOM from 'react-dom/client';
import { RevealSdkClient } from '@revealbi/api';
import App from './App';
RevealSdkClient.initialize({
hostUrl: 'https://your-server.com'
});
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<App />
</React.StrictMode>
);
Vue
In your main.ts file, initialize before mounting the application:
import { createApp } from 'vue';
import { RevealSdkClient } from '@revealbi/api';
import App from './App.vue';
RevealSdkClient.initialize({
hostUrl: 'https://your-server.com'
});
createApp(App).mount('#app');