react-ssr
react-ssr copied to clipboard
sanyuan0704
part1代码执行报错
根据readme文档配置，可以正常运行。
然后做以下更改： 将containers/Home/index.js替换为part1中的代码：
// containers/Home.js import React from 'react'; const Home = () => { return ( <div> <div>This is sanyuan</div> </div> ) } export default Home
将server/index.js替换为part1中的代码：
`// server/index.js import express from 'express'; import { renderToString } from 'react-dom/server'; import Home from "../containers/Home"
const app = express();
const content = renderToString(<Home />);
app.get('/', function (req, res) {
res.send(
<html> <head> <title>ssr</title> </head> <body> <div id="root">${content}</div> </body> </html>
);
})
app.listen(3001, () => {
console.log('listen:3001')
})`
代码报错：ReferenceError: React is not defined
@sanyuan0704 您好，react 是安装的，但是需要配置 webpack 的 plugins，在webpack.server.js 中添加 plugins: [ new webpack.ProvidePlugin({ React: 'react', ReactDOM: 'react-dom' }) ]
@kapeter 需要引用相对路径 import React from './node_modules/react/index.js'; 或者通过babel,安装@babel/core": "^7.7.4","@babel/preset-react，@babel/preset-env,设置.babelrc { "presets": ["@babel/preset-env","@babel/preset-react"] }
