Skip to content

arnoson/vite-plugin-live-reload

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

46 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

vite-plugin-live-reload

A simple live reloading plugin for vite.

Example

I use this configuration when working with Kirby CMS, but it works great with any backend!

Note: by default the paths are relative to Vite's root folder.

// vite.config.js
import liveReload from 'vite-plugin-live-reload'

export default {
  // ...
  plugins: [
    liveReload('../site/(templates|snippets|controllers|models)/**/*.php'),
  ]
}

Usage

Watch one or more paths:

liveReload('my/path/**/*.php')
liveReload(['my/path/**/*.php', 'my/other/path/**/*.php'])

The plugin uses a chokidar watcher. See the chokidar documentation to find out which path notations are supported.

Options

Root

By default Vite's root directory is used, but you can specify your own directory:

liveReload('my-file', { root: process.cwd() })

Always reload

If the modified file is an .html file, Vite's client only reloads the page if the browser is currently on this HTML page. With alwaysReload the browser is reloaded anyway.

liveReload('my-file', { alwaysReload: true })