Reactjs 来自定制React挂钩和React组件的NPM包

我是NPM库开发的新手，在使用该库时遇到了一些麻烦

我试图做的是导出一个React钩子和一个React组件。 当我在我的应用程序中定义和使用钩子和组件时，它们工作得很好，但是导出它们会导致下面提到的问题

这是我的

package.json

。。。
“脚本”：{
“构建”：“网页包”，
},
“依赖性”：{
“@babel/core”：“^7.12.3”，
“@babel/plugin提案类属性”：“^7.12.1”，
“@babel/preset env”：“^7.12.1”，
“@babel/preset react”：“^7.12.5”，
“@babel/preset typescript”：“^7.12.1”，
“@types/node”：“^8.0.14”，
“@types/react”：“^16.9.56”，
“@types/react-dom”：“^16.9.9”，
“巴别塔”：“^6.23.0”，
“巴别塔加载器”：“^8.2.1”，
“css加载器”：“^5.0.1”，
“节点sass”：“^5.0.0”，
“反应”：“^17.0.1”，
“react dom”：“^17.0.1”，
“sass加载程序”：“^10.0.5”，
“样式加载器”：“^2.0.0”，
“ts加载器”：“^8.0.11”，
“类型脚本”：“^4.0.5”，
“网页包”：“^5.4.0”，
Web包cli“^4.2.0”
},
“对等关系”：{
“反应”：“^17.0.1”，
“react dom”：“^17.0.1”，
}

这是我的输入文件：

//index.ts
从“./hooks/customHook”导出{useCustomHook}
从“./components/CustomComponent”导出{default as CustomComponent}

这是我的

webpack.config.js

const path=require（'path'）；
module.exports={
条目：path.join（uu dirname，'index.ts'），
输出：{
path:path.join（uu dirname，'dist'），
文件名：“index.js”
},
模块：{
规则：[
{
测试：/\.tsx？$/,，
排除：/node_模块/，
使用：'babel loader'
},
{
测试：/\.scss$/,，
用法：['style-loader'，'css-loader'，'sass-loader']
}
]
},
决心：{
扩展：['.ts'、'.tsx'、'.js'、'.json']
}
}

问题/议题

当我导入并使用我的

useCustomHook

时，我会得到一个

类型错误：对象不是函数或其返回值不可编辑

。我怎样才能避免呢

我是否可以避免使用

react

和

react dom

作为

devDependencies

，因为我已经在

peerDependencies

所以我想： 最简单的解决方案是抛弃

webpack

，改用

rollup

。然后一切都很简单