You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

cdbreact导入CDBFooter组件提示导出不存在报错

问题现象

调用cdbreact提供的React Bootstrap 5 Footer组件,按照文档说明完成配置与代码编写后,运行项目抛出找不到CDBFooter导出的错误。

问题代码
import React from 'react';
import { CDBFooter, CDBFooterLink, CDBBtn, CDBIcon, CDBContainer } from 'cdbreact';

const Footer = () => {
  return (
    <CDBFooter className="shadow">
      <CDBBox
        display="flex"
        justifyContent="between"
        alignItems="center"
        className="mx-auto py-4 flex-wrap"
        style={{ width: '80%' }}
      >
        <CDBBox display="flex" alignItems="center">
          <a href="/" className="d-flex align-items-center p-0 text-dark">
            <span className="ml-4 h5 mb-0 font-weight-bold">Devwares</span>
          </a>
          <small className="ml-2">&copy; Devwares, 2022. All rights reserved.</small>
        </CDBBox>
        <CDBBox display="flex">
          <CDBBtn flat color="dark" className="p-2">
            <CDBIcon fab icon="facebook-f" />
          </CDBBtn>
          <CDBBtn flat color="dark" className="mx-3 p-2">
            <CDBIcon fab icon="twitter" />
          </CDBBtn>
          <CDBBtn flat color="dark" className="p-2">
            <CDBIcon fab icon="instagram" />
          </CDBBtn>
        </CDBBox>
      </CDBBox>
    </CDBFooter>
  );
};

export default Footer
报错信息
ERROR in ./src/components/Footer/Footer.js 9:30-39
export 'CDBFooter' (imported as 'CDBFooter') was not found in 'cdbreact' (possible exports: CDBAccordion etc...
报错原因与解决方案
  • 核心原因是公开npm源可免费安装的cdbreact包,本身就没有对外导出CDBFooter、CDBBox这类Footer相关组件,这些组件属于该库付费Pro版本的专属内容,免费版的导出列表里不存在对应项,自然会触发找不到导出的报错。
  • 如果你已经购买了该库的Pro版本授权,先检查是否按照Pro版安装要求配置了对应的私有安装源,确认本地安装的是Pro版本而非公开免费版;另外你的代码里多处调用了CDBBox组件,但import语句中没有引入这个组件,就算解决了包版本问题,也会触发CDBBox未找到的新报错,需要补全对应导入。
  • 如果你没有购买Pro版本的计划,直接用开源免费的React Bootstrap原生组件手写Footer效果即可,不需要依赖cdbreact的付费组件。

内容的提问来源于stack exchange,提问作者Rediat

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.29 08:31:10