React TypeScript Chrome Extension
This repository includes examples of how to set up a Chrome Extension with React and TypeScript.
This project uses Vite and crxjs to build the extension.
Setup
Clone repository
git clone git@github.com:yosevu/react-content-script.git
Install dependencies
yarn
Build extension
yarn build
Load extension
- Navigate to chrome://extensions/
- Turn on the "Developer mode" toggle switch in the top right of the window
- Click the "Load unpacked" button in top left of the window
- Go to the
react-content-script
directory and select thedist
directory to load the extension - Navigate to https://blank.org/ to see the Content Script React app
- Go to extensions and click "React TypeScript Chrome Extension" to see the Popup React app
Popup
The popup source code is at the root directory.
Content Script
The content script source code is in the content-script
directory.
Background
This repository was originally part of How to inject a React app into a Chrome Extension as a Content Script.