Reactjs 呈现作为verdaccio包的react组件时出现问题

我们使用verdaccio将react组件作为npm包发布到verdaccionpm注册表中。
现在，在另一个react应用程序中，我们正在使用这个包，但是当我们从包中呈现导入的jsx代码时，我们遇到了错误。如果有人对这个问题有任何想法，请回复。任何帮助都将不胜感激

这是我们作为npm模块发布到verdaccio目录的react组件

反应成分：

import React from 'react';

class  myInputForm extends React.Component {
    render(){
        return(
            <form>
                 Name: <input type="text" name="name" autoComplete="off" /><br />
                 Area: <input type="text" name="area" autoComplete="off"  /><br />
                 Email: <input type="email" name="email" autoComplete="off"  /><br />
                 <button>Submit</button>
            </form>
        )
    }
    

}

export default myInputForm;

从“React”导入React；
类myInputForm扩展了React.Component{
render（）{
返回(
名称：

面积：

电子邮件：

提交
)
}
}
导出默认myInputForm；

对消耗的成分进行反应。此react组件是另一个react应用程序的一部分。

 import React from 'react';
    import {MyInputForm} from 'mynpmpackage/src/index';
    const ContactUs = ( ) => {
        return (
            <div style={{backgroundColor:'green', height: '817px'}}>
            <h1>Contact Form</h1>
            <MyInputForm />
            </div>
        )
    }

export default ContactUs;

从“React”导入React；
从“mynpmpackage/src/index”导入{MyInputForm}；
const ContactUs=（）=>{
返回(
联系方式
)
}
导出默认联系人；

npm启动后控制台上出现错误：

---

提问时，请务必添加代码作为文本。这是一个很大的代码，因此考虑先询问问题。