Skip to main content
Install React Scan in your Parcel project using a script tag.

​
Script Tag Method

1

Open your index.html

Navigate to your index.html file (usually in src/index.html).
2

Add the script tag

Add the React Scan script in the <head> section:
src/index.html
<!doctype html>
<html lang="en">
  <head>
    <script
      crossOrigin="anonymous"
      src="//unpkg.com/react-scan/dist/auto.global.js"
    ></script>
    <!-- rest of your scripts go under -->
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="./index.tsx"></script>
  </body>
</html>
3

Verify it works

Start your Parcel dev server and open your app. You should see the React Scan toolbar.

​
Module Import Method

1

Install the package

npm install -D react-scan
2

Add to your entry point

Import React Scan in your entry file (e.g., src/index.tsx):
src/index.tsx
// must be imported before React and React DOM
import { scan } from "react-scan";
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";

scan({
  enabled: true,
});

ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);
React Scan must be imported before React and React DOM.
React Scan only runs in development by default. It will not affect your production builds.

Build docs developers (and LLMs) love

Get started for freeTalk to us