如何贡献uniapp开源组件

为 uni-app 贡献开源组件，一般可以从「代码贡献」和「发布组件」两个层面来理解。下面我按实用流程给你说明，适合新手到进阶。

一、uni-app 组件生态简介

uni-app 的组件生态系统主要包括：

1. uni-app 官方组件

   • 源码仓库：https://github.com/dcloudio/uni-app
   • 一般不建议直接改核心组件，除非修 Bug

2. uni-app 插件市场（最推荐）

   • 地址：https://ext.dcloud.net.cn/
   • 这是最常见、最实用的贡献方式

3. npm 组件（HBuilderX / cli 项目）

   • 适合纯 JS / Vue 组件

二、最常见方式：发布 uni-app 插件 / 组件

✅ 适合人群

• 想做一个可复用的组件
• 想被别人在 uni-app 中直接使用

1️⃣ 准备组件目录结构（推荐）

my-component/
├── components/
│   └── my-component/
│       ├── my-component.vue
│       └── index.js
├── package.json
├── README.md

my-component.vue 示例

<template>
  <view class="my-component">
    {{ title }}
  </view>
</template>

<script>
export default {
  name: 'MyComponent',
  props: {
    title: {
      type: String,
      default: 'Hello uni-app'
    }
  }
}
</script>

<style scoped>
.my-component {
  padding: 20rpx;
}
</style>

2️⃣ 在 uni-app 项目中测试

pages/index/index.vue

<template>
  <my-component title="测试组件" />
</template>

<script>
import MyComponent from '@/components/my-component/my-component.vue'

export default {
  components: {
    MyComponent
  }
}
</script>

✅ 真机 / 小程序 / H5 都要测一遍

3️⃣ 发布到 uni-app 插件市场（重点）

步骤：

1. 登录 https://ext.dcloud.net.cn/
2. 点击「发布插件」
3. 选择：
   • 插件类型：组件
   • 支持平台（H5 / 小程序 / App）
4. 上传：
   • 组件源码
   • 示例项目（强烈建议）
5. 编写 README：
   • 安装方式
   • 使用方式
   • 参数说明
   • 注意事项

✅ 有示例项目 = 更容易通过审核

三、贡献给 uni-app 官方仓库（进阶）

如果你想改进 uni-app 核心组件：

1️⃣ Fork 官方仓库

https://github.com/dcloudio/uni-app

2️⃣ 本地开发

git clone your-fork
npm install

3️⃣ 修改组件

• 一般位于：

packages/uni-components/

4️⃣ 提交 PR（Pull Request）

PR 要求：

• 说明用途
• 说明影响平台
• 提供示例
• 不破坏现有功能

✅ 官方审核比较严格，建议先提 Issue 讨论

四、发布为 npm 组件（适合 Vue 技术栈）

如果你熟悉 npm：

npm init
npm publish

注意：

• 组件名建议：uni-*
• 不要依赖 DOM / window
• 兼容小程序

五、组件设计建议（非常重要）

✅ 平台兼容

• 小程序 / App / H5 同时可用
• 避免 document、window

✅ 接口设计

• props 控制行为
• 事件传递结果
• 插槽扩展 UI

✅ 文档清晰

• props
• events
• slots
• 示例截图

六、典型贡献场景

七、我可以帮你做什么？

你可以直接告诉我：

• ✅ 想做什么组件（UI / 业务 / 工具）
• ✅ 支持哪些平台
• ✅ 是否需要示例项目

我可以帮你：

• 设计组件结构
• 写完整示例
• 写 README
• 指导发布插件市场

只要你愿意，我们可以一步步把你的组件做成官方级别的质量。