Skip to content

isaurssaurav/hot-reload-extension-vite-plugin

Repository files navigation

Node.js CI

Hot Reload Chrome Extension - Vite Plugin

image

This Vite plugin offers an effortless solution for seamlessly refreshing a Chrome extension built on Manifest V3. With this plugin, you can streamline the development and testing process, ensuring your extension stays up-to-date without manual intervention.

Inspired by stackoverflow answer and other similar repos.

Screen.Recording.2023-10-28.at.14.06.31.mov

Usage

Install

$ npm i hot-reload-extension-vite -D

configuration

import hotReloadExtension from 'hot-reload-extension-vite';

export default {
  plugins: [
    hotReloadExtension({
      log: true,
      backgroundPath: 'path/to/background' // src/pages/background/index.ts
    })
  ]
};

Then run

$ NODE_ENV=development vite build --watch  // Override NODE_ENV

Extension will only reload when NODE_ENV is 'development'

Example Project

Link

Options

Options Type Description
log boolean (optional) Logs error and info.
backgroundPath string (required) Path to background service worker file.

Env variables

Variable default Description
HOT_RELOAD_EXTENSION_VITE_PORT 8080 Web socket port

License

MIT