@indiv/ssr-renderer
SSR for InDiv
Demo
npm start- open
http://localhost:3234/indiv-doc
Environment
- Node.js v6 or newer
- Indiv v1.2.0+
Basic Usage
- Create renderer
- Import a renderer function.
const renderToString = require('./src');- Import your InDiv app, only use
routes: TRouter[]andInDivinstance
// in your InDiv APP
import { InDiv } from 'indiv';
import { router, routes } from './routes';
import RootModule from './modules';
const inDiv = new InDiv();
inDiv.bootstrapModule(RootModule);
inDiv.use(router);
inDiv.init();
export default {
routes,
inDiv,
};- Render InDiv app to string with node app
- Define your route, render template ( I use ejs template in express), and use it in function
renderToString
app.use('/indiv-doc', (req, res, next) => {
const ssrData = require('./dist/main.js');
res.render('index.ejs', {
// use in ejs template
ssrContent: renderToString(req.url, ssrData.routes, ssrData.default.inDiv),
});
});- In index.ejs
<html lang="en">
<head>
<meta charset="utf-8">
<title>InDiv ssr renderer</title>
<link rel="stylesheet" href="/main.css">
</head>
<body>
<div id="root">
<%- ssrContent %>
</div>
</body>
</html>- Life cycle hooks in SSR component
- only
constructor()andnvOnInit(): void;is executable in SSR