带有npm链接的样式组件导致错误：“尝试插入新样式标记，但是已卸载给定节点”

Question

我创建了自己的npm包（使用nwb创建），其中我使用了styled-components。在我的消费应用程序中，我也使用样式组件。

问题是。通过npm install安装我的npm包时，一切正常。但是，使用npm link时，进入其他反应路由器路由时会出现以下错误消息：

Error: Trying to insert a new style tag, but the given Node is unmounted!

* Are you using a custom target that isn't mounted?
* Does your document not have a valid head element?
* Have you accidentally removed a style tag manually?

在我的npm包中，我将样式组件设置为对等依赖项和devDependency，如下所示：

...
"peerDependencies": {
  "react": "16.x",
  "styled-components": "^3.4.4"
},
"devDependencies": {
  "karma-junit-reporter": "^1.2.0",
  "nwb": "0.23.x",
  "react": "^16.4.2",
  "react-dom": "^16.4.2",
  "styled-components": "^3.4.4"
},
...

使用npm link时为什么样式组件无法正常工作？

Answer 1

我认为这是因为你安装了两个styled-components实例。

因此，在styled-components中删除package.json作为devDependency并尝试使用$ npm link或者如果使用npm> 5.1.0，请尝试使用npm link --only=production，这将排除dev依赖项安装。

注意：请在运行node_modules之前删除$ npm link