我已经创建了具有类似React-Bootstrap形式的简单ReactJS组件

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="shortname"></div>
<div class="name" class="name" title="" data-id="Testing New"></div>

<div class="shortname"></div>
<div class="name" class="name" title="" data-id="Hello HI"></div>

<div class="shortname"></div>
<div class="name" class="name" title="" data-id="Hello Testing"></div>

但是当我在代码中调用它时，出现了错误

import React from "react"; 
import Form from "react-bootstrap/lib/Form"; 
import Button from "react-bootstrap/lib/Button";

export default class TestForm extends React.Component{
    render() {
        return (
            <Form>
                <Form.Group controlId="formBasicEmail">
                    <Form.Label>Email address</Form.Label>
                    <Form.Control type="email" placeholder="Enter email" />
                    <Form.Text classname="text-muted">
                        We'll never share your email with anyone else.
                    </Form.Text>
                </Form.Group>

                <Form.Group controlId="formBasicPassword">
                    <Form.Label>Password</Form.Label>
                    <Form.Control type="password" placeholder="Password" />
                </Form.Group>
                <Form.Group controlId="formBasicCheckbox">
                    <Form.Check type="checkbox" label="Check me out" />
                </Form.Group>
                <Button variant="primary" type="submit">
                    Submit
                </Button>
            </Form>
        );
    } 
}

什么会导致这种类型的错误？