webstorm 下 pug的编译配置

webstorm 新建的nodejs文件下，初始化的目录是这样的

image.png

pug文件：
Pug 的渲染操作一般来说是相当简单的。 pug.compile() 会把 Pug 代码编译成一个 JavaScript 函数，并且这个函数有一个参数可用于传入数据（局部变量，locals）。调用这个编译出来的函数，并且传入您的数据，这时返回的就是用您提供的数据渲染的 HTML 字符串了。
pug中文文档

pug环境配置：

1. 首先需要确定电脑已经安装node和npm
2. 然后使用npm全局安装pug和pug-cli

npm install pug pug-cli -g

3. 进入到pug所在文件的目录下，执行

pug -P -w index.pug

(index.pug是你的pug的文件名)

-P是为了优化输出的html文件的格式，

-w是为了实时监听pug的变化将pug的变化实时反应到输出的html上