Embedding Beamer Script in Vite + React
Embedding the Beamer script in your React application can be done differently based on whether you’re using a vanilla React setup or a Vite + React setup or Nextjs. This guide will help you integrate Beamer with your Vite + React setup.
For a Vite + React setup, you need to embed the Beamer script in the index.html file located in the root folder of your project.
Steps:
Locate the index.html file:
- Open your Vite + React project directory.
- Find the
index.htmlfile in the root of the project.
Embed the Beamer Script:
- Add the following script tags inside the
<head>section of theindex.htmlfile:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Your App Title</title><!-- Beamer Script -->
<script>var beamer_config = { product_id: 'your_product_id', filter: 'example-filter' };</script>
<script type="text/javascript" src="https://app.getbeamer.com/js/beamer-embed.js" defer="defer"></script>
</head>
<body>
<div id="root"></div>
</body>
</html>Save and Run:
- Save the changes to the
index.htmlfile. - Start your Vite + React application using
npm run devoryarn dev.
Click Here to know about How to Inject User Data into Beamer script in React
Was this helpful?
Help us help you more
