Reactjs React不会加载Webpack 5，但会加载到Webpack 4中

我制作了一个React组件库，它与Webpack4配合得非常好。当我升级到Webpack 5时，它仍在编译，但它给了我一些警告：

./src/index.tsx中的警告6:24-35 在“@dlcm/dlcm共享模块”中找不到导出“GridContent”（导入为“GridContent”）（模块没有导出）

在浏览器控制台中，会抛出以下错误：

未捕获的TypeError:无法读取未定义的属性“Component”

它试图使用React.Component类来扩展我的组件，但是

var React = __webpack_require__(/*! react */ "react");

返回未定义的

// webpack.config from my library
const path = require('path');

module.exports = {
    optimization:{
        minimize: false, // <---- disables uglify.
        // minimizer: [new UglifyJsPlugin()] if you want to customize it.
    },
    entry: './src/index.ts',
    target: "web",
    module: {
        rules: [
            {
                test: /\.s[ac]ss$/i,
                use: [
                    // Creates `style` nodes from JS strings
                    "style-loader",
                    // Translates CSS into CommonJS
                    "css-loader",
                    // Compiles Sass to CSS
                    "sass-loader",
                ],
            },
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
            },
        ],
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
    },

    externals: {
        'react': {
            root: 'React',
            commonjs2: 'react',
            commonjs: 'react',
            amd: 'react',
            umd: 'react',
        },
        'react-dom': {
            root: 'ReactDOM',
            commonjs2: 'react-dom',
            commonjs: 'react-dom',
            amd: 'react-dom',
            umd: 'react-dom',
        },
    },

    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'index.js',
        library: {
            name: 'DlcmLib',
            type: 'umd',
        }
    }
};

导入反应，例如按钮如下：

import * as React from 'react';
import './Button.scss';

export class Button extends React.Component<any, any> {
...

（与webpack 4.46.0配合使用）

---

我做错了什么？

问题出在线路上

"type": "module",

在库的package.json中

我真的不明白问题和解决方案之间有什么联系，所以如果有人有线索，请回答，我很好奇

  "devDependencies": {
    "@types/react": "^17.0.8",
    "@types/react-dom": "^17.0.5",
    "css-loader": "^5.2.6",
    "html-webpack-plugin": "^5.3.1",
    "http-server": "^0.12.3",
    "sass": "^1.34.0",
    "sass-loader": "^11.1.1",
    "style-loader": "^2.0.0",
    "ts-loader": "^9.2.2",
    "typescript": "^4.3.2",
    "webpack": "^5.38.0",
    "webpack-cli": "^4.7.0"
  },
  "dependencies": {
    "@babel/core": "^7.14.3",
    "@babel/plugin-transform-runtime": "^7.14.3",
    "@babel/preset-env": "^7.14.2",
    "@babel/preset-react": "^7.13.13",
    "@dlcm/dlcm-shared-modules": "^1.0.0",
    "babel-loader": "^8.2.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  }

"type": "module",