如何使用全局 css 样式 sheet 包括 GatsbyJS
How to use global css style sheet includes with GatsbyJS
默认情况下，GatsbyJS 正在推动使用 css 模块和自定义 css-in-js 库，例如 glamorous and typography
不幸的是，我正在将现有站点移植到使用传统全局样式表的 GatsbyJS。将所有现有 HTML-CSS 工具转换为 CSS 模块是一件苦差事。
我目前的技巧是更新 GatsbyJS html.js 并添加一个
<link rel="stylesheet" type="text/css" href="/style.old.css" />
到header。我有 style.old.css 生活在 /public 中，但是，当构建为 运行 时，它就会消失。
我希望有一个插件来支持这个，但似乎 Gatsby 团队不鼓励全局 CSS 这对于新项目来说是可以理解的。
我试图编写一个插件来添加它，但发现有关如何编写 "style plugin".
的资源有限
你很接近！
不要将 style.old.css 放在 /public 中，而是将其放在 /layouts 中。然后，只需像这样将其导入 /layouts/index.js：
import './style.old.css'
当您启动一个新的 gatsby 项目 (gatsby new project-name) 时，您会注意到 /layouts 文件夹中有一个 index.css 文件，该文件被导入到 layouts/index.js默认。只需按照此示例添加您自己的全局样式表即可。
一般来说，你不应该直接在 /public 中放置任何东西。如果您希望静态文件最终位于 /public 文件夹中，请创建一个 /static 文件夹并将它们放在那里（Gatsby 会将 /static 中的任何文件复制到 /public你）。
默认情况下，GatsbyJS 正在推动使用 css 模块和自定义 css-in-js 库，例如 glamorous and typography
不幸的是，我正在将现有站点移植到使用传统全局样式表的 GatsbyJS。将所有现有 HTML-CSS 工具转换为 CSS 模块是一件苦差事。
我目前的技巧是更新 GatsbyJS html.js 并添加一个
<link rel="stylesheet" type="text/css" href="/style.old.css" />
到header。我有 style.old.css 生活在 /public 中，但是，当构建为 运行 时，它就会消失。
我希望有一个插件来支持这个，但似乎 Gatsby 团队不鼓励全局 CSS 这对于新项目来说是可以理解的。
我试图编写一个插件来添加它，但发现有关如何编写 "style plugin".
的资源有限你很接近！
不要将 style.old.css 放在 /public 中，而是将其放在 /layouts 中。然后，只需像这样将其导入 /layouts/index.js：
import './style.old.css'
当您启动一个新的 gatsby 项目 (gatsby new project-name) 时，您会注意到 /layouts 文件夹中有一个 index.css 文件，该文件被导入到 layouts/index.js默认。只需按照此示例添加您自己的全局样式表即可。
一般来说，你不应该直接在 /public 中放置任何东西。如果您希望静态文件最终位于 /public 文件夹中，请创建一个 /static 文件夹并将它们放在那里（Gatsby 会将 /static 中的任何文件复制到 /public你）。