Stand with Ukraine 🇺🇦
Eleventy
The possum is Eleventy’s mascot

Eleventy Documentation

This is an older version of Eleventy. Go to the newest Eleventy docs (current path: /docs/watch-serve/) or the full release history.
Menu

Watch and Serve Configuration #

Watch JavaScript Dependencies #

When in --watch mode, Eleventy will spider the dependencies of your JavaScript Templates (.11ty.js), JavaScript Data Files (.11tydata.js or _data/**/*.js), or Configuration File (usually .eleventy.js) to watch those files too. Files in node_modules directories are ignored. This feature is enabled by default.

Filename .eleventy.js
module.exports = function(eleventyConfig) {
// Enabled by default
eleventyConfig.setWatchJavaScriptDependencies(false);
};

Add Your Own Watch Targets #

The addWatchTarget config method allows you to manually add a file or directory for Eleventy to watch. When the file or the files in this directory change Eleventy will trigger a build. This is useful if Eleventy is not directly aware of any external file dependencies.

Filename .eleventy.js
module.exports = function(eleventyConfig) {
eleventyConfig.addWatchTarget("./src/scss/");
};

Eleventy will not add a watch for files or folders that are in .gitignore, unless setUseGitIgnore is turned off. See the chapter on ignore files.

Add delay before re-running New in v0.11.0 #

A hardcoded amount of time Eleventy will wait before triggering a new build when files have changes during --watch or --serve modes. You probably won’t need this, but is useful in some edge cases with other task runners (Gulp, Grunt, etc).

module.exports = function(eleventyConfig) {
// default is 0
eleventyConfig.setWatchThrottleWaitTime(100); // in milliseconds
};

Browsersync #

Override Browsersync Server Options #

Useful if you want to change or override the default Browsersync configuration. Find the Eleventy defaults in EleventyServe.js. Take special note that Eleventy does not use Browsersync’s watch options and trigger reloads manually after our own internal watch methods are complete. See full options list on the Browsersync documentation.

Filename .eleventy.js
module.exports = function(eleventyConfig) {
eleventyConfig.setBrowserSyncConfig({
notify: true
});
};

Opt-out of the BrowserSync JavaScript snippet New in v1.0.0 #

New in browser-sync@2.27.1 New in v1.0.0. Opt-out of the JavaScript snippet normally injected by BrowserSync. This disables BrowserSync live-reloading.

module.exports = function(eleventyConfig) {
eleventyConfig.setBrowserSyncConfig({
snippet: false,
});
};

Other pages in Configuration: