injectGlobal 已被彻底移除，v4+ 必须用 createGlobalStyle 替代；它返回一个需挂载的 React 组件，非函数调用，且样式为真全局，需手动控制作用域。
injectGlobal 已被彻底移除，v4+ 必须用 createGlobalStyle 替代——这不是兼容层，是强制重构。
为什么 injectGlobal 会报错“not a function”
v4 开始，injectGlobal 不再导出，直接调用会触发 TypeError: injectGlobal is not a function。它不是被“deprecated”，而是从源码中删掉了。哪怕你装的是 v4.0.0，也找不到这个函数。
- 检查版本：
yarn list styled-components或npm ls styled-components，确认是否 ≥4.0.0 - 旧项目升级后未改写法，常见于迁移时只更新了包，没动样式入口文件
-
createGlobalStyle返回的是一个 React 组件，不是执行函数，不能直接调用
createGlobalStyle 必须作为组件挂载到 DOM 树中
它不像以前那样“执行即注入”，而是一个需要被渲染的组件，且必须出现在 React 渲染树的顶层（比如 App 或 Root 的最外层）。
- 定义方式：
export const GlobalStyle = createGlobalStyle`body { margin: 0; }` - 使用方式：
<GlobalStyle />—— 必须带闭合标签，不能省略斜杠 - 挂载位置：必须在
React.StrictMode或根Fragment内部，且不能被条件渲染包裹（例如不能放在{show && <GlobalStyle />}中） - 多次挂载无副作用，但仅首次生效；重复定义多个
GlobalStyle组件也 OK，样式会合并
全局重置样式（reset）容易漏掉的关键选择器
很多团队手写 reset 时只清 body，结果 button、input、textarea 默认边框/内边距/字体仍不一致，导致 UI 毛刺。
- 建议至少包含：
html, body, div, p, h1-h6, ul, ol, li, form, input, button, textarea, select, option - 别忘了
box-sizing: border-box要作用在*::before, *::after上，否则伪元素可能破坏布局 -
font-family和line-height建议显式声明，避免不同浏览器默认值差异 - 如果项目用 CSS-in-JS 主题系统，
GlobalStyle里不要硬编码颜色值，可传入theme：const GlobalStyle = createGlobalStyle(({ theme }) => `body { background: ${theme.bg}; }`)
最常被忽略的一点：createGlobalStyle 定义的样式没有自动 scope，它就是真·全局 CSS，所以写 div { ... } 就真的会影响所有 div。别把它当成“安全的 reset”，该加前缀或限定范围时得自己控制。
