Difference between include and block in Jade

javascript node.js express pug
LuckyLuke picture LuckyLuke · Jan 5, 2013 · Viewed 10.7k times · Source

What is the the difference between blocks and using include when you are creating Jade templates? When do you use one over the other?

Answer

Golo Roden picture Golo Roden · Jan 5, 2013

A block is a placeholder. Its content comes from another jade file. An include is a placeholder, too. Its content also comes from another jade file.

So far, both are equal.

But:

include embeds a complete file. The including file defines which file is being included. Hence include is fine for outsourcing parts such as a footer or a header, which are always loaded the same way.

A block just defines a placeholder in the top file. Which content is included is not defined by this file, but by a sub-file. So, control over what is included is being reversed.

With an include, A says: Import B. With a block, B says: Here is content for a placeholder, and please use file A and its placeholders to fill in my content.

include means top-down, blocks mean bottom-up.

Additionally, one file may include several blocks.

When to use what:

  • It's common to define the overall layout of a site in a master page with blocks.
  • The single pages contain the content for each individual file, reference the master file and fill its blocks.
  • Subviews in either the master or the page are being set up using includes.

Does that help?

Related questions

Client on node: Uncaught ReferenceError: require is not defined

So, I am writing an application with the node/express + jade combo. I have client.js, which is loaded on the client. In that file I have code that calls functions from other JavaScript files. My attempt was to use …

Read More
Accessing Express.js local variables in client side JavaScript

Curious if I'm doing this right and if not how you guys would approach this. I have a Jade template that needs to render some data retrieved from a MongoDB database and I also need to have access to that …

Read More
Jade template with variables (nodejs server side)

So i want to show a contacts list and for that I have transformed each contact div into jade code, but I still have to populate the relevant fields. Can I do that on the server side? I'm using nodejs …

Read More