将预先存在的静态 HTML 页面添加到 React/Gatsby 站点的最快方法

Question

我有一个使用 JSX/React/Gatsby 运行良好的简单项目。

我在另一个项目中的 HTML 中有一个预先存在的页面（想想登陆页面），非常复杂，使用 Bootstrap 4 设计得很好，我们称之为 LandingPage.html 和关联的 LandingPage.css。

我想将登录页面添加到我的 Gatsby 网站。因此，例如，当导航到 localhost:3000/LandingPage.html 时，登录页面会显示，样式正确等。

我不清楚是否必须将我预先存在的 HTML 完全转换为 React 组件/JSX？或者我是否可以通过将 LandingPage.html（和相关的样式文件）放在我的 Gatsby 项目结构中的某个合理位置来提供它？或者我是否必须创建一个在“运行时”读取 LandingPage.html 和 LandingPage.css 内容的反应“包装器”？

注意：我已经尝试将 LandingPage.html 和 LandingPage.css 放入 /public 文件夹中，实际上确实有效！所以也许我已经回答了我自己的问题。但这样做的方法正确吗？

Answer 1

从 Gatsby v2 开始（不知道以前的版本），将文件添加到文件/static夹中可能更一致。

根据文档，该/public文件夹是在构建站点时自动生成的，应该添加到.gitignore.

添加到/static文件夹的文件将/public在构建站点时复制到其中，因此它应该具有相同的效果。更多信息在这里。