The extends keyword allows us to specify that a particular template extends another template. This means the template in which the keyword is used gets to modify the blocks of the other template.
The syntax is simple; using extends layout means that the template in which it is used gets to extend layout.jade (the .jade part of the filename is implied). Also, full paths can be used; like if layout.jade was one directory above the location of the current template, we could use ../layout to access it.
To replace the content of a block, we use the same syntax as defining a block, but it must be put in a template that extends the file in which the block was defined. For example, if we have a page in which we need both jQuery and underscore.js, we could redefine the scripts block as follows:
page1.jade (in the same directory as layout.jade):
|
Jade |
HTML |
|---|---|
extends layout block scripts script(src='jquery.js') script(src='underscore.js') block content | <!DOCTYPE html> <html... |