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}; `;

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

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

Answer 1

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

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

Answer 2

原来有多个版本的 styled-components 相互冲突。

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