bi-components-library 1.0.18 → 1.0.19

package/README.md

@@ -14,11 +14,19 @@ pnpm add bi-components-library
 
 ## ⚠️ 重要提示：React 版本一致性
 
-**如果使用 pnpm，请确保 `react` 和 `react-dom` 版本完全一致**，否则会出现版本不兼容错误。
+**React 要求 `react` 和 `react-dom` 必须完全一致**，这是 React 本身的限制，不是组件库的限制。如果版本不一致，React 会在运行时抛出错误。
 
-### 解决方案
+### 自动检测功能
 
-在您的项目 `package.json` 中添加 `pnpm.overrides` 配置：
+组件库在安装后会自动检测 React 版本是否一致。如果检测到版本不一致，会在控制台显示警告和修复建议。
+
+### 问题说明
+
+组件库使用 `peerDependencies`，不直接依赖 React，因此不会强制 React 版本。但如果您的项目中 `react` 和 `react-dom` 版本不一致（例如：`react@19.1.0-canary` 和 `react-dom@19.1.1`），React 会检测到并抛出错误。
+
+### 解决方案（使用 pnpm）
+
+在您的项目 `package.json` 中添加 `pnpm.overrides` 配置来强制统一版本：
 
 ```json
 {
@@ -31,8 +39,9 @@ pnpm add bi-components-library
 }
 ```
 
-然后运行：
+然后重新安装依赖：
 ```bash
+rm -rf node_modules pnpm-lock.yaml
 pnpm install
 ```
 
@@ -41,6 +50,15 @@ pnpm install
 pnpm add react@19.1.1 react-dom@19.1.1
 ```
 
+### 解决方案（使用 npm/yarn）
+
+直接安装统一版本：
+```bash
+npm install react@19.1.1 react-dom@19.1.1
+# 或
+yarn add react@19.1.1 react-dom@19.1.1
+```
+
 ## 🚀 快速开始
 
 ### 1. 安装依赖

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bi-components-library",
   "private": false,
-  "version": "1.0.18",
+  "version": "1.0.19",
   "type": "module",
   "description": "SealSeek BI 组件库 - 基于 Ant Design 的企业级 React 组件",
   "keywords": [
@@ -18,7 +18,8 @@
   "types": "./dist/index.d.ts",
   "files": [
     "dist",
-    "README.md"
+    "README.md",
+    "scripts"
   ],
   "exports": {
     ".": {
@@ -33,6 +34,13 @@
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },
+  "peerDependencyRules": {
+    "allowedVersions": {
+      "react": "*",
+      "react-dom": "*"
+    },
+    "ignoreMissing": []
+  },
   "scripts": {
     "dev": "vite",
     "build": "tsc -p tsconfig.build.json && vite build",
@@ -40,7 +48,8 @@
     "lint": "eslint .",
     "preview": "vite preview",
     "preview:demo": "vite preview --outDir dist-demo",
-    "prepublishOnly": "npm run build"
+    "prepublishOnly": "npm run build",
+    "postinstall": "node scripts/check-react-versions.cjs"
   },
   "devDependencies": {
     "@eslint/js": "^9.30.1",
@@ -65,11 +74,5 @@
     "i": "^0.3.7",
     "npm": "^11.6.4",
     "dayjs": "^1.11.13"
-  },
-  "pnpm": {
-    "overrides": {
-      "react": "19.1.1",
-      "react-dom": "19.1.1"
-    }
   }
 }

package/scripts/check-react-versions.cjs

@@ -0,0 +1,74 @@
+#!/usr/bin/env node
+
+/**
+ * 检查 React 和 React-DOM 版本是否一致
+ * 如果不一致，提供修复建议
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+function findPackageJson(startPath) {
+  let currentPath = startPath;
+  while (currentPath !== path.dirname(currentPath)) {
+    const packageJsonPath = path.join(currentPath, 'package.json');
+    if (fs.existsSync(packageJsonPath)) {
+      return packageJsonPath;
+    }
+    currentPath = path.dirname(currentPath);
+  }
+  return null;
+}
+
+function checkReactVersions() {
+  try {
+    // 查找项目根目录的 package.json
+    const projectRoot = process.cwd();
+    const packageJsonPath = findPackageJson(projectRoot);
+    
+    if (!packageJsonPath) {
+      return; // 找不到 package.json，静默退出
+    }
+
+    const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+    const dependencies = { ...packageJson.dependencies, ...packageJson.devDependencies };
+    
+    const reactVersion = dependencies.react;
+    const reactDomVersion = dependencies['react-dom'];
+    
+    // 如果两个版本都存在但不一致
+    if (reactVersion && reactDomVersion && reactVersion !== reactDomVersion) {
+      console.warn('\n⚠️  [bi-components-library] 检测到 React 版本不一致：');
+      console.warn(`   - react: ${reactVersion}`);
+      console.warn(`   - react-dom: ${reactDomVersion}`);
+      console.warn('\n📝 解决方案：');
+      
+      // 检查是否使用 pnpm
+      const isPnpm = fs.existsSync(path.join(path.dirname(packageJsonPath), 'pnpm-lock.yaml'));
+      
+      if (isPnpm) {
+        console.warn('   在 package.json 中添加 pnpm.overrides 配置：');
+        console.warn('   {');
+        console.warn('     "pnpm": {');
+        console.warn('       "overrides": {');
+        console.warn(`         "react": "${reactDomVersion}",`);
+        console.warn(`         "react-dom": "${reactDomVersion}"`);
+        console.warn('       }');
+        console.warn('     }');
+        console.warn('   }');
+        console.warn('\n   然后运行: pnpm install\n');
+      } else {
+        console.warn(`   运行: npm install react@${reactDomVersion} react-dom@${reactDomVersion}`);
+        console.warn(`   或: yarn add react@${reactDomVersion} react-dom@${reactDomVersion}\n`);
+      }
+    }
+  } catch (error) {
+    // 静默处理错误，不影响安装过程
+  }
+}
+
+// 只在安装时运行，不在开发时运行
+if (process.env.npm_lifecycle_event === 'postinstall' || process.env.npm_lifecycle_event === 'install') {
+  checkReactVersions();
+}
+