import styled from 'styled-components';
import {Button} from 'antd';
const Btn = styled(Button)`
background: red;
`;
问题： 用styled-components包裹antd组件，样式没有被覆盖？查看head中，styled的样式在antd样式前面？
其实是一个
webpack加载css过程的问题，原因是在你当前代码加载之前，已经使用过styled-components，但是没有引用antd，导致styled-components的动态样式<script>已经插入到<head>中，而antd的样式还没有加载，这样导致你在后面使用styled包裹antd样式时，antd的样式才会插入<head>，但是你的styled-component包裹的样式只会插入到之前定义好的<script>，优先级就会比antd的样式低。 这是webpack的开发环境对css的处理顺序导致的，但是在生产环境不会有，因为antd样式加载会变成静态已经打包好的css文件，而styled-components仍然是动态的。
