Question

我正在学习React js。我想用React js，React-router和React-helmet进行整页服务器端渲染。

但我面临这个错误。

TypeError：无法读取属性＆＃39;创建＆＃39;未定义的

我正在使用这个github repos作为参考： https://github.com/mattdennewitz/react-helmet-example

server.js

import express from 'express';
import mysql from 'mysql';
import webpack from 'webpack';
import path from 'path';
import config from './webpack.config.dev';
import React from 'react';

import  Router from 'react-router';
import Helmet from 'react-helmet';
import routes from './src/App';


const app = express();

const compiler = webpack(config);

app.use(require('webpack-dev-middleware')(compiler, {
    noInfo: true,
    publicPath: config.output.publicPath
}));
//
// app.use(require('webpack-hot-middleware')(compiler));

app.set('view engine','ejs');
app.use(express.static('./public'));
const pool = mysql.createPool({
    connectionLimit:100,
   host:'127.0.0.1',
    user:'root',
    password:'123456',
    database:'naveen'
});

app.get('*',function (req,res) {
    let router  = Router.create({
        location:req.url,
        routes:routes
    });
    router.run(function (Root,state) {
        let renderedBody = React.renderToString(<Root/>);
        let head = Helmet.rewind();



        let html = `
      <!DOCTYPE html>
      <html>
      <head>
         <meta charset="utf-8"/>
         <title>${head.title}</title>
                    ${head.meta}
                    ${head.link}
      </head>
      <body>
         <div id="app">${renderedBody}</div>
         <script src="./public/bundle.js"></script>

      </body>
      </html>




    `;
        res.write(html);
        res.end();




    })


});

app.get('/api',function (req,res) {
  pool.getConnection(function (err,connection) {
      connection.query('SELECT * FROM users',function (err,rows) {
          if(err) throw err;
          console.log(rows[0]);
          res.send(rows);
          connection.release()
      })
  })
});
const port = 3000;
console.log(`Server Initializing  ${port}`);
app.listen(port,function (err) {
   if(err) throw err;
    console.log(`I am Alive at ${port} `)
});

使用React-Helmet实现路由器服务器端渲染？

0 个答案: