Attempted import error: 'injectGlobal' is not exported from 'styled-components'.
Attempted import error: ‘injectGlobal’ is not exported from ‘styled-components’.老师这个reset.css加进来总出现这样的错误怎么回事呢？
正在回答
7回答
最新版的 styled-components v4 已经将原有的 injectGlobal 方法替换成了 createGlobalStyle ，而且用法也和之前的 injectGlobal 方法不同了
（直接像 injectGlobal 方法一样写 createGlobalStyle`/***CSS样式***/` 并不能生效，要定义一个全局样式的变量）
看了一下官方文档，尝试解决了问题：
首先引入新的API createGlobalStyle ，在下面创建一个 GlobalStyle 变量，用 createGlobalStyle 方法把 reset 样式包裹在其中：
在 'src/index.js'中，去掉对 './style' 的引入（不在这里引入了）：
在 'src/App.js' 中，引入刚刚定义的 GlobalStyle ，然后将 <GlobalStyle /> 放在 render() 中最外层元素下面：
这样后面的所有元素组件都应用了 GlobalStyle 中定义的 CSS Reset 样式了
还有可能要注意一下，如果遇到类似警报：styled-components.browser.esm.js:2222 The global style component sc-global-105358235 was given child JSX. createGlobalStyle does not render children.
说明全局样式组件下存在子节点。createGlobalStyle不会去渲染子节点，这时应该检查一下你的<GlobalStyle>组件下是否包裹了其他子节点？
正确的用法是我上图中所展示的，我创建的<GlobalStyle />是个单标签，而不是下图中<GlobalStyle></GlobalStyle>这样的封闭标签（即使你用了封闭标签，也不应该在其内部添加任何子节点或组件），你只需要保证<GlobalStyle />标签在你整个React树的最上方（即App.js中）即可渲染后面的<Header />等其他所有组件。
===================
在 styled-components.browser.esm.js 的第2261行，可以看到出现该警告的判断条件是：
前半部分是项目的环境变量，主要是后半部分React.Children.count(this.props.children)，意思是当前组件（即我们创建的<GlobalStyle>组件）下的子节点的计数，子节点不为0的时候会发出警报，告知我们全局变量组件中存在子节点，子节点不能被渲染
可以把injectGlobal改为createGlobalStyle就可以了，因为styled-components版本升级了,原来的injectGlobal方法用不了
