mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-04-26 09:16:22 +02:00
71 lines
1,014 B
Markdown
71 lines
1,014 B
Markdown
|
# Chrome Extension TypeScript Starter
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
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`
|