所以在我的react代码中没有使用useContext属性。我有一个npm包，它有一个编译过的webpack文件，其中有一个组件。当我尝试在我的react应用程序中使用该组件时，它抛出了错误Uncatched TypeError：无法读取null的属性（阅读'useContext'）。组件函数在那里，并输出一个react对象。它只是在使用它时中断页面。现在我研究了useContext是什么，我相信它与状态有关。
下面是我的输入组件，我将在我的react应用中使用

import React from 'react';
import {TextField} from  '@mui/material';
class Input extends React.Component {
  constructor(props){
    super(props)
  }
  render(){
    return (
      <div className="input" style={{position:"relative",left:this.props.tabOver? this.props.tabOver.toString()+"px":"0px"}}>
        <label style={{display:"block", width:"100%",position:"relative", margin: "5px"}}> {this.props.labelName}</label>
        <TextField
        size="small"
        onChange={(e)=>{this.props.update(e.target.value)}}
        value={this.props.value}
        label={this.props.label? this.props.label:"type here"}
        error={this.props.error? this.props.error:false}
        required={this.props.required? this.props.required:false}
        disabled={this.props.disabled? this.props.disabled:false}
        helperText={this.props.helperText? this.props.helperText:""}
        InputProps={{ style: { fontSize: this.props.InputProps? this.props.InputProp:10 } }}
        InputLabelProps={{ style: { fontSize: (this.props.InputLabelProps? this.props.InputLabelProps:12) } }}
        style={{background:'white', "borderLeft":"20px solid "+this.props.border,"borderRadius": "10px",width: this.props.width !== undefined ? this.props.width.toString()+"px":"100px"}}
        id="filled-basic"
        variant="filled" />
      </div>
    );
  }
}
export default Input;

这是我的react应用程序，它使用Input

// import logo from './logo.svg';
import './App.scss';
import React from 'react';
import {Breadcrumbs,Link,Typography} from  '@mui/material';
import {Input} from '@zenaby/something';

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

  render(){
    return (
      <div className="App">
        <ul className="header">
          <li> logo </li>
          <li> login </li>
        </ul>
        <div className="formCt">
         <Input />        
        </div>
      </div>
    );
  }
}
export default App;

我用这个webpack文件编译了这个输入

const path = require('path'); 
module.exports = {
  entry: "./compile/index.js",
  mode:"production",
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: "index.js", 
    libraryTarget: "commonjs2" 
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-react",
            "@babel/preset-env"],
            plugins: ["@babel/plugin-proposal-class-properties"]
          }
        }
 }
 ]
  },
  target: 'node'
};

我的包json也在这里

{
  "name": "somename",
  "version": "0.1.0",
  "private": false,
  "babel": {
    "presets": [
      "@babel/preset-react"
    ]
  },
  "main":"dist/header.js",
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.2.0",
    "@testing-library/user-event": "^13.5.0",
    "react-dom": "^18.1.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "pp": "babel .components -d ./dist --ignore 'node_modules'",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "description": "This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).",
  "author": "grant",
  "license": "ISC",
  "peerDependencies": {
    "react": "^18.1.0"
  },
  "devDependencies": {
    "@babel/cli": "^7.17.10",
    "@babel/plugin-syntax-jsx": "^7.17.12",
    "@babel/preset-react": "^7.17.12"
  }
}

我希望这是一个简单的答案，但在这个问题上几个小时，我没有任何果汁留在我弄清楚。事实上，这个答案可能是有帮助的很多人谁是新的npmjs组件。无论如何，谢谢你看它，任何反馈都是伟大的：）。