问题标签 [react-snap]

这是我的路线。当我使用 react-snap post build 时，只有第一条路线被抓取，而不是其他路线。

这是我的 package.json

谁能让我知道可能是什么问题？

我正在使用 React snap 进行 SEO。

这就是我所做的。

我在我的反应应用程序中将以下内容添加到 index.js

然后我将以下内容添加到 package.json

当我npm run build在页面上运行并查看源代码时，我看不到页面所需的实时元描述和标题。

我究竟做错了什么？

这是我设置元标记的方法。

在 BookDetail.jsx 中

应用结构

我有一个正在部署到 Heroku 的应用程序。文件夹结构如下所示：

我的后端package.json负责构建create-react-app前端，通过执行build命令：

我已package.json按照此github 问题评论中的说明修改了我的前端。一切似乎都运行良好，但Heroku 抱怨超过最大 slug size (500mb)。

我的问题

我可以以某种方式改进此配置，以使 slug 大小保持在限制之下吗？似乎安装 puppeteer 和 chrome buildpacks 需要大量的 slug 空间——这可以以某种方式最小化吗？

我已经安装了 react-snap 并希望它为我的页面编制索引，以便它们可用于 SEO；我已根据以下 dockerfile 与 docker 集成。但是，每当我进行 docker build 时，它都会显示“从 1 中抓取 1 (/)”，所以我认为它不会占用我的整个站点。有谁知道如何解决？

Docker 文件是：

我也有 package.json：

我在我的页面上使用路由器链接。实施 react-snap 后，那些停止正常工作，附加路由。我查看了生成的 HTML，那里一切正常。

看看https://static.lernzettel.org/metrum/上的绿色按钮- 通过此链接访问页面时，链接无法正常工作 - 但是，从主页导航到那里时一切都很好。

https://lernzettel.org/metrum是不使用 react-snap 的版本——在这两种情况下都没有问题。我希望这对于演示来说已经足够好了。相关代码为：

post.meta.previous_post.slug 在这种情况下是 "/kadenz" | 我用的是vuetify，应该渲染成普通的router-link | 路由器处于历史模式。

你对如何处理这个有任何想法吗？

感谢您提前提供任何帮助；）

我在我的 VueJS 网站https://lernzettel.org上使用 react snap

但是，react-snap 引入了内容的双重优先加载，即

1. 显示预渲染版本
2. 预渲染版本消失
3. 内容从 CMS 加载并显示

如何禁用初始页面加载的第 2 步和第 3 步。

提前致谢。

我目前正在尝试预渲染我的路由，以便它们可以作为静态站点放置在 S3 上，而无需将错误页面指向index.html. 即使应用程序可以运行，HTTP 响应仍然是 404。

所以我试图react-snap预渲染我的路线。它适用于除身份验证之外的所有路由。例如，如果用户访问/dashboard，他将被重定向到/login。所以然后react-snap渲染/login路线的/dashboard路线。

有没有更好的方法来做到这一点？提前致谢。

编辑：我正在使用 react-router 进行客户端路由。页面的预渲染只是为了让 S3 在初始加载时不会将错误页面用于其他路由。

我正在尝试在托管在 heroku 上的 reactjs 项目中设置 react-snap。我按照 react-snap READme 上的说明进行操作，并在我的客户端 index.js 中包含以下内容：

当我尝试部署到 heroku 时，出现以下错误：

我npm i puppeteer在客户端运行，并且能够找到 puppeteer 目录，但它只包含 win64-722234。我需要做一些特别的事情来安装 linux 目录吗？

我在windows环境下开发

美好的一天，我正在尝试将自定义 CSS 添加到材质 UI 应用栏，但我使用 makeStyles 函数应用的所有样式都被默认的材质 UI 样式覆盖。唯一的解决方法是将 !important 应用于我的样式，但我不认为这是一个可行的解决方法。按照文档，它声明使用 StylesProvider 组件来配置 CSS 注入顺序，但这也没有证明任何结果。请任何帮助将不胜感激这里是我试图做的一个例子。

索引.js

使用 MakeStyles 的组件

注意我在这个项目中使用 React-Snap，所以我不确定这是否是它破坏的原因，https://www.npmjs.com/package/react-snap

我完成了 的设置react-snap，但是当推送到Heroku它时失败。

https://www.npmjs.com/package/react-snap

你知道为什么吗？

我添加了所需的构建包：