本地npm run webpack正常，构建服务器报错：Breadcrumb未导出

针对你遇到的「本地执行npm run webpack无报错，但构建服务器报错Attempted import error: 'Breadcrumb' is not exported from '@progress/kendo-react-layout'」问题，以下是具体排查和解决方向：

1. 本地与服务器依赖版本不匹配 #

Kendo React的组件导出规则会随版本更新变化，大概率是本地安装的@progress/kendo-react-layout版本和服务器上的不一致。

• 先查看本地package.json里该包的版本，再在服务器执行npm list @progress/kendo-react-layout确认安装版本。
• 解决办法：
  • 锁定版本：将package.json中该包的版本号从模糊范围（比如^2.0.0）改为固定版本（比如2.0.0），然后在服务器执行npm ci（严格按package-lock.json安装，跳过缓存）。
  • 若版本过低导致无Breadcrumb导出，直接升级到支持该组件的版本，同步本地和服务器依赖。

2. 服务器依赖缓存干扰 #

构建服务器的npm/yarn缓存可能残留旧依赖文件，导致安装的包不完整或版本错误。

• 解决办法：
  • 执行npm clean install（等同于npm ci），彻底清除缓存并重新安装依赖。
  • 使用yarn的话，执行yarn install --force强制刷新所有依赖。

3. 导入语句路径错误 #

部分Kendo React版本中，Breadcrumb需要从子路径导入，而非根包直接导出。

• 尝试修改导入代码为子路径形式：

  // 替换原导入语句
  import { Breadcrumb } from '@progress/kendo-react-layout/lib/Breadcrumb';
  

• 可参考对应版本的Kendo React文档，确认Breadcrumb的正确导入路径。

4. 构建环境版本差异 #

本地和服务器的Node.js、npm/yarn版本差异，也可能导致依赖安装或构建异常。

• 检查本地和服务器的Node.js版本（执行node -v），尽量保持大版本一致（比如都是18.x或20.x）。
• 确认npm/yarn版本相同，避免因包管理器版本不同导致依赖树结构不一致。

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