How to write a Chrome extension
06 June, 2017
The github repository is here.
It is the most minimalistic, up-to-date tutorial to build your own plugin. It works as follow :
- When you click on the plugin’s button, it outputs something in the Chrome Dev Tools console,
- The JS is in a dedicated file.
Steps
- Create a directory “basic_chrome_extension” on your computer.
- Inside, put the 3 files “background.js”, “content.js”, and “manifest.json”.
- Open Chrome, and open url chrome://extensions.
- Check checkbox named “developer mode”.
- Click on button “Load unpacked extension…”.
- Choose the directory “basic_chrome_extension”.
- Good ! You should see a fresh, new, grey “B” icon next to the URL bar.
- Open any decent website : github.com , (or twitter.com, or whatever :).
- Open your chrome dev tools console : Press Ctrl+Shift+J (Windows / Linux) or Cmd+Opt+J (Mac).
- Click on the “B” icon
- Ta-da ! You should see “I’m content.js, man” in the console each time you press the magic “B” icon.