问题标签 [react-ssr]

当我在 react-toastify npm 模块和服务器端渲染中使用 Error 时出现错误。toastify/dist/ReactToastify.css 模块解析失败：意外令牌 (1:0) 您可能需要适当的加载程序来处理此文件类型。|

我正在尝试使用 SSR 将 CSS 添加到我在 React 中构建的组件中，但我无法这样做。

我看过的东西：

• https://www.npmjs.com/package/isomorphic-style-loader
• https://cssinjs.org/server-side-rendering/?v=v10.0.0-alpha.22
• webpack 加载器

但没有一个过程是简单的或明确提到的。我尝试了很多是同构加载器，它看起来很有希望，但是在我的 CSS 文件中设置它之后它给出了一些模糊的错误：

意外令牌 (1:0) 您可能需要适当的加载程序来处理此文件类型。

这是我的样板包 - https://github.com/alexnm/react-ssr

如何向我的 React SSR 代码添加样式。

更新

我正在尝试在使用https://github.com/jaredpalmer/razzle with-react-router-3 创建的 SSR 应用程序中使用 firebase 按摩。我已经在使用 firebase，它非常好用，包括托管。但是当我开始在应用程序中添加消息时开始抛出错误。

我的入口点看起来像，

当我启动服务器时出现以下错误razzle start

我如何解决它？任何领先都会令人惊叹。谢谢。:)

我正在尝试将 Apollo 客户端状态数据与钩子一起使用，useQuery并将useMutation其用作 NextJS 应用程序中的全局存储。当我按照 NextJS 中的示例with-apollo（https://github.com/zeit/next.js/tree/canary/examples/with-apollo）进行操作时，它使用一个 HOC，在其中运行所有查询并呈现应用程序首先是服务器。

通常，您希望在这样的组件中捕获“加载”状态：

但我想跳过加载检查并始终有一个可用的默认状态。我认为这可以通过将 apollo-client 的缓存设置为一组默认值来完成，如下所示：

目标是这样做：

我创建了一个带有机器人的存储库，它的名称和状态从一开始就以这种方式缓存。见https://github.com/rnacken/next-with-apollo-client-state-cache

客户端工作，没有任何错误，但在 SSR 期间，我收到一个错误，因为它在调用后还没有数据（并且“加载”是真的）useQuery。当我记录加载/数据状态时，我在服务器上看到了这个： 在客户端上，一切都很好：

有人知道这是怎么回事吗？使用缓存集，我不应该看到 loading:true 状态，对吧？getDataFromTree从不@apollo/react-ssr正常工作？

我使用yarn create-razzle-app my-app. 构建后，我已将其部署到 nodeJS Elastic Beanstalk 环境中。

在点击弹性 beanstalk url 后，我看到网站没有应用任何 CSS。在本地运行相同的服务器似乎工作正常，所以我想知道是否需要做更多的工作来为弹性豆茎上的 SSR 配置 Razzle 应用程序？

检查bundle.[HASH].jsandbundle.[HASH].css时，它们都如下所示：

这显然会导致错误，因为它不是控制台输出所指示的有效 CSS 或 JSbundle.f03ddc0c.js:1 Uncaught SyntaxError: Unexpected token '<'

index

构建时和在 Elastic Beanstalk 配置上的环境变量是：

package.json

.ebextensions/nodecommand.config

我想通过代码拆分和工作进行服务器端渲染。我正在使用 componentDidMount() 加载要显示的数据。

在深入研究ReactDOMServer之前，我想知道它将如何处理这些情况（以防它有缺点）。ReactDOMServer 如何确定页面何时完成加载，并将其呈现为 HTML？它会在我的数据加载之前呈现吗？

我正在为 React SSR 应用程序使用这个非常棒的样板，并尝试为 css lib 添加Material UI。我已经阅读了他们的服务器端渲染指南，但似乎做错了什么，因为我可以让按钮按此处所示进行渲染，但是按钮没有应用样式:((

这是我到目前为止所做的：在 client.js

然后在 server.js

最后在 renderHtml.js

我不确定我做错了什么？

我正在创建一个 React SSR 项目。我已经集成了 Redux 实现了服务器端渲染。但是，当我使用带有批量数据的 api 浏览某个组件时，在加载时，点击浏览器的后退按钮，我的路线会立即更改，该组件的数据已加载，但在当前组件获取其数据之前不会显示，并且渲染它。

那么有什么方法可以在 url 更改时停止异步节点服务器端调用数据，即使该异步数据尚未到来？我现在正在使用axios。

这是我的服务器渲染：

这是client.js

这是一个容器，它具有获取数据的静态方法。服务端调用匹配Container的fetchData

我试图捕捉从ReactDOM.renderor抛出的错误ReactDOMServer.renderToString。

我不能使用 componentDidCatch，因为我试图模拟 SSR 中引发的错误。我知道在 SSR 渲染中没有生命周期钩子，所以这也是我尝试使用ReactDOM.render.

这是一个示例代码

渲染期间抛出错误的组件：

还有一段代码试图捕捉抛出的错误：

此代码的结果是渲染组件的控制台日志，而不是抛出的错误。

顺便说一句 - 由于该错误，该页面没有在浏览器中呈现，但它仍然通过“尝试”并且没有被“捕获”捕获。这是为什么？

有没有办法像这样以编程方式捕获渲染错误？

谢谢。

GitHub 为我设置了一条消息，说：Bump acorn from 6.4.0 to 6.4.1 #1, and I merge, 我的项目还好吗？

我的项目是 react-ssr 演示，为什么要给我发这条消息？