[英]Server side rendering with create-inferno-app
I am attempting to set up a server-side implementation of create-inferno-app. 我正在尝试设置create-inferno-app的服务器端实现。 So, i initially run the create-inferno-app to create a sample project and run the npm start run
and everything looks fine. 因此,我最初运行create-inferno-app创建一个示例项目,然后运行npm start run
,一切看起来都很好。 This is my index.js
这是我的index.js
import { render } from 'inferno';
import App from './App';
render(<App />, document.getElementById('root'));
and this is App.js
这是App.js
import { renderToString } from 'inferno-server';
import './App.css';
const App = function({ color = 'red', name }) {
return (
<div style={{ color }}>
Hello
<span>{name}</span>
</div>
);
}
export default renderToString(<App color="blue" name="world" />)
I get an error TypeError: type is not a function
我收到错误TypeError: type is not a function
So how should i use the renderToString
method in create-inferno-app ? 那么我应该如何在create-inferno-app中使用renderToString
方法?
This import App from './App';
import App from './App';
is importing this export default renderToString(<App color="blue" name="world" />)
from your app.js. 从您的app.js导入此export default renderToString(<App color="blue" name="world" />)
。
You want to have your files like this: 您想要这样的文件:
index.js index.js
import { render } from 'inferno';
import App from './App';
render(<App />, document.getElementById('root'));
app.js app.js
import './App.css';
App = function({ color = 'red', name }) {
return (
<div style={{ color }}>
Hello
<span>{name}</span>
</div>
);
}
export default App
server.js server.js
import { renderToString } from 'inferno-server';
import App from './App';
cosnt appAsString = renderToString(<App color="blue" name="world" />)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.