https://github.com/chibat/chrome-extension-typescript-starter

Chrome Extension TypeScript Starter
https://github.com/chibat/chrome-extension-typescript-starter

boilerplate chrome-extension react starter template typescript

Last synced: 5 days ago
JSON representation

Chrome Extension TypeScript Starter

• Host: GitHub
• URL: https://github.com/chibat/chrome-extension-typescript-starter
• Owner: chibat
• License: mit
• Created: 2016-11-23T13:11:41.000Z (over 8 years ago)
• Default Branch: main
• Last Pushed: 2025-03-02T00:33:23.000Z (about 1 month ago)
• Last Synced: 2025-04-02T23:06:26.915Z (12 days ago)
• Topics: boilerplate, chrome-extension, react, starter, template, typescript
• Language: TypeScript
• Homepage:
• Size: 868 KB
• Stars: 2,679
• Watchers: 28
• Forks: 450
• Open Issues: 9
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-boilerplate - Chrome Extension TypeScript Starter
• my-awesome - chibat/chrome-extension-typescript-starter - extension,react,starter,template,typescript pushed_at:2025-03 star:2.7k fork:0.5k Chrome Extension TypeScript Starter (TypeScript)
• Awesome-independent-tools - chrome-extension-typescript-starter

README

        
# Chrome Extension TypeScript Starter

![build](https://github.com/chibat/chrome-extension-typescript-starter/workflows/build/badge.svg)

Chrome Extension, TypeScript and Visual Studio Code

## Prerequisites

* [node + npm](https://nodejs.org/) (Current Version)

## Option

* [Visual Studio Code](https://code.visualstudio.com/)

## Includes the following

* TypeScript

* Webpack

* React

* Jest

* Example Code

    * Chrome Storage

    * Options Version 2

    * content script

    * count up badge number

    * background

## Project Structure

* src/typescript: TypeScript source files

* src/assets: static files

* dist: Chrome Extension directory

* dist/js: Generated JavaScript files

## Setup

```

npm install

```

## Import as Visual Studio Code project

...

## Build

```

npm run build

```

## Build in watch mode

### terminal

```

npm run watch

```

### Visual Studio Code

Run watch mode.

type `Ctrl + Shift + B`

## Load extension to chrome

Load `dist` directory

## Test

`npx jest` or `npm run test`