From 318b5932b61018f3817432b63dd621b81d849998 Mon Sep 17 00:00:00 2001
From: Abhijith Vijayan <34790378+abhijithvijayan@users.noreply.github.com>
Date: Sat, 1 Feb 2020 23:08:59 +0530
Subject: [PATCH] Update README.md
---
README.md | 84 +++++++++++++++++++++++++++++--------------------------
1 file changed, 44 insertions(+), 40 deletions(-)
diff --git a/README.md b/README.md
index d636ed1..aed1f7e 100644
--- a/README.md
+++ b/README.md
@@ -12,7 +12,6 @@
-
đ§ââď¸ Looking for [React-TypeScript Version](https://github.com/abhijithvijayan/web-extension-starter/tree/react-typescript) instead?
@@ -46,17 +45,52 @@ curl -fsSL https://github.com/abhijithvijayan/web-extension-starter/archive/mast
## đ Quick Start
+Ensure you have
+- [Node.js](https://nodejs.org) 10 or later installed
+- [Yarn](https://yarnpkg.com) v1 or v2 installed
+
+Then run the following:
- `yarn install` to install dependencies.
-- `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:opera` to start the development server for opera extension.
-- `yarn run build:chrome` to build chrome extension.
-- `yarn run build:firefox` to build firefox addon.
-- `yarn run build:opera` to build opera extension.
-- `yarn run build` builds and packs extensions all at once to extension/ directory.
+- `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:opera` to start the development server for opera extension
+- `yarn run build:chrome` to build chrome extension
+- `yarn run build:firefox` to build firefox addon
+- `yarn run build:opera` to build opera extension
+- `yarn run build` builds and packs extensions all at once to extension/ directory
-## Usage
+### Development
+- `yarn install` to install dependencies.
+- To watch file changes in developement
+
+ - Chrome
+ - `yarn run dev:chrome`
+ - Firefox
+ - `yarn run dev:firefox`
+ - Opera
+ - `yarn run dev:opera`
+
+- **Load extension in browser**
+
+ - ### Chrome
+
+ - Go to the browser address bar and type `chrome://extensions`
+ - Check the `Developer Mode` button to enable it.
+ - Click on the `Load Unpacked ExtensionâŚ` button.
+ - Select your extensionâs extracted directory.
+
+ - ### Firefox
+
+ - Load the Add-on via `about:debugging` as temporary Add-on.
+ - Choose the `manifest.json` file in the extracted directory
+
+ - ### Opera
+
+ - Load the extension via `opera:extensions`
+ - Check the `Developer Mode` and load as unpacked from extensionâs extracted directory.
+
+### Generating browser specific manifest.json
Update `src/manifest/index.js` file with browser vendor prefixed manifest keys
```js
@@ -96,37 +130,6 @@ if the vendor is `chrome` or `opera`, this compiles to:
See the original [README](https://github.com/abhijithvijayan/wext-manifest) of wext-manifest package for more details
-### Development
-
-- `yarn install` to install dependencies.
-- To watch file changes in developement
-
- - Chrome
- - `yarn run dev:chrome`
- - Firefox
- - `yarn run dev:firefox`
- - Opera
- - `yarn run dev:opera`
-
-- **Load extension in browser**
-
- - ### Chrome
-
- - Go to the browser address bar and type `chrome://extensions`
- - Check the `Developer Mode` button to enable it.
- - Click on the `Load Unpacked ExtensionâŚ` button.
- - Select your extensionâs extracted directory.
-
- - ### Firefox
-
- - Load the Add-on via `about:debugging` as temporary Add-on.
- - Choose the `manifest.json` file in the extracted directory
-
- - ### Opera
-
- - Load the extension via `opera:extensions`
- - Check the `Developer Mode` and load as unpacked from extensionâs extracted directory.
-
### Production
- `yarn run build` builds the extension for all the browsers to `extension/BROWSER` directory respectively.
@@ -138,3 +141,4 @@ Give a âď¸ if this project helped you!
## Licence
Code released under the [MIT License](LICENSE).
+