Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/neoki07/chrome-extension-github-custom-indent-size
https://github.com/neoki07/chrome-extension-github-custom-indent-size
Last synced: 9 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/neoki07/chrome-extension-github-custom-indent-size
- Owner: neoki07
- License: mit
- Created: 2023-04-04T15:02:27.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-07-03T12:58:28.000Z (over 1 year ago)
- Last Synced: 2024-12-18T20:43:59.305Z (2 months ago)
- Language: TypeScript
- Size: 194 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
![]()
Chrome Extension Boilerplate with
React + Vite + TypeScript


> This project is listed in the [Awesome Vite](https://github.com/vitejs/awesome-vite)
## Table of Contents
- [Intro](#intro)
- [Features](#features)
- [Installation](#installation)
- [Procedures](#procedures)
- [Screenshots](#screenshots)
- [NewTab](#newtab)
- [Popup](#popup)
- [Documents](#documents)## 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
- [React 18](https://reactjs.org/)
- [TypeScript](https://www.typescriptlang.org/)
- [Jest](https://jestjs.io/)
- [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/)
- [Vite](https://vitejs.dev/)
- [SASS](https://sass-lang.com/)
- [ESLint](https://eslint.org/)
- [Prettier](https://prettier.io/)
- [Chrome Extension Manifest Version 3](https://developer.chrome.com/docs/extensions/mv3/intro/)
- HRR(Hot Rebuild & Refresh/Reload)### Procedures
1. Clone this repository.
2. Change `name` and `description` in package.json => **Auto synchronize with manifest**
3. Run `yarn install` or `npm i` (check your node version >= 16.6, recommended >= 18)
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`.
## Documents
- [Vite Plugin](https://vitejs.dev/guide/api-plugin.html)
- [ChromeExtension](https://developer.chrome.com/docs/extensions/mv3/)
- [Rollup](https://rollupjs.org/guide/en/)
- [Rollup-plugin-chrome-extension](https://www.extend-chrome.dev/rollup-plugin)---
## Thanks To| [Jetbrains](https://jb.gg/OpenSourceSupport) | [Jackson Hong](https://www.linkedin.com/in/j-acks0n/) |
|--------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------------------|
||
|
---
[Jonghakseo](https://nookpi.tistory.com/)