在 Netlify 上部署的 Gatsby Starter 上安装“react-bootstrap”

如何解决在 Netlify 上部署的 Gatsby Starter 上安装“react-bootstrap”

我对 gatsby 和 react 都很陌生。我正在制作一个联系表单，并希望根据使用 react-bootstrap 组件的教程来制作它，但是我不知道如何将它安装在我通过 github 存储库部署的 gatsby starter 上。>

我的代码给出了一个想法：

import React from 'react';

import Layout from '@common/Layout';
import Navbar from '@common/Navbar';

import Header from '@sections/Header';
import About from '@sections/About'; 
import Footer from '@sections/Footer';

import {Row,Col,Container,Form,Button} from "react-bootstrap" 

const IndexPage = () => (
  <Layout>
    <Navbar />
    <Header />
    <About>
      <Container>
        <Form name= "contact v1" method="post" data-netlify="true" onSubmit="submit">
         <input type="hidden" name="form-name" value="contact v1" />
          <Row>
            <Col>
              <Form.Group>
                <Form.Label>First Name </Form.Label>
                <Form.Control required size="lg" type="text"/>
              </Form.Group>
            </Col>
            <Col>
              <Form.Group>
                <Form.Label>Last Name </Form.Label>
                <Form.Control required size="lg" type="text"/>
              </Form.Group>
            </Col>
          </Row>
          <Form.Group>
                <Form.Label>How can we help? </Form.Label>
                <Form.Control required as="textarea" rows="3" placeholder="What do you do?"/>
          </Form.Group>
          <Button type="submit"> Submit </Button>
        </Form>
      </Container>
    </About>
                
    <Footer />
  </Layout>
);

export default IndexPage;

这是我在 Netlify 上部署时的错误

3:08:08 PM: Failed Building production JavaScript and CSS bundles - 15.912s
3:08:08 PM: error Generating JavaScript bundles Failed
3:08:08 PM: Can't resolve 'react-bootstrap' in '/opt/build/repo/src/pages'
3:08:08 PM: If you're trying to use a package make sure that 'react-bootstrap' is installed. If you're trying to use a local file make sure that the path is correct.
3:08:08 PM: not finished Generating image thumbnails - 20.910s
3:08:08 PM: error Command Failed with exit code 1.
3:08:08 PM: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

解决方法

正如您在 docs 中看到的，只需运行：

npm install react-bootstrap bootstrap

请记住，当您这样做时：

import {Row,Col,Container,Form,Button} from "react-bootstrap"

您正在从 node_modules 目录（特别是从 react-bootstrap 文件夹）导入组件，因此您需要先安装依赖项。