WebPack - TypeError: __webpack_modules__[moduleId] is not a function (development) // Error: Invalid hook call (生产)

Question

我正在努力解决当我使用作为包托管并通过 NPM Link 进行流式传输的自定义库时发生的 WebPack 错误。同时，量产版本运行完美

这是我的脚本

"scripts": {
    "dev": "rm -rf build && NODE_ENV=development webpack",
    "build": "rm -rf build && NODE_ENV=production webpack",
},

当我使用构建脚本捆绑代码时，我得到

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 Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

而且，当我使用开发版时，我得到

TypeError: __webpack_modules__[moduleId] is not a function

/******/        };
/******/    
/******/        // Execute the module function
> /******/      __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/    
/******/        // Return the exports of the module
/******/        return module.exports;

这是我的webpack.config.js文件：

TypeError: __webpack_modules__[moduleId] is not a function

/******/        };
/******/    
/******/        // Execute the module function
> /******/      __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/    
/******/        // Return the exports of the module
/******/        return module.exports;

我的package.json：

const path = require("path");

module.exports = {
  mode: process.env.NODE_ENV,
  devtool: "source-map",
  entry: "./index.js",
  output: {
    path: path.resolve(__dirname, "build"),
    filename: "index.js",
    libraryTarget: "commonjs2",
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /(node_modules|bower_components|build)/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env", "@babel/preset-react"],
          },
        },
      },
    ],
  },
  resolve: {
    extensions: [".js", ".jsx"],
  },
  externals: {
    react: "commonjs react",
    "react-dom": "commonjs react-dom",
  },
};

我尝试了在几个讨论和文章中找到的这些修复，但没有一个起作用

{
  "description": "",
  "main": "/build/",
  "scripts": {
    "dev": "rm -rf build && webpack --watch",
    "build": "rm -rf build && NODE_ENV=production webpack",
    "test": "jest"
  },
  "peerDependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "@babel/cli": "^7.14.5",
    "@babel/core": "^7.14.5",
    "@babel/preset-env": "^7.14.5",
    "@babel/preset-react": "^7.14.5",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^12.0.0",
    "@testing-library/user-event": "^13.2.1",
    "@webpack-cli/serve": "^1.5.2",
    "babel-loader": "^8.1.0",
    "babel-plugin-transform-react-jsx": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "eslint": "^7.28.0",
    "eslint-config-standard": "^16.0.3",
    "eslint-plugin-import": "^2.23.4",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^5.1.0",
    "html-webpack-plugin": "^4.3.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "styled-components": "^5.3.1",
    "webpack": "^5.51.1",
    "webpack-cli": "^4.3.0",
    "webpack-dev-server": "^3.11.1"
  }
}

也有别名

externals: {
  react: {
    commonjs: "react",
    commonjs2: "react",
  },
  "react-dom": {
    commonjs: "react-dom",
    commonjs2: "react-dom",
  },
},

and

externals: {
  react: "commonjs react",
},

关于与开发模式相关的错误消息，我找到了这些文章 文章1和文章2，但没有一篇对我有帮助。

任何想法 ？