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

时间:2018-06-17 09:42:21

标签: reactjs react-router gatsby

我有一个简单的项目,可以很好地使用JSX / React / Gatsby。

我在另一个项目的HTML中有一个预先存在的页面(想想着陆页),非常复杂,使用Bootstrap 4进行​​了很好的样式,我们称之为LandingPage.html和相关的LandingPage.css。

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

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

注意:我尝试将LandingPage.html和LandingPage.css放入/ public文件夹,实际上这确实有效!所以也许我已经回答了我自己的问题。但这是正确的方法吗?

2 个答案:

答案 0 :(得分:3)

从Gatsby v2开始(不了解以前的版本),将文件添加到/static文件夹可能更加一致。

根据the docs/public文件夹是在构建站点时自动生成的,应将其添加到.gitignore

在构建站点时,添加到/static文件夹中的文件将被复制到/public,因此它具有相同的效果。更多信息here

答案 1 :(得分:0)

完全有效!只要确保不要在Gatsby中创建覆盖页面的另一个页面: - )