如何将 Piler 与标准 HTML 一起使用而不是 Jade？答案

【问题标题】：How to use Piler with standard HTML instead of Jade?如何将 Piler 与标准 HTML 一起使用而不是 Jade？
【发布时间】：2013-03-18 03:10:06
【问题描述】：

我正在使用 Node.js 和 Piler (https://github.com/epeli/piler)。项目网站上的示例展示了如何将 Piler 与 index.jade 文件一起使用。

index.jade:

!!! 5
html
  head
    !{css}
    !{js}
  body
    h1 Hello Piler

当索引文件被传递给客户端时，!{css} 和 !{js} 标签将转换为相应的 html 标签。

例如：<script type="text/javascript" src="myscript.js"></script>

如何在没有 index.jade 文件但使用 index.html 文件的情况下使用 Piler？ !{css} 和 !{js} 标签在 index.html 中应该是什么样的？

换句话说：我不想将 Piler 与 Jade 一起使用，而是与标准 html 一起使用。

提前致谢。

【问题讨论】：

标签： html node.js pug piler

【解决方案1】：

Piler 默认将 js 和 css 的 concat 版本存储在piler 缓存目录中，您可以在创建 JS/CSS 管理器时通过传递 outputDirectory 参数来指定该目录。

pilerCachePath = '/www/your-project/public-path/assets/';
var clientjs = piler.createJSManager({outputDirectory: pilerCachePath});
var clientcss = piler.createCSSManager({outputDirectory: pilerCachePath});

您可以定义一个可以访问的公共路径，然后在您的 html 中使用这些路径

<!-- ... -->
<link rel="stylesheet" type="text/css" href="/assets/global.css">
</head>
<body>
<!-- ... -->
<script type="text/javascript" src="/assets/global.js"></script>
</body>

但是，我建议为此使用 gruntjs。他们的文档有一个very good introduction 说明如何使用它。

【讨论】：