macOS下React项目无法解析本地CKEditor5自定义构建模块

以下是针对你在macOS Apple Silicon系统上遇到的CKEditor5自定义构建导入问题的解决方案：

1. 对齐依赖名称与本地包名（核心修复） #

你的项目package.json中依赖名为ckeditor5-custom-build，但本地CKEditor构建目录ckeditor5的package.json里的name字段默认是ckeditor5，这导致模块解析失败。

• 修改项目根目录的package.json：
  将依赖行从：

  "ckeditor5-custom-build": "file:ckeditor5",
  

  改为：

  "ckeditor5": "file:ckeditor5",
  

• 保持组件导入语句不变：

  import Editor from 'ckeditor5/build/ckeditor';
  

2. 重新安装依赖 #

移除旧的依赖缓存和锁文件，确保npm正确链接本地构建：

rm -rf node_modules package-lock.json
npm install

3. 验证本地构建产物 #

确认ckeditor5目录下已完成有效构建：

• 进入ckeditor5目录，执行npm run build确保build/ckeditor.js文件存在。
• 修复macOS权限问题：

  chmod -R 755 ./ckeditor5
  

  避免系统权限限制导致npm无法读取本地包文件。

4. 备选方案：使用相对路径导入（如果上述方法无效） #

直接通过相对路径导入构建文件，绕过npm的依赖解析逻辑：

// 根据你的组件位置调整路径，示例假设ckeditor5在项目根目录
import Editor from '../../ckeditor5/build/ckeditor';

问题原因说明 #

macOS Apple Silicon上的npm 9对文件依赖的解析规则更严格，当项目依赖名与本地包的实际名称不匹配时，会直接触发模块找不到错误。而Linux环境可能对此兼容性更强，因此之前可以正常运行。使用npm link虽然能临时解决，但会引发ESLint的外部依赖报错，通过对齐依赖名称的方式可以彻底避免这类后续配置问题。

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