Include/Require

include and require both allow for injecting html into a file at that current line.

When a file is included, the code it contains will inherit the variable scope of the line on which the include occurs. Any variables available at that line in will become available within the called file.

Include

Include loads a file into the current line. If the file is not found the block gets replaced with nothing aka an empty document fragment.

Lets assume you have navigation on many pages, we could include that navigation using a single line in multiple files like this:

<nav>
  <include file="/stubs/my-nav"></include>
</nav>

Then if we had the content of that include /stubs/my-nav looking something like this:

<ul>
  <li><a href="/home"></a></li>
  <li><a href="/profile"></a></li>
  <li><a href="/settings"></a></li>
  <li><a href="/logout"></a></li>
</ul>

When it gets rendered, the output would then look like this as if the include was never added like this:

<nav>
  <ul>
    <li><a href="/home"></a></li>
    <li><a href="/profile"></a></li>
    <li><a href="/settings"></a></li>
    <li><a href="/logout"></a></li>
  </ul>
</nav>

Require

Require is nearly exactly the same as include, other than the fact that the file MUST exist otherwise an error will be thrown.

<nav>
  <require file="/stubs/my-nav"></require>
</nav>

Fallback

Both include and require allow for a fallback in the case that if the main file is not found a fallback file will be loaded. If using require and the fallback file cannot be found an error will still be thrown.

<require file="/welcome" default="/home"></require>
<include file="/welcome-footer" default="/footer"></include>