Question

我正在为一个简单的，没有cms，html网站的脚手架项目工作。基本上，该站点运行一个简单的节点服务器，运行express＆amp;车把，车把.hbs模板文件和main.hbs作为主要布局。这完全是出于开发目的。当网站准备好被推到某个地方时，我想要一个构建任务，将它渲染成一个完全静态的html网站。

我的问题：我无法弄清楚如何从我的手柄模板中获取完全呈现页面的html，加载到节点模块中然后我可以使用模块创建HTML文件像构建任务，例如。 node Build.js。这里有一些代码向您展示，基本上，主要布局和家庭布局需要编译，然后作为js字符串给我。

PS。我还有常规handlebars包，我只是使用express-handlebars作为服务器部分。

server.js（取出相关部分）

// -----------------------------
// Dependancies
// -----------------------------

// https://www.npmjs.com/package/express
var express = require('express');

// https://www.npmjs.com/package/express-handlebars
var exphbs  = require('express-handlebars');


// -----------------------------
// Template Engine
// -----------------------------

// Specify template engine & it's config
app.exp.engine('.hbs', exphbs({ extname: '.hbs', defaultLayout: 'main' }));

// Set the engine defined above
app.exp.set('view engine', '.hbs');


// -----------------------------
// Apply the routes to our application
// -----------------------------
app.exp.use(express.static(__dirname), app.router);


// -----------------------------
// Routes
// -----------------------------

// Home Route
app.router.get('/', getRoute);

// Route Controller
app.router.get('/:page', getRoute);

// Formats page data and renders the template
function getRoute(req, res) {

  // If homepage, set some data
  if(req.url === '/') req.params.page = 'home';

  // Capitalize the route param for the page title
  var title = req.params.page.substr(0,1).toUpperCase() + req.params.page.substr(1);

  // Render the view
  res.render(req.params.page, {
    name: app.name,
    title: title,
    class: req.params.page
  });

}

app.exp.listen(app.port);

主要布局（标准html内容，{{body}}数据是加载模板文件的位置）

<!doctype html>
<html lang="en">
<head>

  <title>{{title}} - {{name}}</title>
  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
  <meta charset="utf-8">

</head>
<body class="page-{{class}}">

  <!-- Navigation -->
  {{> nav}}

  <!-- Page Content -->
  <main>
    {{{body}}}
  </main>

</body>
</html>

仅举例来说，主页模板

<div>
  <p>
    This is the homepage.
  </p>
</div>

将Handlebars模板编译为html文件

0 个答案: