use*_*322 7 node.js express reactjs redux
我在一个项目中使用服务器端渲染，我刚刚将我的堆栈更新到 React 16。
我当前的堆栈是：Node 8.4 Express React 16 Redux Webpack Pug 用于静态内容（如页眉和页脚）
我想知道是否可以使用我的堆栈在我的应用程序中使用新的 renderToNodeStream。
要打印路线，我正在使用：
const matchedRoute = matchRoutes(routes, req.url);
let context = {};
if (matchedRoute) {
const initialState = JSON.stringify(store.getState()).replace(/</g, '\\u003c');
const criticalCSSPath = manifest['criticalCss.css'].replace('http://s.domain.com.br/', '/');
const criticalCss = fs.readFileSync(`./public${criticalCSSPath}`, 'utf-8');
if (context.url) {
return res.redirect(302, context.url);
}else {
const content = renderToString(
<Provider store={store}>
<StaticRouter location={req.url} context={context}>
{renderRoutes(routes)}
</StaticRouter>
</Provider>
);
return res.render(view, {initialState: initialState, content, view, criticalCss});
}
}
但是如果我想渲染到节点流，我需要做这样的事情，根据文档：
app.get("/", (req, res) => {
res.write("<!DOCTYPE html><html><head><title>My Page</title></head><body>");
res.write("<div id='content'>");
const stream = renderToNodeStream(<MyPage/>);
stream.pipe(res, { end: false });
stream.on('end', () => {
res.write("</div></body></html>");
res.end();
});
});
有没有人知道使用 pug 实现这一目标的方法，比如我当前的堆栈？
这是一个例子
// Write the <head> and root <div>
res.write('<html><head>' + metaTags + '</head><body><div id="root>')
// Render the frontend React app
const stream = renderToNodeStream(<ReactWholeAppOrJustComponent/>)
// Pipe that HTML to the response
stream.pipe(res, { end: false });
// When React is finished, clean up the dangling HTML tags
stream.on('end', () => res.end('</div></body></html>'))
小智 0
我遇到了类似的问题，我为 ES6 模板文字编写了一个小函数。
例子：
const streamString = require('node-stream-string')
// ...
app.get("/", (req, res) => {
const stream = streamString`
<!DOCTYPE html>
<html>
<head>
<title>${ getTitle(req) }</title>
<style>${ getStyle(req) }</style>
</head>
<body>
<div id='root'>
${ renderToNodeStream(<App/>) }
</div>
</body>
</html>
`
stream.pipe(res)
})
Git： https: //github.com/xelaok/node-stream-string
| 归档时间： |
|
| 查看次数： |
3377 次 |
| 最近记录： |