Notes

Notes on creating a Chrome extension

Edit on GitHub

JavaScript

Needed

  • manifest.json is required. It’s kinda like package.json in Node. manifest.json has info about your extension
  • The icon needs to be 19x19 pixels

Getting started

  • Create a new folder, create a manifest.json file inside
  • Load your extension in browser by going to Chrome > Extension > Enable Developer Mode > Load unpacked extension.. and point to the folder you created
  • Once you have the folder loaded, you can make edits in your code, refresh Chrome (Cmd+R) and the changes will reflect
1{
2  "manifest_version": 2,
3  "name": "My Awesome Extension",
4  "description": "This extension is an awesome extension",
5  "version": "0.1",
6}

add extension icons

The icon right to your address bar is called a browser action. It is set as default_icon under browser_action. The size needs to be 19x19 pixels

1"browser_action": {
2  "default_icon": "icon_19.png"
3}

The icon that shows on the Extensions listing page is specified with 128 under icons. The size needs to be 128x128 pixels

1"icons": { 
2  "128": "icon_128.png" 
3 }