Static Site Generator
Running fp static
will generate a complete static site based on the files in
source/_patterns/04-pages
. The site will be viewable at
http://localhost:3000/static/. An index.html
will be generated based on
whatever is declared as the defaultPattern
in patternlab-config.json
. If
links to other pages in the 04-pages
directory work correctly in the Fepper
UI, they will work correctly in the static site, even if the public/static
directory is copied and renamed.
For example, assume an article is at
source/_patterns/04-pages/articles-/00-top-story.mustache
. Create the link as
follows:
<a href="{{ link.pages-top-story }}">Article Headline</a>
This would built to the public directory as:
<a href="../04-pages-articles--00-top-story/04-pages-articles--00-top-story.html">Article Headline</a>
The Static Site Generator would output this as:
<a href="articles--top-story.html">Article Headline</a>
Numeric prefixes to filenames and sub-directories will be dropped. Nested source directories will be flattened and all static HTML files would become siblings. The pathing of nested folders would be retained in the filenames, so the organizational benefits of nesting folders will be retained.
Appending a hyphen (-
) to the "articles" directory is just a recommended
convention for static sites. While the Static Site Generator flattens nested
source directories, the double-hyphen suggests that "articles" categorizes the
more specific parts that follow.
Additional files can be put in source/_static
so long as they do not get
overwritten by the Static Site Generator.