Pug (Jade) Template Engine
WebStorm integrates with the Pug (Jade) template engine.
Before you start
Changes to the UI
The Pug (ex-Jade) plugin introduces the following changes to the WebStorm UI:
Using Pug(Jade) templates in a Node.js application
At runtime, the Pug (Jade) files fill be transformed into HTML pages.
- Create a project from scratch, or around existing sources, or based on a NodeExpress template. See Creating a Project from Existing Local Sources, or Generating a Project from a Framework Template for details.
- Create a Pug (Jade) file. Follow these steps:
- In the Project Tool Window, select the directory in which you want to create a new file. To do that, for example, choose .
- On the context menu, choose Jade file and specify the file name in the dialog box that opens.
- Create a File Watcher to transform files with the extension
- Click the Add Watcher link in the upper right-hand corner of the editor.
- In the New Watcher Dialog, accept the default predefined settings.
Note that if the executable is in the PATH, then you should not specify it explicitly. Depending on the file extension (
.pug), the corresponding executable is invoked.
- As you edit a
.jadefile, WebStorm invokes the file watcher which creates an
.htmlfile with the name of the processed
.jadefile and stores the generated
htmlcode in it.
See Using File Watchers for details.