React组件库本地打包正常，安装后dist文件夹缺失问题求助

核心原因 #

问题本质是npm发布时未包含dist文件夹，本地构建正常但安装后缺失。移除.gitignore中的dist能解决本地安装（如npm link或本地路径安装）的问题，但这不符合Git最佳实践。GitHub上的同类包未提交dist，是因为它们利用npm预发布脚本在发布前自动构建并将dist纳入npm包，无需提交到Git。

修复步骤 #

1. 保留dist在.gitignore中 #

继续将dist/添加到.gitignore，Git仅追踪源码，构建产物由npm负责处理，这是行业通用的最佳实践。

2. 确认package.json配置有效性 #

你的package.json中"files": ["dist"]配置正确，npm发布时会包含该数组内的文件/文件夹。需注意：

• 若存在.npmignore文件，确保未排除dist（.npmignore优先级高于files字段）
• 验证build脚本执行后dist文件夹内容完整

3. 修复tsconfig.json的类型声明生成配置 #

当前tsconfig中"noEmit": true会阻止TypeScript生成类型声明文件（.d.ts），需修改配置：

• 方案一：修改tsconfig.json，将noEmit设为false：

{
  "compilerOptions": {
    // ...其他配置
    "noEmit": false
  }
}

• 方案二：在build脚本中覆盖该配置：

"scripts": {
  "build": "rm -rf dist && node esbuild.js && tsc --noEmit false"
}

4. 本地验证npm包内容 #

发布前执行以下命令生成测试包，解压后检查是否包含dist：

npm pack

若解压后的包包含dist，说明npm发布时会正确包含该文件夹；若未包含，检查files配置和build脚本是否存在错误。

5. 添加预发布脚本自动构建 #

在package.json中添加prepublishOnly脚本，确保发布前自动执行构建：

"scripts": {
  "build": "rm -rf dist && node esbuild.js && tsc",
  "prepublishOnly": "npm run build"
}

执行npm publish时，npm会先自动运行prepublishOnly脚本生成dist，再将包含dist的包发布到npm，Git仓库无需提交dist文件。

为什么GitHub上的包没有dist？ #

这类包遵循源码与构建产物分离的原则：

• Git仅管理源码（src目录、配置文件等），dist被加入.gitignore
• 通过npm的prepublishOnly或prepare脚本，在发布前自动构建dist
• 利用package.json的files字段，将dist纳入最终发布的npm包中
  因此GitHub仓库看不到dist，但安装到项目时，npm包内包含完整的dist内容。

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