Embedded JavaScript templates with extend/block
You can get EJS via npm.
$ npm install @kosatyi/ejs --save
const ejs = require('@kosatyi/ejs');
// path where templates is located
ejs.configure({
path: 'views'
})
// add custom template helper functions
ejs.helpers({
ucase(text){
return String(text).toUpperCase()
}
})
// load index.ejs template from `views` folder
ejs.render('page/index',{
posts:[{
title:'Post Title',
content:"<p>post content</p>"
}]
}).then((content)=>{
console.log(content)
})
$ npm install @kosatyi/ejs --save
const express = require('express')
const ejs = require('@kosatyi/ejs')
const app = express()
app.engine('ejs', ejs.__express)
app.set('views', 'views')
app.set('view cache', false)
app.set('view engine', 'ejs')
or use ejs
alias
$ npm install ejs@npm:@kosatyi/ejs --save
const express = require('express')
const app = express()
app.set('views', 'views')
app.set('view engine', 'ejs')
app.set('view cache', false)
layout/default.ejs
<html>
<head>
<title><%-ejs.get('title')%></title>
<% ejs.block('resources',()=>{ %>
<link rel="stylesheet" type="text/css" href="/dist/styles.css">
<% }) %>
</head>
<body>
<header>
<% ejs.block('header',()=>{ %>
<h1><%-ejs.get('title')%></h1>
<% }) %>
</header>
<main>
<% ejs.block('content') %>
</main>
<footer>
<% ejs.block('footer',()=>{ %>
Copyright
<% }) %>
</footer>
</body>
</html>
page/index.ejs
<% ejs.extend('layout/default') %>
<% ejs.set('title','Page Title') %>
<% ejs.block('resources',(parent)=>{ %>
<% parent() %>
<script defer src="/dist/framework.js"></script>
<% }) %>
<% ejs.block('content',()=>{ %>
<% ejs.each('posts',(post)=>{ %>
<article>
<h3><%-post.title%></h3>
<div><%=post.content%></div>
</article>
<% }) %>
<% }) %>