art-templateはnodeで、htmlとexpressの中の使用の流れ

nodeで使用:

// 1.   npm i art-template
// 2.              art-template
//         require         ：require('art-template')

var template = require('art-template')
var fs = require('fs')
var path = require('path')

fs.readFile(path.join(__dirname,'./tpl.html'),function (err,data) {
    if(err){
       return console.log(err)
    }
    var json = {
        name:'jack',
        age:18,
        hobbies:[
            '   ',
            '  ',
            '   '
        ]
    }
    var ret = template.render(data.toString(),json)
    console.log(ret)
})

 
htmlで使用する:

    
    
    
    




    
    
        <p>{
    {name}}</p>
        <p>{
    {age}}</p>
        {
    {each hobbies}}
        <p>{
    {$value}}</p>
        {
    {/each}}
    
    
        var json = {
            name: 'jack',
            age: 18,
            hobbies: [
                '   ',
                '  ',
                '   '
            ]
        }
        var ret = template('tpl', json)
        console.log(ret)
        document.body.innerHTML=ret
    

 
expressフレームを結合して使用する:
npm i express
npm i art-template
npm i express-art-template

var express = require('express')
var bodyParser = require('body-parser')

var app = express()

app.listen(3000, function () {
    console.log('running...')
})

app.use('/node_modules/', express.static('./node_modules'))
app.use('/public/', express.static('./public'))

app.engine('html', require('express-art-template'))
app.set('views','./views')


app.use(bodyParser.urlencoded({
    extended: false
}))
app.use(bodyParser.json())

var comments = []
for (var i = 0; i < 10; i++) {
    comments.push({
        name: '  ' + i,
        message: '      ' + i,
        dateTime: '2018-09-1' + i
    })
}

app
    .get('/', function (req, res) {
        res.render('index.html',{
            comments:comments
        })
    })
    .get('/post', function (req, res) {
        res.render('post.html')
    })
    .post('/post',function (req,res) { 
        var comment = req.body
        comment.dateTime = '2018-09-20'
        comments.unshift(comment)
        res.redirect('/')
        // res.statusCode = 302
        // res.setHeader('Location','/')
     })