Question

想要完成这个：

<html>
<!-- head -->
<head>
    <title>SpaceGame2</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> -->
    <link rel="stylesheet" href="css/spaceGame.css">
    <!-- <link rel="stylesheet" href="css/normalize.css"> -->
    <link href="https://fonts.googleapis.com/css?family=Raleway:300,400" rel="stylesheet">
</head>
<body>

    <p class="testing"></p> html page

    <!-- Footer -->
    <script src="https://unpkg.com/vue"></script>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</body>

</html>

将其分成3个单独的文件，head.html，footer.html和main.html。 main.html会有所不同，但其他两个将是相同的。

代码：

var express = require('express');
var partial = require('express-partial');
var app = express();

app.listen(3000, function() {
    console.log('Listening on port 3000');
});

var path = require("path");
app.use(express.static(path.resolve('./')));
app.use(express.static(path.resolve('./Static')))
app.use(express.static(path.resolve('./Views')))
var partial = require('express-partial');
var url = require('url');

app.get('/*', function(req, res) {
    var path = require("path");

    var pathname = url.parse(req.url).pathname;
    var originPoint = GetOriginPoint(pathname);
    if (pathname == "" || pathname == "/") {
        pathname = "/OverView";
    }

    // res.renderPartials({
    //     Head: { data: path.resolve('./Views/Layout/head') },
    //     Main: { data: path.resolve('./Views' + originPoint + pathname + '.html') },
    //     Head: { data: path.resolve('./Views/Layout/footer') },
    // });


     res.sendFile(path.resolve('./Views' + originPoint + pathname + '.html'));
});

尝试在html标签中导入文件，尝试使用renderpartials并且它不起作用，我知道我能做到这一点的唯一方法是加载主页并有一个自定义脚本从服务器获取两个html页面但这并不是很好的，我认为有类似的东西：

    app.get('/', function(req, res) {
       var content = [];

      content.push("head.html")
      content.push("main.html")
      content.push("footer.html")

     res.sendFile(content);

    });

Answer 1

使用EJS templating language w / Express，您可以达到标记HTML的任何目标。只需安装在via npm（示例：npm link ejs在您的项目位置）。

然后将表达引擎设置为ejs`app.set（'view engine'，'ejs'）;

执行此操作后，只需调用render方法

即可

app.get('/', (req, res) => {
  // render `index.ejs` with some data
  res.render('index', { variable: 'value' })
});

Answer 2

经过一番思考后，我决定选择express-handlerbars来解决这个问题：

private class Person {
    String name;
    int age;
}

private Person enterPerson(Scanner sc) {
    Person person = null;
    String name = sc.next();
    if(name != "done) {
        int age = sc.nextInt();
        person = new Person();
        person.name = name;
        person.age = age;
    } 
    return person;
}

private Person youngest(List<Person> list) {
    Person youngest = null;
    for(Person person: list) {
        if(youngest == null || youngest.age > person.age) {
             youngest = person;
        }
    }
    return person;
}

// Oldest would be equivalent

hbs文件：

var hbs = require('express-handlebars');

app.engine('hbs', hbs({ extname: 'hbs', defaultLayout: 'layout', layoutsDir: orgininPath.resolve('./Views/Layout/') }));
app.set('view engine', 'hbs');

如何使用node.js表达多个html页面？

2 个答案: