Jumptstart your Chrome extension development.

Usually when developing a Chrome extension, you must first go to the chrome://extensions/ page, enable developer mode, load the unpacked extension, select its path, and finally open background page devtools.

This webpack plugin spares you all of those clicks. 💅

Install Chrome Extension Launcher :

npm i -D webpack-chrome-extension-launcher
# or
yarn add -D webpack-chrome-extension-launcher

Add to your Webpack config :

const ChromeExtensionLauncher = require('webpack-chrome-extension-launcher')

module.exports = {
  // your webpack config
  mode: 'development'
  //...
  
  plugins: [new ChromeExtensionLauncher()],
}

🚀 A dedicated Chrome instance loaded exclusively with your unpacked extension will launch once after initial compilation (no need to worry about watch mode), with the following perks :

• Developer mode enabled.
• chrome://extensions/ as homepage.
• Background page devtools opened on startup.
• Webpack process killed on Chrome instance exit.

• autoDevtools: have Chrome devtools automatically opened in new tabs.
• launchURL: start Chrome with a custom URL.
• path: Chrome Extension Launcher looks for an unpacked extension in the output.path property of your webpack config, but you can specify your own path.

new ChromeExtensionLauncher({
  autoDevtools: true,
  launchURL: 'https://github.com',
  path: '/path/to/extension'
})

Chrome Extension Launcher is automatically disabled in mode: 'production'.

If you don't want to click on the reload button every time you make a change,
use together with Chrome Extension Reloader from Rubens Pinheiro.

If you want to centralize all your logs in the background page,
use together with Web Extension Background Logger from me. 🙂