https://github.com/andrewchopko/react-chrome-extension-template
Looking to build a Chrome extension using React? This boilerplate provides a streamlined setup with Vite, Manifest V3 support, ESLint, and Prettier—ensuring fast development, clean code, and easy customization.
https://github.com/andrewchopko/react-chrome-extension-template
boilerplate chrome-extension chrome-extension-react js react vite
Last synced: 4 months ago
JSON representation
Looking to build a Chrome extension using React? This boilerplate provides a streamlined setup with Vite, Manifest V3 support, ESLint, and Prettier—ensuring fast development, clean code, and easy customization.
- Host: GitHub
- URL: https://github.com/andrewchopko/react-chrome-extension-template
- Owner: andrewchopko
- License: mit
- Created: 2025-04-04T13:16:17.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-08T13:13:06.000Z (about 1 year ago)
- Last Synced: 2025-04-10T22:48:38.517Z (about 1 year ago)
- Topics: boilerplate, chrome-extension, chrome-extension-react, js, react, vite
- Language: CSS
- Homepage:
- Size: 11.7 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🚀 Chrome Extension Boilerplate with React
A powerful and easy-to-use boilerplate for developing Chrome extensions with React. This template simplifies the setup process and allows you to focus on building your extension efficiently.
---
## ✨ Features
- 🛠️ **React-powered** - Build UI with React
- ⚡ **Vite support** - Fast development and HMR
- 🔥 **ESLint & Prettier** - Ensures code quality
- 🚀 **Manifest V3 support** - Stay updated with Chrome’s latest standards
- 🧩 **Easily customizable** - Modify and extend as needed
---
## 🚀 Installation
Clone this repository and install dependencies:
```sh
git clone https://github.com/andrewchopko/react-chrome-extension-template.git
cd react-chrome-extension-template
npm install
```
---
## 🎯 Usage
To start development:
```sh
npm run dev
```
To build the extension for production:
```sh
npm run build
```
---
## 🛠️ How to Load the Extension in Chrome
1. Go to `chrome://extensions/`
2. Enable **Developer Mode** (top-right corner)
3. Click **Load Unpacked**
4. Select the `dist` folder generated by the build command
---
## 🤝 Contributing
Contributions are welcome! If you’d like to improve this project, follow these steps:
1. Fork the repository
2. Create a new branch (`feature-branch`)
3. Commit your changes (`git commit -m 'Add new feature'`)
4. Push to the branch (`git push origin feature-branch`)
5. Create a Pull Request
---
## 📜 License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
---
## 🚀 Star this repo!
If you find this project helpful, please consider giving it a ⭐ to support development!
---