我正在尝试创建几个react组件，并将其作为包发布到npm中，以便其他项目可以通过导入包来使用它们。
我的软件包是“样品测试”，可在（https://www.npmjs.com/package/sample-testing）。
使用“webpack”和“babel loader”来translate jsx文件。
当我试图使用这个包中的组件时，出现以下错误。

**Minified React error #321;访问https://reactjs.org/docs/error-decoder.html?invariant=321获取完整消息，或使用非minified dev环境获取完整错误和其他有用警告。

这个错误是来只有当我使用材料的ui组件内包，而不是与常规的html组件。

**.babelrc

{
 "presets": ["react", "env", "stage-0"]
  }

字符串

wepack.config.js

var path = require("path");

module.exports = {
  mode: "production",
  entry: {
    TButton: "./src/TButton.jsx"
  },
  output: {
    path: path.resolve("lib"),
    filename: "[name].js",
    libraryTarget: "commonjs2"
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules)/,
        use: "babel-loader"
      }
    ]
  }
};

型

TButton.jsx

import React from "react";

import TextField from "@material-ui/core/TextField";

class TButton extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    return <TextField id="standard-basic" label="Standard" />;
  }
}

export default TButton;

型
这里是codesandbox链接（https://codesandbox.io/s/xenodochial-mcclintock-xtkh6?file=/src/index.js）复制的错误，我在我的项目中使用时，我在我的项目。请帮助我解决它。