4.1 KiB
4.1 KiB
ReadLater WebExtension
ReadLaterByEmail webextension generator
π Table of Contents
π¦ Installation
First check if you have composer installed
Before installing this, you need to check if you have NPM
installed on your computer.
Then install this script
git clone ssh://gogs@git.shikiryu.com:2200/ReadLaterByEmail/webextensions.git
cd webextensions
npm install
npm run build
π Usage
Load the extension in Chrome & Opera
- Open Chrome/Opera browser and navigate to chrome://extensions
- Select "Developer Mode" and then click "Load unpacked extension..."
- From the file browser, choose to
extension-boilerplate/build/chrome
or (extension-boilerplate/build/opera
)
Load the extension in Firefox
- Open Firefox browser and navigate to about:debugging
- Click "Load Temporary Add-on" and from the file browser, choose
extension-boilerplate/build/firefox
Developing
The following tasks can be used when you want to start developing the extension and want to enable live reload -
npm run chrome-watch
npm run opera-watch
npm run firefox-watch
Packaging
Run npm run dist
to create a zipped, production-ready extension for each browser. You can then upload that to the appstore.
Run npm run sourcezip
for firefox submission
Update https://addons.mozilla.org/fr/developers/addon/shikiryu-readlater/versions/submit/
β¨ Features
- Write once and deploy to Chrome, Opera & Firefox
- Based on WebExtensions. It also includes a tiny polyfill to bring uniformity to the APIs exposed by different browsers.
- Live-reload
- Your changes to CSS, HTML & JS files will be relayed instantly without having to manually reload the extension. This ends up saving a lot of time and improving the developer experience.
- Sensible starting point
- This comes with a gulp based workflow that converts modern ES6 JavaScript and SCSS to JS/CSS. Scripts are transpiled using Babel and bundled using Browserify. Sourcemaps are available for both JS and SCSS.
- Sketch (.sketch) assets for icons and promo images
- A .sketch file is included in the resources directory. This has all the icons and promo images that will be needed while uploading the extensions to the app stores.
- Easily configurable and extendable
- The gulpfile is easily understandable and configurable. If you want to add additional tasks or remove un-used ones, you can easily tweak that file to suit your needs.
- Platform specific & Environment specific variables.
-
You might need to specify different data variables based on your environment. For example, you might want to use a localhost API endpoint during development and a production API endpoint once the extension is submitted to the appstore. You can specify such data in the json files inside `config` directory.
You can also set custom data variables based on the platform (different variable for Chrome, FF, Opera).
π οΈ Support
Please open an issue for support.
π Contributing
Please contribute using Github Flow. Create a branch, add commits, and open a pull request.
π License
Creative Commons Attribution NonCommercial (CC-BY-NC) Β© Chouchen
Based on Email This which is licensed under the MIT license.