Background: HD188553, NASA/JPL-Caltechįollowing the parameterized route the guardian. (spanred) is like referencing a span element with red id on CSS but on Pug, it’s a shortcut for creating a. The following code sets up a simple HTTP server with Express.js.Ĭonsole.log(`Server started at port $`) The above code is a regular HTML Page but written in Pug template specific syntax. It will be created after the author and license fields are over. In other words, index.pug is the main file and it will extend from layout.pug that, in turn, includes other Pug files to compose itself. In a template, a block is simply a block of Pug that a child template may replace. If you want some other name, like app.js, you can do the naming here. Template inheritance works via the block and extends keywords. The compiled function can be re-used, and. Call that resultant function with your data, and voil, it will return a string of HTML rendered with your data. pug.compile () will compile the Pug source code into a JavaScript function that takes a data object (called locals ) as an argument. Now there is one field called entry point where you can give a name to your main file (. The general rendering process of Pug is simple. Inside /node-project, we will create the package.json file for our Node.js + Express.js application typing the below command.įill the name, version, description and other such fields with your own values.

Create a working directory for your project, say, /node-project. Pug template - how to add a span tag with class as interpolation into a mixins argument to surround one word so I can style it differently Here is the mixin from section-headline.pug: mixin section-headline (tagline, title, description, idSection) ction (ididSection).

Pug template span