Хочу кешбек моих 3 часов Error: The following dependencies are imported but could not be resolved:

Подключил react-bootstrap по офф.туториалу: npm install react-bootstrap bootstrap, скопировал тестовый код, импорты для слайдера:

    import Carousel from 'react-bootstrap/Carousel';
    
    function CarouselFadeExample() {
      return (
        <Carousel fade>
          <Carousel.Item>
            <img
              className="d-block w-100"
              src="holder.js/800x400?text=First slide&bg=373940"
              alt="First slide"
            />
            <Carousel.Caption>
              <h3>First slide label</h3>
              <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
            </Carousel.Caption>
          </Carousel.Item>
          <Carousel.Item>
            <img
              className="d-block w-100"
              src="holder.js/800x400?text=Second slide&bg=282c34"
              alt="Second slide"
            />
    
            <Carousel.Caption>
              <h3>Second slide label</h3>
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
            </Carousel.Caption>
          </Carousel.Item>
          <Carousel.Item>
            <img
              className="d-block w-100"
              src="holder.js/800x400?text=Third slide&bg=20232a"
              alt="Third slide"
            />
    
            <Carousel.Caption>
              <h3>Third slide label</h3>
              <p>
                Praesent commodo cursus magna, vel scelerisque nisl consectetur.
              </p>
            </Carousel.Caption>
          </Carousel.Item>
        </Carousel>
      );
    }

export default CarouselFadeExample;

При вызове yarn dev получаю следующую ошибку:

yarn run v1.22.19
$ vite

  VITE v4.3.1  ready in 441 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h to show help
**Error: The following dependencies are imported but could not be resolved:**

  react-bootstrap (imported by C:/Users/User/Desktop/files/Vite-react/components/Market/Market.jsx)  

Are they installed?
    at file:///C:/Users/User/Desktop/files/Vite-react/ped-project/node_modules/vite/dist/node/chunks/dep-24daf00c.js:44127:23
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async file:///C:/Users/User/Desktop/files/Vite-react/ped-project/node_modules/vite/dist/node/chunks/dep-24daf00c.js:43536:38

В чем заключается проблема? Способ решения этой ошибки не нашел. Сборка vite + js

UPDATE: В интернете было много способов...потратить время, но... Я сделал все заново, но в этот раз не кидал импорты в отдельный компонент, а сразу добавил все в App.jsx и... все заработало, видимо так и нужно делать, но как мне использовать это независимо, к примеру в виде компонента чтобы вставить куда мне нужно (Допустим у меня задумка добавить Carousel во вкладку Market, а не оставлять все как есть на главной)? Мне все пропсами передавать?? Я не знаю...