DOCSEARCHbyAlgolia
Submit Docs

Pug Template Engine

repository·master·Indexed 12 days ago

https://github.com/pugjs/pug

A high-performance, whitespace-sensitive template engine for Node.js and browsers that provides a terse syntax for writing HTML. The project includes a modular ecosystem of packages such as pug-lexer, pug-parser, pug-load for dependency management, pug-linker for AST flattening, and pug-code-gen for generating JavaScript template functions.

Tokens
18.5K
Snippets
73
Records
87
Agent score
97%

What's inside Pug

  1. How pug-load manages dependencies

    master

    The pug-load package is responsible for loading the dependencies of a given Pug file. It processes the Abstract Syntax Tree (AST) to find Include and Extends nodes.

    For every Include and Extends node, it adds:

    • fullPath: The resolved absolute path of the dependency.
    • str: The raw content string of the dependency.
    • ast: An AST property added to Include nodes (that are loading Pug) and Extends nodes.

    It then recursively loads the dependencies of those included files to build a complete dependency tree.

  2. Compare HTML and Object output formats in pug-attrs

    master

    The compileAttrs function supports two distinct output modes via the format option:

    1. HTML Mode (format: 'html'): Produces a JavaScript string that, when evaluated, returns a string of HTML attributes (e.g., foo="bar" quux). This is used when generating raw HTML templates.
    2. Object Mode (format: 'object'): Produces a JavaScript string that, when evaluated, returns a plain JavaScript object representing the attributes (e.g., { foo: 'bar', quux: true }). This is useful when working with virtual DOMs or object-based attribute systems.

    In both modes, the runtime callback is used to map internal Pug runtime calls (like escaping) to your specific runtime implementation.

    ```js
var compileAttrs = require('pug-attrs');
var pugRuntime = require('pug-runtime');

function getBaz () { return 'baz<>'; }
var attrs = [
  {name: 'foo',  val: '"bar"',    mustEscape: true },
  {name: 'baz',  val: 'getBaz()', mustEscape: true },
  {name: 'quux', val: true,       mustEscape: false}
];

// HTML MODE
var htmlResultCode = compileAttrs(attrs, {
  terse:   true,
  format:  'html',
  runtime: function (name) { return 'pugRuntime.' + name; }
});
// htmlResultCode evaluates to: '

  5. Compile Pug templates for the browser

    master

    While you can download a standalone version of Pug for the browser, it is recommended to pre-compile templates to JavaScript to avoid sending a large library to the client. Use the --client and --no-debug flags with the CLI to generate a .js file containing the compiled template.

    $ pug --client --no-debug filename.pug