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

Question

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

9

我有一个使用JSX/React/Gatsby技术开发的简单项目。

我另外一个项目中有一个复杂的、使用Bootstrap 4精美样式设计的预设页面（比如着陆页），我们称之为LandingPage.html和相关的LandingPage.css。

我想将这个预设页面添加到我的Gatsby网站中。例如，当导航到localhost:3000/LandingPage.html时，可以显示出完整的着陆页并呈现出正确的样式。

我不确定是否需要将我预设的HTML完全转换成React组件/JSX？还是只需在Gatsby项目结构中合理地放置LandingPage.html（以及相关的样式文件）就可以了？或者是否需要创建一个React的“包装器”，在“运行时”读取LandingPage.html和LandingPage.css的内容？

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

- ubienewbie

你能在 gatsby develop 开发模式下导航到其他路由吗？当我将一个 index.html 文件作为我的 /static 目录下的首页时，我无法访问 /about 或任何其他路由。我必须先构建项目，提供静态文件，然后才能导航到其他页面。你知道如何解决这个问题吗？ - Joseph

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Federico Rodríguez · Accepted Answer

自 Gatsby v2 版本开始（不确定之前的版本），更加一致的做法可能是将文件添加到 static 文件夹中。

根据文档，public 文件夹应该在构建站点时自动生成，并且应添加到 .gitignore 中。

添加到 static 文件夹中的文件在构建站点时会被复制到 public 目录中，因此应该具有相同的效果。更多信息请参见这里。