@larscom/ng-chrome-extension

Angular Chrome Extension (Angular 9)

This project provides an Angular Template for google chrome extensions.

The following scenarios are supported:

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

How to install

npm install -g @larscom/ng-chrome-extension

Start creating a new project

ng-chrome

How to use/develop

• change directory to your newly created project
• run npm run watch
• goto: chrome://extensions in the browser and enable 'developer mode'
• press Load unpacked and target the folder angular/dist

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

NOTE: changes to the contentPage/backgroundPage requires you to reload the extension in chrome://extensions

Build/package for production

• run npm run build:production
• upload extension-build.zip to the chrome webstore.
• (optional) you can also manually zip your extension, the production build will output to folder angular/dist

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

NOTE: Do not forget to update the version number inside manifest.json

Angular folder

This folder contains the angular source code.

Chrome folder

This folder contains the contentPage/backgroundPage script for the google chrome extension