Installing the SDK
Install the highlight.run package via your javascript package manager.
npm install highlight.run
yarn add highlight.run
See https://app.highlight.run for an HTML snippet.
Initializing Highlight
Initialize the SDK by importing Highlight like so:
import { H } from 'highlight.run`
and then calling H.init("<YOUR_ORG_ID>") as soon as you can in your site's startup process.
H.init("<YOUR_ORG_ID>")
Here's a set of examples in major javascript frameworks:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.scss';
import App from './App';
import { H } from 'highlight.run'
H.init("<YOUR_ORG_ID>");
ReactDOM.render(<App />, document.getElementById('root'));
import Vue from 'vue';
import App from './App.vue';
import { H } from 'highlight.run';
H.init("<YOUR_ORG_ID>");
Vue.prototype.$H = H;
new Vue({
render: h => h(App)
}).$mount('#app');
import '../styles/globals.css'
import { H } from 'highlight.run';
// In Next.js, wrap all client side function calls in if (typeof window...to force the logic to be executed client side.
if (typeof window !== 'undefined') {
H.init("<YOUR_ORG_ID>");
}
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}
export default MyApp
See https://app.highlight.run for HTML instructions.
You can also configure how Highlight records by passing options to H.init(). You can learn about the options here.
H.init("<YOUR_ORG_ID>", {
environment: 'production',
enableStrictPrivacy: true,
});
Updated about a month ago
What's Next
| Identifying Users |