VasilyShelkov / create-react-chrome-extension-typescript

WIP: Boilerplate for building Chrome extensions with React and Typescript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

WIP: Create React Chrome Extension Typescript ARCHIVED: in favour of https://github.com/VasilyShelkov/create-react-extension

Currently only boilerplate but intension is to be like Create-React-App but for building chrome extensions.

Popup

Popup

The todos state will be saved to chrome.storage.local.

Window

Window

The context menu is created by chrome/extension/background/contextMenus.js.

Inject page

The inject script is being run by chrome/extension/background/inject.js. A simple example will be inject bottom of page(https://github.com/*) if you visit.

If you are receiving the error message Failed to load resource: net::ERR_INSECURE_RESPONSE, you need to allow invalid certificates for resources loaded from localhost. You can do this by visiting the following URL: chrome://flags/#allow-insecure-localhost and enabling Allow invalid certificates for resources loaded from localhost.

Development

  • Run script
# build files to './dev'
# start webpack development server
$ yarn start
  • If you're developing Inject page, please allow https://localhost:3000 connections. (Because injectpage injected GitHub (https) pages, so webpack server procotol must be https.)
  • Load unpacked extensions with ./dev folder.

Test

# lint
$ npm run lint
# test/app
$ npm test
$ npm test -- --watch  # watch files
# test/e2e
$ npm run build
$ npm run test-e2e

LICENSE

MIT

About

WIP: Boilerplate for building Chrome extensions with React and Typescript

License:MIT License


Languages

Language:JavaScript 87.2%Language:TypeScript 7.0%Language:HTML 3.9%Language:CSS 1.9%