我一直在探索很多反应,我看到你如何设置节点到服务器渲染代码之类的东西。我出于速度原因对使用静态页面非常感兴趣,但我不确定在使用静态html时是否可以渲染反应组件。
我可以使用像nginx这样的东西来触发反应渲染吗?或者我是否需要更多并且必须使用节点,轨道或sinatra之类的东西?很抱歉,如果这是一个误入歧途的问题,我就不会对服务器客户端的互动有很强的感觉。
答案 0 :(得分:8)
我们导出一个允许您呈现为静态HTML的函数 - ReactDOMServer.renderComponentToStaticMarkup
(docs)。
您需要运行Node才能调用该功能。或者,您也可以在开发站点时使用该功能,并调用它来生成写入磁盘的静态HTML文件。您仍然需要节点来调用该函数,但您不需要生产中的节点。然后你可以随意使用那个文件(例如,可以与GitHub页面,S3一起使用,或者在任何地方使用它,因为它只是HTML)。
答案 1 :(得分:5)
如果您计划在CDN中托管您的React Web应用程序(例如GitHub Pages,Amazon S3 / CloudFront,Firebase),那么您可能希望在编译期间将所有基于反应的页面预呈现为静态HTML文件步。这是一个例子:
https://github.com/koistya/react-static-boilerplate
(免责声明:我是作者)
下一步,您可以为此站点添加Travis CI自动构建配置,以便在将新版本的源文件推送到GitHub存储库时,Travis CI将构建项目并将其推送到GitHub Pages(或Amazon S3,Firebase)。
答案 2 :(得分:3)
是的,使用服务器呈现,您可以生成网站的静态版本,并像任何静态网站一样提供服务。
来自https://github.com/reactjs/react-page
React可以为动态的,网络连接的应用提供支持。但是使用react-page, React也可用于构建静态博客,Github文档, 或任何其他静态网站。因为react-page使用服务器渲染, 创建静态站点就像单个wget命令一样简单。
node server.js wget -mpck --user-agent =“” - e robots = off http://localhost:8080/index.html获取OS X上的wget:试试 http://osxdaily.com/2012/05/22/install-wget-mac-os-x/或者如果你有 brew:brew install wget
这预先构建了整个交互式网站,因此可以从中提供服务 文件服务器或github等。别忘了在你的文件上启用gzip 服务器! React标记很大但压缩效果非常好。