mirror of
https://github.com/gohugoio/hugo.git
synced 2024-12-02 07:58:46 -05:00
75 lines
2.2 KiB
Markdown
75 lines
2.2 KiB
Markdown
|
---
|
|||
|
|
lastmod: 2016-08-09
|
|||
|
|
date: 2014-05-26
|
|||
|
|
menu:
|
|||
|
|
main:
|
|||
|
|
parent: extras
|
|||
|
|
next: /extras/menus
|
|||
|
|
prev: /extras/gitinfo
|
|||
|
|
title: LiveReload
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
Hugo may not be the first static site generator to utilize LiveReload
|
|||
|
|
technology, but it’s the first to do it right.
|
|||
|
|
|
|||
|
|
The combination of Hugo’s insane build speed and LiveReload make
|
|||
|
|
crafting your content pure joy. Virtually instantly after you hit save
|
|||
|
|
your rebuilt content will appear in your browser.
|
|||
|
|
|
|||
|
|
## Using LiveReload
|
|||
|
|
|
|||
|
|
Hugo comes with LiveReload built in. There are no additional packages to
|
|||
|
|
install. A common way to use Hugo while developing a site is to have
|
|||
|
|
Hugo run a server and watch for changes:
|
|||
|
|
|
|||
|
|
{{< nohighlight >}}$ hugo server
|
|||
|
|
{{< /nohighlight >}}
|
|||
|
|
|
|||
|
|
This will run a full functioning web server while simultaneously
|
|||
|
|
watching your file system for additions, deletions or changes within
|
|||
|
|
your:
|
|||
|
|
|
|||
|
|
* static files
|
|||
|
|
* content
|
|||
|
|
* data files
|
|||
|
|
* layouts
|
|||
|
|
* current theme
|
|||
|
|
* configuration files
|
|||
|
|
|
|||
|
|
Whenever anything changes, Hugo will rebuild the site while continuing to serve
|
|||
|
|
the content. As soon as the build is finished, it will tell the
|
|||
|
|
browser and silently reload the page. Because most Hugo builds are so
|
|||
|
|
fast they are barely noticeable, you merely need to glance at your open
|
|||
|
|
browser and you will see the change, already there.
|
|||
|
|
|
|||
|
|
This means that keeping the site open on a second monitor (or another
|
|||
|
|
half of your current monitor) allows you to see exactly what your
|
|||
|
|
content looks like, without even leaving your text editor.
|
|||
|
|
|
|||
|
|
## Disabling Watch
|
|||
|
|
|
|||
|
|
If for some reason you don't want the Hugo server's watch functionality,
|
|||
|
|
just do:
|
|||
|
|
|
|||
|
|
{{< nohighlight >}}$ hugo server --watch=false
|
|||
|
|
{{< /nohighlight >}}
|
|||
|
|
|
|||
|
|
## Disabling LiveReload
|
|||
|
|
|
|||
|
|
LiveReload works by injecting JavaScript into the pages Hugo generates,
|
|||
|
|
which creates a connection from the browser web socket client to the
|
|||
|
|
Hugo web socket server.
|
|||
|
|
|
|||
|
|
Awesome for development, but not something you would want to do in
|
|||
|
|
production. Since many people use `hugo server` in production to
|
|||
|
|
instantly display any updated content, we’ve made it easy to disable the
|
|||
|
|
LiveReload functionality:
|
|||
|
|
|
|||
|
|
{{< nohighlight >}}$ hugo server --disableLiveReload
|
|||
|
|
{{< /nohighlight >}}
|
|||
|
|
|
|||
|
|
## Notes
|
|||
|
|
|
|||
|
|
You must have a closing `</body>` tag for LiveReload to work.
|
|||
|
|
Hugo injects the LiveReload `<script>` before this tag.
|