Rollup构建的React组件库安装后出现Module not found解析错误

以下是针对你遇到的Module not found错误的具体排查和修复步骤：

1. 确认发布包的文件完整性 #

• 本地执行npm pack生成压缩包，解压后检查内部结构：必须包含dist目录，且目录下有cjs/index.js、esm/index.js、index.d.ts三个核心文件，同时根目录的package.json存在且配置正确。
• 如果dist目录缺失或文件不全，重新执行npm run build，查看Rollup构建日志是否有报错。

2. 修正package.json配置 #

关键调整点： #

{
  "name": "@b/b-core",
  "version": "0.1.6",
  "main": "dist/cjs/index.js",
  "module": "dist/esm/index.js",
  "types": "dist/index.d.ts",
  "files": ["dist"], // 新增：指定npm发布时包含dist目录
  "dependencies": {
    "crypto-js": "^4.0.0",
    "esprima": "^4.0.1",
    "rxjs": "^7.8.1"
    // 移除react、react-dom、react-scripts、typescript（这些不应放在生产依赖）
  },
  "devDependencies": {
    "typescript": "^4.9.5", // 移到开发依赖
    "@types/react": "^16.9.8",
    "@types/react-dom": "^16.9.19",
    // 其他原有开发依赖保持不变
  },
  "peerDependencies": {
    "react": "^16.14.0",
    "react-dom": "^16.14.0"
  }
}

• files字段是核心：npm默认只发布根目录文件，必须显式声明包含dist，否则发布的包会缺失构建产物。
• 生产依赖只保留组件库运行必需的第三方包，react/react-dom已经通过peerDependencies声明，无需重复放入dependencies；typescript和react-scripts属于开发工具，移到devDependencies。

3. 优化Rollup构建配置 #

• 移除copy插件复制package.json到dist的逻辑：发布时使用的是根目录的package.json，无需复制到构建目录，避免混淆。
• 检查tsconfig.json：确保declaration设为true，outDir不与Rollup的输出目录冲突（建议不设置outDir，由Rollup控制输出路径）。

4. 本地验证与发布流程 #

• 本地测试用npm link：在组件库目录执行npm link，然后在测试项目执行npm link @b/b-core，直接验证构建后的包是否能被正常解析，无需反复发布。
• 重新发布：修正配置后，更新版本号，执行npm publish（私有仓库需确保源配置正确），测试项目重新安装最新版本。

5. 测试项目检查 #

• 确认导入语句拼写正确：import { 组件名 } from '@b/b-core'，无大小写或路径错误。
• 若测试项目是Create React App创建，无需额外配置webpack解析，默认会从node_modules查找包。

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