Skip to content

Latest commit

 

History

History
67 lines (45 loc) · 2.37 KB

README.md

File metadata and controls

67 lines (45 loc) · 2.37 KB

generate-chrome-extension

Boilerplate for Custom Chrome Extensions

npm-release generate-chrome-extension license npm Easily create Google Chrome Extensions using the latest version of React.

The following scenarios/options are supported:

  • Popup ✓
  • New Tab ✓
  • Options ✓
  • Background Page ✓
  • Content Page ✓

How to install

npm install -g generate-chrome-extension

Start creating a new project

react-chrome

alt text

How to use/develop

  • change directory to your newly created project
  • run react app (extensions files) on the browser npm run start
  • build unpacked extension npm run build
  • production build (this zip file can upload to Google WebStore) npm run pack
  • goto: chrome://extensions in the browser and enable 'developer mode'
  • press Load unpacked and target the folder build/

The project is automatically being watched, any changes to the files will recompile the project.

NOTE: changes to the content page and background page scripts requires you to reload the extension in chrome://extensions

alt text

Build/package for production

  • update version number inside ./src/manifest.json
  • run npm run pack
  • upload extension-build.zip to the chrome webstore.

This will run a production build and will automatically zip it as an extension package in the root folder named: extension-build.zip

React folder

This folder contains the react single app source code. inside it can build page for popup, options, tabs.

see: ./src/

Chrome folder

This ./build folder contains the content page,background page, popup page scripts.

License

This project is licensed under the MIT license, Copyright (c) 2021 Jithin Antony. For more information see LICENSE.md.