Night Owl logoNight Owl


Use the watch command to trigger a new build when your source files change.

In your package.json, add the Night Owl watch command to scripts.

  "scripts": {
    "watch": "night-owl --watch"

You can now run the watch script from the command line.

npm run watch

Combining watch and serve

Usually, you will call watch and serve together.

  "scripts": {
    "start": "night-owl --watch --serve"

Watching other files

Night Owl watches all of the files that are located in your src directory.

If you need files outside of this directory to trigger a build, add them to the watch option in your Night Owl configuration. You can add file names or glob patterns to the watch array.

export default {
  watch: [
    // This file lives outside the `src` directory

    // This file is created by some other process

This can be useful for files that aren’t located in your src directory, or if you are building some files with a different process.

Note that watching a file will only trigger a new build if that file is a dependency of one of your templates. Otherwise, changing a watched file will trigger the server to reload the page.


When you run the watch command, it will run build first.

Page data

This page was rendered with the following data.

  "layout": "_/layouts/docs",
  "menu": {...},
  "filters": {...},
  "helpers": {...},
  "version": "0.5.4",
  "github": "",
  "npm": "",
  "hash": "lmu1z5z4",
  "thumbnail": "",
  "isDev": false,
  "tags": [ "commands" ],
  "title": "Watch",
  "description": "Trigger a new build when your source files change",
  "url": "/docs/commands/watch/",
  "meta": {
    "url": "/docs/commands/watch/",
    "src": "src/docs/02-commands/",
    "dist": "dist/docs/commands/watch/index.html",
    "collections": {
      "all": [...],
      "intro": [...],
      "commands": [...],
      "configuration": [...],
      "advanced": [...],
      "templates": [...]
  "content": "<p>Use the watch command to trigger a new build when your source files&nbsp;chan..."