我目前import在我的一个组件中使用 CSS 文件。这些样式表添加为link标签在<head>，并将在全球范围内推出：
import './src/styles/normalize.module.css';
我也在使用样式组件.
目前，link全局CSS生成的标签imports 土地以下样式组件 style标签，在<head>:
我想要样式组件 to be more具体的，即出现above the link来自 CSS 的标签imports.
有什么办法可以做到这一点吗？
PS：我正在使用 GatsbyJS，但这可能与问题无关。
Gatsby 确实有一个地方可以控制头部组件中标签的顺序，它是onPreRenderHTML https://www.gatsbyjs.org/docs/ssr-apis/#onPreRenderHTML.
然而，我摆弄了一下它，但它没有帮助，因为在 gatsby 开发期间没有提取导入的 css，并且样式组件似乎没有在这个钩子中附加其样式标签。
我尝试过的还有两件事有效，两者都在本文档中进行了描述。 https://www.gatsbyjs.org/docs/creating-global-styles/#add-global-styles-with-css-files-and-no-layout-component
- 将全局 CSS 导入到
gatsby-browser.js。看来那里的进口款式首先被采用
- 让样式组件通过以下方式处理全局样式createGlobalStyle https://www.gatsbyjs.org/docs/creating-global-styles/#add-global-styles-with-css-files-and-no-layout-component（如果您使用第 3 方 css，这并不总是可行。）
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
