Question

我目前正在import将CSS文件放入其中一个组件中。这些样式表将作为link标签添加到<head>中，并且将在全球范围内可用：

import './src/styles/normalize.module.css';

我也在使用样式化组件。

当前，全局CSS link生成的import标签位于style中 styled-component <head>标签下方：

我希望样式化组件更具体，即在CSS link标签上{strong>上方出现{1}}个。

有什么方法可以做到吗？

PS：我正在使用GatsbyJS，但这可能与问题无关。

Answer 1

盖茨比（Gatsby）确实有一个地方可以控制标签在头部组件中的顺序，即onPreRenderHTML。

但是我稍微摆弄了一下，这没有用，因为在gatsby开发期间未提取导入的CSS，而样式化组件似乎未在其上附加其样式标签。

我仍然尝试了两件事，both described in this docs.

Answer 2

如果您有这样的布局，请尝试在<App />

内部导入全局

<ThemeProvider theme={theme}>
   <App />
</ThemeProvider>