javascript - 函数 createFiberrFromTypeAndProps 中的错误

Question

import React from 'react';
import {
    MDBContainer,
    MDBCarousel,
    MDBCarouselInner,
    MDBCarouselItem,
    MDBTestimonial,
    MDBAvatar,
    MDBIcon
} from 'mdbreact';

const TestimonialsPage = () => {
  return (
    <MDBContainer>
      <section className='text-center my-5'>
        <h2 className='h1-responsive font-weight-bold my-5'>Testimonials</h2>

        <MDBCarousel
          activeItem={1}
          length={3}
          testimonial
          interval={false}
          showIndicators={false}
          className='no-flex'
        >
          <MDBCarouselInner>
            <MDBCarouselItem itemId='1'>
              <MDBTestimonial>
                <MDBAvatar className='mx-auto mb-4'>
                  <img
                    src='https://mdbootstrap.com/img/Photos/Avatars/img%20(30).jpg'
                    className='rounded-circle img-fluid'
                    alt=''
                  />
                </MDBAvatar>
                <p>
                  <MDBIcon icon='quote-left' /> Lorem ipsum dolor sit amet,
                  consectetur adipisicing elit. Quod eos id officiis hic tenetur
                  quae quaerat ad velit ab. Lorem ipsum dolor sit amet,
                  consectetur adipisicing elit. Dolore cum accusamus eveniet
                  molestias voluptatum inventore laboriosam labore sit,
                  aspernatur praesentium iste impedit quidem dolor veniam.
                </p>
                <h4 className='font-weight-bold'>Anna Deynah</h4>
                <h6 className='font-weight-bold my-3'>Founder at ET Company</h6>
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon far icon='star-half' className='blue-text' />
              </MDBTestimonial>
            </MDBCarouselItem>
            <MDBCarouselItem itemId='2'>
              <MDBTestimonial>
                <MDBAvatar className='mx-auto mb-4'>
                  <img
                    src='https://mdbootstrap.com/img/Photos/Avatars/img%20(31).jpg'
                    className='rounded-circle img-fluid'
                    alt=''
                  />
                </MDBAvatar>
                <p>
                  <MDBIcon icon='quote-left' /> Nemo enim ipsam voluptatem quia
                  voluptas sit aspernatur aut odit aut fugit, sed quia
                  consequuntur magni dolores eos qui ratione voluptatem sequi
                  nesciunt. Neque porro quisquam est, qui dolorem ipsum quia
                  dolor sit amet, consectetur, adipisci velit, sed quia non
                  numquam eius modi tempora incidunt ut labore.
                </p>
                <h4 className='font-weight-bold'>Maria Kate</h4>
                <h6 className='font-weight-bold my-3'>
                  Photographer at Studio LA
                </h6>
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
              </MDBTestimonial>
            </MDBCarouselItem>
            <MDBCarouselItem itemId='3'>
              <MDBTestimonial>
                <MDBAvatar className='mx-auto mb-4'>
                  <img
                    src='https://mdbootstrap.com/img/Photos/Avatars/img%20(3).jpg'
                    className='rounded-circle img-fluid'
                    alt=''
                  />
                </MDBAvatar>
                <p>
                  <MDBIcon icon='quote-left' /> Duis aute irure dolor in
                  reprehenderit in voluptate velit esse cillum dolore eu fugiat
                  nulla pariatur. Excepteur sint occaecat cupidatat non
                  proident, sunt in culpa qui officia deserunt mollit anim id
                  est laborum. Sed ut perspiciatis unde omnis iste natus error
                  sit voluptatem accusantium doloremque laudantium.
                </p>
                <h4 className='font-weight-bold'>John Doe</h4>
                <h6 className='font-weight-bold my-3'>
                  Front-end Developer in NY
                </h6>
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon icon='star' className='blue-text' />
                <MDBIcon far icon='star' className='blue-text' />
              </MDBTestimonial>
            </MDBCarouselItem>
          </MDBCarouselInner>
        </MDBCarousel>
      </section>
    </MDBContainer>
  );
};

export default TestimonialsPage;

我一直在尝试使用 mdbreact 在我的 React 应用程序和 Gatsby 中使用 Bootstrap Testimonial。

我收到此错误：函数 createFiberFromTypeAndProps 中的错误

元素类型无效：应为字符串（用于内置组件）或类/函数（用于复合组件）但得到：未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。检查TestimonialsPage.

无法生成代码帧

我检查了所有的进口、出口、camelCasing，一切都是正确的。

标签： javascriptreactjsjsx

Answer 1

对我来说，您似乎根本没有导出 tesimonials 组件。

    export default const TestimonialsPage = () => {

}