Skip to content

RanjeetEppa18/ng-chrome-extension

 
 

Repository files navigation

@larscom/ng-chrome-extension

npm-release @larscom/ng-chrome-extension license npm

Easily create Google Chrome Extensions using the latest version of Angular.

The following scenarios/options 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

alt text

How to use/develop

  • change directory to your newly created project
  • run npm run start
  • 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 content page and background page scripts requires you to reload the extension in chrome://extensions

alt text alt text

Build/package for production

  • update version number inside ./angular/src/manifest.json
  • run npm run build:production
  • upload extension-build.zip to the chrome webstore.

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

Angular folder

This folder contains the angular source code. Each feature (popup,options,tab) lives inside its own module and gets lazily loaded.

see: ./angular/src/app/modules

Chrome folder

This folder contains the content page/background page scripts.

About

CLI tool to generate angular chrome extensions

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 95.3%
  • JavaScript 4.7%