gatsby - 使用 gatsby-plugin-google-amp 在 Gatsby 中创建 AMP 页面，但会引入所有网站样式

Question

我很欣赏该插件不再以当前形式维护（https://www.gatsbyjs.org/packages/gatsby-plugin-google-amp/?=Amp），但想以此为基础将 AMP 页面添加到我的地点。我已经很好地安装了插件，并且能够创建所需页面的 AMP 版本。

但是，每当我尝试导入 CSS 文件或模块时，我的整个网站的所有样式都会自动添加到页面（从而使 AMP 页面无效）。我怎样才能只导入一个样式表？我尝试过使用 CSS 模块，但没有任何乐趣：

import React from "react"
import { graphql } from "gatsby"
import ampStyles from "../assets/css/amp.module.css"

没有 css 导入，页面验证正常。我只想导入一个包含我们有限的 AMP 样式的样式表。最好的方法是什么？非常感谢任何帮助。

score 0 · Accepted Answer

我以前没有构建过 AMP 应用程序，所以我不是 100% 肯定这将适用于您，但您应该能够在应用程序的顶层导入样式表，并且它下的所有组件都应该继承样式。

另一种选择可能是使用styled-components库（可在 Gatsby 中使用），因此您只需包含与 JSX/TSX 内联的组件所需的样式。

1 回答 1