React项目引入Bootstrap Carousel报错找不到@popperjs/core如何解决

1. 依赖包安装错误：你安装的popper.js是已停止维护的旧版本，Bootstrap 5及以上版本依赖的包是@popperjs/core，两者命名空间不同，所以即使安装了旧版也无法被Bootstrap识别。
2. 组件引入错误：你从bootstrap包直接引入Carousel，如果你是从React Bootstrap官方文档复制的组件代码，正确的组件引入源应为react-bootstrap，而非原生Bootstrap包。

• 先卸载错误安装的旧版popper：

npm uninstall popper.js

• 安装正确的依赖包：

npm install @popperjs/core bootstrap react-bootstrap

• 替换页面顶部的引入代码：

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
// 从react-bootstrap引入封装好的Carousel组件
import { Carousel } from 'react-bootstrap';
// 引入Bootstrap全局样式，该行也可以放到index.js中全局生效
import 'bootstrap/dist/css/bootstrap.min.css';

是否需要在index.js中引入相同内容？
不需要重复引入Popper和Carousel组件。如果希望Bootstrap样式全局生效，可以单独将import 'bootstrap/dist/css/bootstrap.min.css'这行放到index.js中，业务组件无需重复引入样式。

内容的提问来源于stack exchange，提问作者Yasmin