node使用art-template生成静态页面

art-template页面模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{{title}}{{top}}</title>
    <link rel='stylesheet' type='text/css'  href="../views/main.css"></link>
</head>
<body>
    <button class="top-button">我要留言</button>
    //这里的语法跟vue有点类似，具体看art-template文档 https://aui.github.io/art-template/docs/
    <h2>{{header}}</h2>
    {{each files}}
    <div class="box">
        <p title={{$value.message}}>{{$value.name}}说：{{$value.message}}</p>
        <p>{{$value.date}}</p>
        <button class="delet"><a href="<%= $value.Id%>.html?Id=<%= $value.Id%>">Delete</a></button>
    </div>
    {{/each}}
</body>
</html>
<script src="../views/main.js"></script>

node操作传值给页面

const fs = require('fs')
const template = require("art-template"); //引用art-template模板引擎
let listdata = [
  { Id: 6, name: '爱豆1', message: '士大夫敢死队风格', date: '2019-09-14' },
  { Id: 7, name: '米', message: '米米', date: '2019-09-16' },
  { Id: 8, name: '张宝', message: '第三方公司的', date: '2019-09-17' },
  { Id: 10, name: 'REACT', message: '大家好大家好', date: '2019-09-17' },
  { Id: 11, name: '是德国', message: '尔特瑞特为人我', date: '2019-09-18' },
  {Id: 13,name: '他也认同',message: '复合体特反感风波不断的',date: '2019-10-14' }]
   
fs.readFile(path.join(views, "view.html"), function(err, data) {
  let htmlstr = template.render(data.toString(), {
    top: "标题-关键字",
    header: "评论日志",
    title: "list",
    files: listdata
  });
  fs.writeFile('page/ss.html',htmlstr,function(error){
    if(error){
      console.log(error)
      return false
    }
    console.log('成功')
  })
})