{"_id":"@aiwanna-team/component-lib-tpl","_rev":"3-3910ed910e9429d66655e737269969c9","name":"@aiwanna-team/component-lib-tpl","dist-tags":{"latest":"0.1.4"},"versions":{"0.1.3":{"name":"@aiwanna-team/component-lib-tpl","version":"0.1.3","_id":"@aiwanna-team/component-lib-tpl@0.1.3","maintainers":[{"name":"yarnb","email":"yarnb@foxmail.com"}],"dist":{"shasum":"45112aa7b9e060567a692a586c63f9f6d505c1a1","tarball":"https://registry.npmjs.org/@aiwanna-team/component-lib-tpl/-/component-lib-tpl-0.1.3.tgz","fileCount":6,"integrity":"sha512-Xj9uyeoWcPz2n/6s3mUMif/J+S1oHbCRS5vozJPFyFGm8R/y3vqAfObBIUkn38WtF5YIhP3YOPWUYMDQKr2wLA==","signatures":[{"sig":"MEUCICweNn8m2neyVtcEX6psoTQqckmdd/GI7ZSzkaZQqModAiEA0Jw/lZmeQDxl7NHkn97jXl5t/oVtoK3YYS7F0dB/wgw=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":12395},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"npm":">=9.0.0","node":">=20.0.0"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./css":{"import":"./dist/index.css"}},"gitHead":"9b63bcb8444302e4b0a3fc83c47f1f992278df13","scripts":{"dev":"vite","lint":"eslint .","test":"vitest run","build":"tsc -b && vite build --config vite.build.config.ts","ci:test":"node scripts/ci-test.js","preview":"vite preview","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit --project tsconfig.app.json","build:verify":"npm run build && node scripts/verify-build.js","build-storybook":"storybook build"},"_npmUser":{"name":"yarnb","email":"yarnb@foxmail.com"},"_npmVersion":"10.8.2","description":"这是一个基于 React + TypeScript + Vite + TailwindCSS 的组件库模板，支持发布到 npm。","directories":{},"_nodeVersion":"20.19.2","_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5","eslint":"^9.25.0","vitest":"^3.2.2","globals":"^16.0.0","storybook":"^9.0.6","@eslint/js":"^9.25.0","playwright":"^1.52.0","typescript":"~5.8.3","@types/node":"^22.15.30","@types/react":"^19.1.2","@vitest/browser":"^3.2.2","vite-plugin-dts":"^4.3.0","@types/react-dom":"^19.1.2","typescript-eslint":"^8.30.1","@vitest/coverage-v8":"^3.2.2","@storybook/addon-a11y":"^9.0.6","@storybook/addon-docs":"^9.0.6","@storybook/react-vite":"^9.0.6","@storybook/addon-vitest":"^9.0.6","eslint-plugin-storybook":"^9.0.6","@chromatic-com/storybook":"^4.0.0","@vitejs/plugin-react-swc":"^3.9.0","eslint-plugin-react-hooks":"^5.2.0","@storybook/addon-onboarding":"^9.0.6","eslint-plugin-react-refresh":"^0.4.19"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","tailwindcss":"^4.1.8","@tailwindcss/vite":"^4.1.8"},"_npmOperationalInternal":{"tmp":"tmp/component-lib-tpl_0.1.3_1749341811269_0.382883471302327","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@aiwanna-team/component-lib-tpl","version":"0.2.0","_id":"@aiwanna-team/component-lib-tpl@0.2.0","maintainers":[{"name":"yarnb","email":"yarnb@foxmail.com"}],"dist":{"shasum":"4917994c2b2ae6376a4a22bfb853d29ed4ca76b8","tarball":"https://registry.npmjs.org/@aiwanna-team/component-lib-tpl/-/component-lib-tpl-0.2.0.tgz","fileCount":8,"integrity":"sha512-lebCuCrhqL1iCRWU3mln1XnsqQtkuk+n47/5Pfpdah0FBiLeXJEnrsR75VqSNnEaaRZaYGIpPiIIJi0p2aTQ4w==","signatures":[{"sig":"MEQCICtgf+AM1rzF8+3o/8VO2avKohY5x56dtyubo5aPLNHrAiAFiEXFVED7TjkZX6ur7cVJdDWrPxKmMYQPa18ZI3/ToA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":13022},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","engines":{"npm":">=9.0.0","node":">=20.0.0"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./css":{"types":"./dist/index.css.d.ts","import":"./dist/index.css"}},"gitHead":"58546730690312e3100772672b004abad534b772","scripts":{"dev":"vite","lint":"eslint .","test":"vitest run","build":"tsc -b && vite build --config vite.build.config.ts && node scripts/generate-css-types.js","ci:test":"node scripts/ci-test.js","prepare":"husky","preview":"vite preview","version":"npm run changelog && git add CHANGELOG.md","changelog":"conventional-changelog -p angular -i CHANGELOG.md -s","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit --project tsconfig.app.json","build:verify":"npm run build && node scripts/verify-build.js","changelog:all":"conventional-changelog -p angular -i CHANGELOG.md -s -r 0","build-storybook":"storybook build"},"_npmUser":{"name":"yarnb","email":"yarnb@foxmail.com"},"_npmVersion":"10.8.2","description":"这是一个基于 React + TypeScript + Vite + TailwindCSS 的组件库模板，支持发布到 npm。","directories":{},"_nodeVersion":"20.19.2","_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5","husky":"^9.1.7","eslint":"^9.25.0","vitest":"^3.2.2","globals":"^16.0.0","storybook":"^9.0.6","@eslint/js":"^9.25.0","playwright":"^1.52.0","typescript":"~5.8.3","@types/node":"^22.15.30","@types/react":"^19.1.2","@commitlint/cli":"^19.8.1","@vitest/browser":"^3.2.2","vite-plugin-dts":"^4.3.0","@types/react-dom":"^19.1.2","typescript-eslint":"^8.30.1","@vitest/coverage-v8":"^3.2.2","@storybook/addon-a11y":"^9.0.6","@storybook/addon-docs":"^9.0.6","@storybook/react-vite":"^9.0.6","@storybook/addon-vitest":"^9.0.6","eslint-plugin-storybook":"^9.0.6","@chromatic-com/storybook":"^4.0.0","@vitejs/plugin-react-swc":"^3.9.0","eslint-plugin-react-hooks":"^5.2.0","conventional-changelog-cli":"^5.0.0","@storybook/addon-onboarding":"^9.0.6","eslint-plugin-react-refresh":"^0.4.19","@commitlint/config-conventional":"^19.8.1"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","tailwindcss":"^4.1.8","@tailwindcss/vite":"^4.1.8"},"_npmOperationalInternal":{"tmp":"tmp/component-lib-tpl_0.2.0_1749459962277_0.13360952144020977","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"@aiwanna-team/component-lib-tpl","version":"0.1.4","type":"module","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./css":{"import":"./dist/index.css"}},"scripts":{"dev":"vite","build":"tsc -b && vite build --config vite.build.config.ts","build:verify":"npm run build && node scripts/verify-build.js","typecheck":"tsc --noEmit --project tsconfig.app.json","ci:test":"node scripts/ci-test.js","lint":"eslint .","preview":"vite preview","storybook":"storybook dev -p 6006","build-storybook":"storybook build","test":"vitest run","changelog":"conventional-changelog -p angular -i CHANGELOG.md -s","changelog:all":"conventional-changelog -p angular -i CHANGELOG.md -s -r 0","version":"npm run changelog && git add CHANGELOG.md","prepare":"husky"},"peerDependencies":{"@tailwindcss/vite":"^4.1.8","tailwindcss":"^4.1.8","react":"^19.1.0","react-dom":"^19.1.0"},"engines":{"node":">=20.0.0","npm":">=9.0.0"},"devDependencies":{"@chromatic-com/storybook":"^4.0.0","@commitlint/cli":"^19.8.1","@commitlint/config-conventional":"^19.8.1","@eslint/js":"^9.25.0","@storybook/addon-a11y":"^9.0.6","@storybook/addon-docs":"^9.0.6","@storybook/addon-onboarding":"^9.0.6","@storybook/addon-vitest":"^9.0.6","@storybook/react-vite":"^9.0.6","@types/node":"^22.15.30","@types/react":"^19.1.2","@types/react-dom":"^19.1.2","@vitejs/plugin-react-swc":"^3.9.0","@vitest/browser":"^3.2.2","@vitest/coverage-v8":"^3.2.2","conventional-changelog-cli":"^5.0.0","eslint":"^9.25.0","eslint-plugin-react-hooks":"^5.2.0","eslint-plugin-react-refresh":"^0.4.19","eslint-plugin-storybook":"^9.0.6","globals":"^16.0.0","husky":"^9.1.7","playwright":"^1.52.0","storybook":"^9.0.6","typescript":"~5.8.3","typescript-eslint":"^8.30.1","vite":"^6.3.5","vite-plugin-dts":"^4.3.0","vitest":"^3.2.2"},"_id":"@aiwanna-team/component-lib-tpl@0.1.4","gitHead":"b8fa37a00ce4e0126c8b0ab92b7e9e4e5bcb216d","description":"这是一个基于 React + TypeScript + Vite + TailwindCSS 的组件库模板，支持发布到 npm。","_nodeVersion":"20.19.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-soROSqQq8lovB4uDjOG4DkLXbQYJBLDh+KhOUqpX/Toeob/emB6WrVB0fkI24Q7+eT5F2yRIcRh+YjbO7JJq3A==","shasum":"e65bd23eba973a04e52dffbfa602702df95e78c8","tarball":"https://registry.npmjs.org/@aiwanna-team/component-lib-tpl/-/component-lib-tpl-0.1.4.tgz","fileCount":6,"unpackedSize":12785,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIFYuC6YQ7ydK/4lu8G45NpehCwAzxeuGhjB/HHUZ2/1QAiBogwL1ndpYf99DmfETvBxR4Wxz/MkdhzUgWEf8SxOj8w=="}]},"_npmUser":{"name":"yarnb","email":"yarnb@foxmail.com"},"directories":{},"maintainers":[{"name":"yarnb","email":"yarnb@foxmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/component-lib-tpl_0.1.4_1749459963989_0.04850881993770906"},"_hasShrinkwrap":false}},"time":{"created":"2025-06-08T00:16:51.155Z","modified":"2025-06-09T09:06:04.380Z","0.1.3":"2025-06-08T00:16:51.444Z","0.2.0":"2025-06-09T09:06:02.458Z","0.1.4":"2025-06-09T09:06:04.185Z"},"description":"这是一个基于 React + TypeScript + Vite + TailwindCSS 的组件库模板，支持发布到 npm。","maintainers":[{"name":"yarnb","email":"yarnb@foxmail.com"}],"readme":"# 组件库模板 (Component Library Template)\n\n这是一个基于 React + TypeScript + Vite + TailwindCSS 的组件库模板，支持发布到 npm。\n\n## 功能特性\n\n- ⚡️ 使用 Vite 进行快速构建\n- 🎨 使用 TailwindCSS 进行样式设计\n- 📦 支持构建为可发布的 npm 包\n- 📚 集成 Storybook 用于组件文档和测试\n- 🔧 TypeScript 支持，包含类型定义\n- 🧪 支持 Vitest 进行单元测试\n\n## 快速开始\n\n### 安装依赖\n\n```bash\nnpm install\n```\n\n### 开发模式\n\n```bash\n# 启动开发服务器\nnpm run dev\n\n# 启动 Storybook\nnpm run storybook\n```\n\n### 构建\n\n```bash\n# 构建组件库（用于发布到npm）\nnpm run build\n\n# 构建 Storybook\nnpm run build-storybook\n```\n\n## 使用方法\n\n### 安装组件库\n\n```bash\nnpm install component-lib-tpl\n```\n\n### 导入组件\n\n```tsx\nimport { Button } from 'component-lib-tpl'\n\nfunction App() {\n return (\n
\n \n
\n )\n}\n```\n\n## 组件说明\n\n### Button 组件\n\n基础的按钮组件，支持多种变体和尺寸。\n\n#### 属性\n\n- `variant`: 按钮类型 (`'primary' | 'secondary' | 'outline'`)\n- `size`: 按钮大小 (`'sm' | 'md' | 'lg'`)\n- `disabled`: 是否禁用\n- `onClick`: 点击事件处理函数\n- `className`: 自定义类名\n- `children`: 按钮内容\n\n#### 示例\n\n```tsx\n// 主要按钮\n\n\n// 大尺寸按钮\n\n\n// 禁用按钮\n\n\n// 自定义点击事件\n\n```\n\n## 开发指南\n\n### 添加新组件\n\n1. 在 `src/components/` 目录下创建新的组件文件夹\n2. 创建组件文件 `ComponentName.tsx`\n3. 在 `src/components/index.ts` 中导出新组件\n4. 在 `src/index.ts` 中导出新组件\n5. 创建对应的 Storybook 故事文件\n\n### 项目结构\n\n```\nsrc/\n├── components/ # 组件目录\n│ ├── Button/ # Button 组件\n│ │ └── Button.tsx\n│ └── index.ts # 组件统一导出\n├── stories/ # Storybook 故事\n│ └── Button.stories.tsx\n└── index.ts # 主入口文件\n```\n\n### 构建配置\n\n- `vite.config.ts`: 用于开发和应用构建\n- `vite.lib.config.ts`: 用于组件库构建\n- 使用 `vite-plugin-dts` 生成 TypeScript 类型定义\n\n## 📦 发布\n\n### 自动发布（推荐）\n\n项目配置了自动发布工作流，只需推送版本标签即可：\n\n```bash\n# 创建并推送版本标签\ngit tag v1.0.0\ngit push origin v1.0.0\n```\n\n发布工作流会自动：\n- ✅ 运行测试和代码检查\n- 🔨 构建项目\n- 📦 发布到 npm（需要配置 NPM_TOKEN）\n- 🎉 创建 GitHub Release\n\n### 手动发布\n\n如需手动发布：\n\n1. 修改 `package.json` 中的包名和版本\n2. 设置 `private: false`\n3. 构建组件库：`npm run build`\n4. 发布：`npm publish --access public`\n\n详细发布指南请查看：[📖 发布文档](./docs/PUBLISH.md)\n\n## 📚 文档\n\n### [📖 详细文档](./docs/README.md)\n查看完整的开发文档和指南。\n\n### [⚙️ 构建配置说明](./docs/BUILD_CONFIG.md)\n了解为什么要这样配置外部依赖，以及相关的最佳实践。\n\n## 🔄 CI/CD\n\n项目配置了 GitHub Actions 自动化检查，包括：\n- **代码质量检查**：ESLint、TypeScript 类型检查\n- **构建验证**：确保构建产物正确，验证外部依赖配置\n- **测试运行**：单元测试和覆盖率检查\n- **Storybook 构建**：验证文档站点\n- **安全审计**：检查依赖安全性\n- **配置验证**：验证关键配置文件\n\n每次 push 和 pull request 都会自动触发这些检查。\n\n## 🚀 最佳实践\n\n### 外部依赖配置\n组件库正确配置了外部依赖，避免打包 React 运行时：\n```typescript\n// vite.build.config.ts\nexternal: [\"react/jsx-runtime\", ...peerDependencies]\n```\n\n这样做的好处：\n- ✅ 减少包体积（从 300+ 行减少到 35 行）\n- ✅ 避免 React 版本冲突\n- ✅ 让用户控制 React 版本\n- ✅ 符合组件库最佳实践\n\n### 验证配置\n```bash\n# 构建后检查是否正确外部化\nnpm run build:verify\n\n# TypeScript 类型检查\nnpm run typecheck\n\n# 本地 CI 测试（模拟完整的 GitHub Actions 流程）\nnpm run ci:test\n```\n\n## 许可证\n\nMIT\n","readmeFilename":"README.md"}