Skip to content

angeloanan/chrome-extension-boilerplate-react-vite

 
 

Repository files navigation

logo

Chrome Extension Boilerplate with
React + Vite + TypeScript

GitHub action badge hits

This project is listed in the Awesome Vite

Table of Contents

Intro

This boilerplate is made for creating chrome extensions using React and Typescript.

The focus was on improving the build speed and development experience with Vite.

Features

Installation

Procedures

  1. Clone this repository.
  2. Change name and description in package.json => Auto synchronize with manifest
  3. Run yarn or npm i (check your node version >= 16)
  4. Run yarn dev or npm run dev
  5. Load Extension on Chrome
    1. Open - Chrome browser
    2. Access - chrome://extensions
    3. Check - Developer mode
    4. Find - Load unpacked extension
    5. Select - dist folder in this project (after dev or build)
  6. If you want to build in production, Just run yarn build or npm run build.

Screenshots

New Tab

스크린샷 2022-04-11 오전 2 22 00

Popup

스크린샷 2022-04-11 오전 2 22 11

Documents


Thanks To

Jetbrains Jackson Hong
JetBrains Logo (Main) logo. Jackson Hong

Jonghakseo

About

Chrome Extension Boilerplate with React + Vite + Typescript

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 62.8%
  • JavaScript 25.2%
  • CSS 7.8%
  • HTML 3.6%
  • SCSS 0.6%