问题标签 [react-static]

dynamicMeta 将来自 CMS。我真的不明白为什么它不起作用。

我们有一个大型而复杂的传统 React 应用程序，我们在过去几年中一直在构建它。它加载一个 index.html 注入 javascript 并像往常一样从 API 获取数据。不幸的是，冷加载时间非常糟糕（平均 5 - 7 秒）。加载完所有内容后，它像往常一样快速，但冷加载时间在特定的“关键”页面中扼杀了我们。这些是我们的公共用户页面，格式为：https://mywebsite/userId

我们正在寻找一种方法来显着加快这些路由的加载时间，并使用超越代码拆分或资源优化的方法。我们已经这样做了，并且正在通过 CDN 为我们的应用程序提供服务。

我们已经研究过为这些用户页面创建静态“快照”，我们需要使用 react-static 之类的东西快速加载它们，并将它们作为静态版本提供并在以后进行水合。使用 next.js 或 gatsby 之类的东西重写我们的项目不是一种选择，因为它需要太多的工作。SSR 也不是一个选项，因为我们的整个后端都是用 Django 而不是 Node.js 编码的

我们走在正确的轨道上吗？是否有可能/值得使用 react-static （或类似的工具）来做到这一点？有很多关于如何从头开始创建 react-static 项目的文档，但没有关于如何转换现有项目的文档，即使它只是我们需要的一小部分路由。

此外，一旦我们用户页面上的数据发生变化，我们如何触发适当快照的“重建”？用户不会经常更新他们的数据，大约每月 4 次中的 3 次，但我们有 3K 用户，所以平均每小时更新 15 次。我们可以只触发实际更改的路由的重建吗？

我对 react-static 非常陌生，并且正在尝试调整现有的 react-router 应用程序以使用它。我的static.config.js设置为：

然后index-react-static.js与来自的样板相同react-static create：

然后AppReactStatic.js作为：

但是，ObjectDetailPage接收的道具不包括location（或history或match）。我的设置中缺少什么？

我的错误的堆栈跟踪似乎确实表明withRouter正在包装我的组件：

我不知道如何解决这个问题，但我尝试了很多可能只是愚蠢的事情。我只想完成将我的 react-app 更改为 react-static-app，这样我就可以完成我的项目。Everething 在本地工作，我知道它与服务器和客户端 JS 有关，但我不知道从哪里开始。请帮忙。

这是我从常规yarn build得到的错误：

这是我运行yarn build --debug时得到的：

没有任何迹象表明问题出在哪里。我已经if(typeof window === "undefined") return null;在我的项目周围放置了所有东西，但没有运气。

这是我的 package.json，以防它有助于解决这个问题：

在一个 React Static 应用程序中，我在公共文件夹中有一个名为的文件夹admin，其中有一个index.html如下所示：

和一个config.yml看起来像这样的邻居文件：

在开发模式下启动应用程序时，npm start一切正常，CMS 可以在'localhost:3000/admin'. 当尝试构建它（react static build）然后提供dist文件夹（serve dist -p 3000 -s）时，我无法再访问它/admin，因为它返回主页服务器端呈现的页面。尝试访问时，/admin/index.html我得到一个301 Moved Permanently (from disk cache). 有什么解决方案吗？

我正在将我的 React 站点迁移到 react-static。我在 scss 文件中有一个 css，我react-static-plugin-sass在我的项目中使用。如何正确设置我的 scss 文件中图像的 URL？

我试过这个：

但是当我运行该站点时，它给了我以下错误：

无法获取 /assets/images/bg-illustration.jpg

我的资产位于 src 文件夹中：

似乎 scss 文件中提到的所有图像都没有复制到带有资产的结果文件夹中。

我很感激有关如何在 react-static 构建中修复它的任何信息。

我有一个使用 react-static 构建的应用程序。我注意到所有页面（路由）的 CSS 都合并到一个大的 styles.css 文件中。是否可以为每个页面生成单独的 CSS 文件？

现在，如果我运行build命令，则 dist 文件夹中有一个 css 文件，两个页面都有 css，我想为 MainPage 和 AboutPage 获取单独的 css 文件。

这是我的static.config.js文件的样子：

这是完整的代码：https ://github.com/annmirosh/react-static-test

感谢你的帮助！

运行以下并选择所有默认选项，但无法在浏览器中访问该应用程序。

然后我cd到新生成的项目目录并准备部署。

我得到了一些不错的输出

然后失败：

使用 npm 而不是 yarn 构建服务会在我的网络上打开该站点，但在本地主机主机上它仍然无法运行。

我在我的应用程序和内容 API 中使用 react-static 来加载我的数据。我有一个ebooks数组，每个数组元素都有一个redirectUrl字段，该字段指向一个新页面（另一个名为 的数组的一部分pdf），其中包含该元素的 pdf。数组中的每个元素ebooks都是一个页面，其中包含一个按钮，该按钮重定向到redirectUrl包含数组中相应元素的页面pdf。

eBook数组的元素在哪里eBooks。我已经像这样设置了static.config.js文件

并在返回语句中

在提交时，我被重定向到正确的 url，即{eBook.fields.redirectUrl}但页面是空的，而不是 pdf-viewer。我哪里错了。

当我使用 localStorage 时，我无法构建 react-static 应用程序。下面的例子：

应用程序与npm starton完美配合localhost。但是当我尝试构建时，我会收到如下错误：

当我从代码构建中删除 localStorage 时工作正常。是否可以使用 localStorage 构建 react-static 应用程序？