mirror of
https://github.com/abhijithvijayan/web-extension-starter.git
synced 2026-01-30 09:48:12 +01:00
docs: update readme
This commit is contained in:
parent
dcfa24d37c
commit
ea1371d394
56
README.md
56
README.md
@ -1,5 +1,20 @@
|
|||||||
<h1 align="center">🚀 web-extension-starter</h1>
|
<h1 align="center">🚀 web-extension-starter</h1>
|
||||||
<p align="center">Web Extension starter to build "Write Once Run on Any Browser" extension</p>
|
<p align="center">Web Extension starter to build "Write Once Run on Any Browser" extension</p>
|
||||||
|
<div align="center">
|
||||||
|
<a href="https://travis-ci.com/abhijithvijayan/web-extension-starter">
|
||||||
|
<img src="https://travis-ci.com/abhijithvijayan/web-extension-starter.svg?branch=master" alt="Travis Build" />
|
||||||
|
</a>
|
||||||
|
</a>
|
||||||
|
<a href="https://david-dm.org/abhijithvijayan/web-extension-starter">
|
||||||
|
<img src="https://img.shields.io/david/abhijithvijayan/web-extension-starter.svg?colorB=orange" alt="DEPENDENCIES" />
|
||||||
|
</a>
|
||||||
|
<a href="https://github.com/abhijithvijayan/web-extension-starter/blob/master/LICENSE">
|
||||||
|
<img src="https://img.shields.io/github/license/abhijithvijayan/web-extension-starter.svg" alt="LICENSE" />
|
||||||
|
</a>
|
||||||
|
<a href="https://twitter.com/intent/tweet?text=Check%20out%20web-extension-starter%21%20by%20%40_abhijithv%0A%0AWeb%20Extension%20starter%20to%20build%20%22Write%20Once%20Run%20on%20Any%20Browser%22%20extension.%20https%3A%2F%2Fgithub.com%2Fabhijithvijayan%2Fweb-extension-starter%0A%0A%23javascript%20%23react%20%23typescript%20%23sass%20%23webextension%20%23chrome%20%23firefox%20%23opera">
|
||||||
|
<img src="https://img.shields.io/twitter/url/http/shields.io.svg?style=social" alt="TWEET" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
<h3 align="center">🙋♂️ Made by <a href="https://twitter.com/_abhijithv">@abhijithvijayan</a></h3>
|
<h3 align="center">🙋♂️ Made by <a href="https://twitter.com/_abhijithv">@abhijithvijayan</a></h3>
|
||||||
<p align="center">
|
<p align="center">
|
||||||
Donate:
|
Donate:
|
||||||
@ -13,6 +28,8 @@
|
|||||||
</p>
|
</p>
|
||||||
<hr />
|
<hr />
|
||||||
|
|
||||||
|
❤️ it? ⭐️ it on [GitHub](https://github.com/abhijithvijayan/web-extension-starter/stargazers)
|
||||||
|
|
||||||
🧙♂️ Looking for [React-TypeScript Version](https://github.com/abhijithvijayan/web-extension-starter/tree/react-typescript) instead?
|
🧙♂️ Looking for [React-TypeScript Version](https://github.com/abhijithvijayan/web-extension-starter/tree/react-typescript) instead?
|
||||||
|
|
||||||
## Features
|
## Features
|
||||||
@ -38,17 +55,20 @@
|
|||||||
## Use this template
|
## Use this template
|
||||||
|
|
||||||
Create a new directory and run
|
Create a new directory and run
|
||||||
|
|
||||||
```
|
```
|
||||||
curl -fsSL https://github.com/abhijithvijayan/web-extension-starter/archive/master.tar.gz | tar -xz --strip-components=1
|
curl -fsSL https://github.com/abhijithvijayan/web-extension-starter/archive/master.tar.gz | tar -xz --strip-components=1
|
||||||
```
|
```
|
||||||
|
|
||||||
## 🚀 Quick Start
|
## 🚀 Quick Start
|
||||||
|
|
||||||
Ensure you have
|
Ensure you have
|
||||||
|
|
||||||
- [Node.js](https://nodejs.org) 10 or later installed
|
- [Node.js](https://nodejs.org) 10 or later installed
|
||||||
- [Yarn](https://yarnpkg.com) v1 or v2 installed
|
- [Yarn](https://yarnpkg.com) v1 or v2 installed
|
||||||
|
|
||||||
Then run the following:
|
Then run the following:
|
||||||
|
|
||||||
- `yarn install` to install dependencies.
|
- `yarn install` to install dependencies.
|
||||||
- `yarn run dev:chrome` to start the development server for chrome extension
|
- `yarn run dev:chrome` to start the development server for chrome extension
|
||||||
- `yarn run dev:firefox` to start the development server for firefox addon
|
- `yarn run dev:firefox` to start the development server for firefox addon
|
||||||
@ -72,22 +92,22 @@ Then run the following:
|
|||||||
|
|
||||||
- **Load extension in browser**
|
- **Load extension in browser**
|
||||||
|
|
||||||
- ### Chrome
|
- ### Chrome
|
||||||
|
|
||||||
- Go to the browser address bar and type `chrome://extensions`
|
- Go to the browser address bar and type `chrome://extensions`
|
||||||
- Check the `Developer Mode` button to enable it.
|
- Check the `Developer Mode` button to enable it.
|
||||||
- Click on the `Load Unpacked Extension…` button.
|
- Click on the `Load Unpacked Extension…` button.
|
||||||
- Select your extension’s extracted directory.
|
- Select your extension’s extracted directory.
|
||||||
|
|
||||||
- ### Firefox
|
- ### Firefox
|
||||||
|
|
||||||
- Load the Add-on via `about:debugging` as temporary Add-on.
|
- Load the Add-on via `about:debugging` as temporary Add-on.
|
||||||
- Choose the `manifest.json` file in the extracted directory
|
- Choose the `manifest.json` file in the extracted directory
|
||||||
|
|
||||||
- ### Opera
|
- ### Opera
|
||||||
|
|
||||||
- Load the extension via `opera:extensions`
|
- Load the extension via `opera:extensions`
|
||||||
- Check the `Developer Mode` and load as unpacked from extension’s extracted directory.
|
- Check the `Developer Mode` and load as unpacked from extension’s extracted directory.
|
||||||
|
|
||||||
### Production
|
### Production
|
||||||
|
|
||||||
@ -96,8 +116,9 @@ Then run the following:
|
|||||||
Note: By default the `manifest.json` is set with version `0.0.0`. The webpack loader will update the version in the build with that of the `package.json` version. In order to release a new version, update version in `package.json` and run script.
|
Note: By default the `manifest.json` is set with version `0.0.0`. The webpack loader will update the version in the build with that of the `package.json` version. In order to release a new version, update version in `package.json` and run script.
|
||||||
|
|
||||||
If you don't want to use `package.json` version, you can disable the option [here](https://github.com/abhijithvijayan/web-extension-starter/blob/e10158c4a49948dea9fdca06592876d9ca04e028/webpack.config.js#L79).
|
If you don't want to use `package.json` version, you can disable the option [here](https://github.com/abhijithvijayan/web-extension-starter/blob/e10158c4a49948dea9fdca06592876d9ca04e028/webpack.config.js#L79).
|
||||||
|
|
||||||
### Generating browser specific manifest.json
|
### Generating browser specific manifest.json
|
||||||
|
|
||||||
Update `src/manifest.json` file with browser vendor prefixed manifest keys
|
Update `src/manifest.json` file with browser vendor prefixed manifest keys
|
||||||
|
|
||||||
```js
|
```js
|
||||||
@ -137,11 +158,10 @@ if the vendor is `chrome` or `opera`, this compiles to:
|
|||||||
|
|
||||||
See the original [README](https://github.com/abhijithvijayan/wext-manifest-loader) of `wext-manifest-loader` package for more details
|
See the original [README](https://github.com/abhijithvijayan/wext-manifest-loader) of `wext-manifest-loader` package for more details
|
||||||
|
|
||||||
## Show your support
|
## Bugs
|
||||||
|
|
||||||
Give a ⭐️ if this project helped you!
|
Please file an issue [here](https://github.com/abhijithvijayan/web-extension-starter/issues/new) for bugs, missing documentation, or unexpected behavior.
|
||||||
|
|
||||||
## Licence
|
## License
|
||||||
|
|
||||||
Code released under the [MIT License](LICENSE).
|
|
||||||
|
|
||||||
|
MIT © [Abhijith Vijayan](https://abhijithvijayan.in)
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user