Book Image

Web Development with Jade

By : Sean Lang
Book Image

Web Development with Jade

By: Sean Lang

Overview of this book

Table of Contents (16 chapters)

Includes


The last way to insert content from another file is with an include statement. This is the simplest way, but also the least dynamic because you cannot change/generate the name of the file you want to include. This is because includes are one of the first things that are evaluated when compiling a template; before any loops, logical operations, or variables.

Still, they are quite useful for moving pieces of templates that are reused many times into their own files, or for including static assets such as HTML, CSS, or JS directly in templates.

Static

If you just want to include a static asset, the operation is very basic.

style.css:

p {
  color: blue;
  text-decoration: underline;
}

content.html (in the same directory as style.css):

<h1>includes</h1>
<p>this is a file for demonstrating the use of includes in Jade</p>

example.jade (in the same directory as style.css):

Jade

HTML

doctype
html
  head
    style(type="text/css")
      include style.css
  body
    include...