Edit
When editing files, be sure to only edit files in the source
directory. Your patterns will be built to, and static files copied to, the public
directory. Because of this, you should not edit files in the public
directory.
Source Directories
Declared in patternlab-config.json
. You can change the names therein, but the functionality will remain as follows:
_annotations
- global annotations to patterns._styles/src
- source for CSS processor, e.g. Stylus, Sass, PostCSS._styles/bld
- CSS goes here (or gets built here)._styles/bld/fonts
- fonts beyond the usual system fonts._data
- global data for hydrating patterns._assets/src
- images, videos, etc._assets/bld
- in case assets get processed, e.g. resized, filtered._scripts/src
- scripts before any processing._scripts/bld
- scripts after any processing, e.g. transpilation, minification._meta
- the HTML head and foot for built patterns._patterns/03-templates
- where the Templater looks for templates to compile to the backend._patterns/04-pages
- where the Static Site Generator looks for pages with which to generate a static site._patterns/98-scrape
- the HTML Scraper._static
- where the Static Site Generator outputs the static site; additional files can be put here as necessary._ui
- custom UI components.
Watching for Source File Changes
Manually building Fepper and refreshing the browser after each change can be cumbersome. The fp
and fp restart
tasks will launch Fepper with LiveReload to automatically detect file changes and render those changes in the browser.
LiveReload watches for changes in these directories:
source/_annotations
source/_data
source/_patterns
source/_scripts
source/_styles
In macOS, Linux, and other Unix-like operating systems:
source/_assets
How to Stop the Server
To stop serving and watching files, press ctrl+c on the command line where Fepper is running.