使用React select在React中导入自定义组件，并使用错误崩溃:Minified React错误#188

Question

我在React(16.4(和Webpack 4中开发了一个自定义组件库。配置被弹出并导入到其他项目+ssh://[e-mail]…在package.json.上

当我在其他项目中使用这个库时，只有一个组件不起作用，它是用react select(Jed Watson(开发的select输入，点击时崩溃。

所有应用程序崩溃，我有这个错误：

未捕获错误：最小化React错误#188；参观https://reactjs.org/docs/error-decoder.html?invariant=188获取完整消息，或使用非缩小的开发环境获取完整错误和其他有用的警告。

来自上面错误链接的消息：

在未安装的组件上找不到节点。

我现在的问题是我的webpack配置，但我找不到任何解决方案来解决这个问题。

社区的最后希望。。。

Answer 1

我也遇到过类似的情况——我正在开发一个自定义组件库，并将其导入到一个外部项目中。我遇到了react bootstrap、react transition group和其他在生产中动态装载/卸载DOM元素的外部库的问题；缩小的react错误#188将导致生产构建崩溃。以下是我在module.exports(dev和prod配置(下的webpack配置中解决它的方法：

alias: {
// Support React Native Web
// https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
"react-native": "react-native-web",
react: path.resolve("./node_modules/react"),
"react-dom": path.resolve("./node_modules/react-dom"),
"react-transition-group": path.resolve(
"./node_modules/react-transition-group"
)
}

这应该覆盖所有依赖项中这些特定库的任何其他实例；无论何时导入/使用它们，它们都会被迫使用我的项目在package.json中指定的版本。请记住，我使用的是Webpack 3，因此Webpack 4的修复程序可能会有所不同。

Answer 2

谢谢Abi。

我只是用另一种方法解决了这个问题。我在我的webpack配置中的"externals"中添加了所有库，如下所示：

externals: [
'react-select': {
root: 'ReactSelect',
commonjs2: 'react-select',
commonjs: 'react-select',
amd: 'react-select',
},
]