webpack-chrome-extension-launcher
v1.1.4
Published
Dedicated Chrome launcher for your extension development
Downloads
41
Maintainers
Readme
Chrome Extension Launcher
Jumptstart your Chrome extension development.
Why
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. 💅
Get Started
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.
Options
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 theoutput.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'
})
Production build
Chrome Extension Launcher is automatically disabled in mode: 'production'
.
How about
Hot reloading
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.
Better logging
If you want to centralize all your logs in the background page, use together with Web Extension Background Logger from me. 🙂