尝试设置通用 UI 库时遇到很多麻烦。我设置了一个纱线工作区,如下所示:/monorepo /common-16.13 /react-app-16.8. /another-app-16.13然后我导入common-16.13并react-app-16.8使用如下组件之一: /react-app/home.js import {SharedComponent} from "common"但是,当我运行应用程序时,出现此错误:react.development.js?80c6:1465 Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:1. You might have mismatching versions of React and the renderer (such as React DOM)2. You might be breaking the Rules of Hooks3. You might have more than one copy of React in the same app里面常见的我有:/src/components/SharedComponent.jsx: import React from 'react'; import { Box } from 'material-ui/core'; export const ShareComponent = ()=> <Box>SharedComponent</Box>;/src/components/index.js: export { SharedComponen t} from 'SharedComponent';/src/index.js: export {SharedComponent } from './components';所以我捆绑普通。然后在我的 react-app 中安装 @lib/common。然后我将 SharedComponent 导入我的反应应用程序:/react-app/src/index.js: import { SharedComponent } from '@libs/common';/react-app/webpack.config.js:{ // Each key value generate a page specific bundle entry: { index: './src/index.jsx', }, module: { rules: [ { test: /\.(js|jsx)$/, exclude: /node_modules/, loader: 'babel-loader' }, ] }, // Automatically resolve below extensions // Enable users to leave off the extensions when importing resolve: { extensions: ['*', '.js', '.jsx', '.css', 'scss'], alias: { react: path.resolve('./node_modules/react'), } }, output: { path: path.resolve(ROOT_PATH, 'dist'), publicPath: '/', filename: '[name].bundle.js', chunkFilename: '[id].bundle.js' },};它捆绑得很好,但是当我运行应用程序时,我遇到了上面的错误。我不知道它是否与我如何导出我的通用组件有关,但它似乎是正确的。我读到我应该在我的应用程序中有一个反应别名,我这样做了。我正在使用纱线工作区,但不确定这是否以某种方式相关。
2 回答
aluckdog
TA贡献1847条经验 获得超7个赞
这可能是来自纱线的错误
问题: https ://github.com/yarnpkg/yarn/issues/8540
我做了一个解决方法:
将我的通用包导出到新的私有 github 存储库中
在我的
package.jsondependencies我补充说:
"common": "git+https://{accessToken}:x-oauth-basic@github.com/{user}/{repo}.git",添加回答
举报
0/150
提交
取消
