为了账号安全,请及时绑定邮箱和手机立即绑定

纱线工作区和无效的挂钩调用

纱线工作区和无效的挂钩调用

叮当猫咪 2022-07-01 16:17:40
尝试设置通用 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 回答

?
郎朗坤

TA贡献1921条经验 获得超9个赞

运行以下命令:

yarn why react

如果结果显示你有多个版本的 react:

  1. 删除所有本地安装

  2. 而是在根工作区安装单个版本的 React


查看完整回答
反对 回复 2022-07-01
?
aluckdog

TA贡献1847条经验 获得超7个赞

这可能是来自纱线的错误

问题: https ://github.com/yarnpkg/yarn/issues/8540

我做了一个解决方法:

  1. 将我的通用包导出到新的私有 github 存储库中

  2. 创建访问令牌 https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/creating-a-personal-access-token

  3. 在我的package.json dependencies我补充说:

  "common": "git+https://{accessToken}:x-oauth-basic@github.com/{user}/{repo}.git",


查看完整回答
反对 回复 2022-07-01
  • 2 回答
  • 0 关注
  • 169 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号