Styled Components v3具有空主题对象

Question

启动应用程序后升级到styled-components @ latest（3.1.0）后，会抛出此错误：

Uncaught TypeError: Cannot read property 'margin' of undefined

经过检查，看起来主题对象在如下定义的组件中是空的：

export const Form = styled.form` ${({ theme }) => theme.layout.margin.all.small}; `;

在此处记录theme会返回{}，但是在jsx中的<ThemeProvider>级别，主题会按预期记录，并包含所有值。

如果我降级到2.4.0，它可以正常工作并且符合预期。

Answer 1

这可能有多种原因，但我不认为它与v3有任何关系，因为主题API没有改变。

您是否在升级时引入了循环依赖？

Answer 2

事实证明，有多个版本的样式组件相互冲突。

删除重复项并按预期工作。