react-native-art-svg源码贡献指南：从Issue到PR的完整流程

【免费下载链接】react-native-svg 项目地址: https://gitcode.com/gh_mirrors/reac/react-native-art-svg

前言

感谢您对react-native-svg项目的关注！本文档将详细介绍从发现问题（Issue）到提交代码（PR）的完整贡献流程，帮助您顺利参与开源贡献。所有操作均基于项目CONTRIBUTING.md规范，确保贡献过程高效且符合社区标准。

1. 贡献前准备

1.1 代码规范与行为准则

在开始贡献前，请务必阅读行为准则，确保所有交流和代码提交符合社区规范。项目采用TypeScript进行类型检查，使用ESLint和Prettier进行代码格式化，相关配置可在tsconfig.json和package.json中查看。

1.2 环境搭建

1. ** Fork仓库 **：访问项目仓库并点击"Fork"按钮创建个人副本
2. ** 克隆代码 **：

   git clone https://gitcode.com/gh_mirrors/reac/react-native-art-svg.git
   cd react-native-art-svg
   

3. ** 创建分支 **：

   git checkout -b feature/your-feature-name
   

4. ** 安装依赖 **：

   yarn install
   

2. 发现与报告问题

2.1 Issue分类与模板

项目Issue主要分为以下类型：

• ** Bug报告 **：使用issue模板提交可复现的错误
• ** 功能请求 **：详细描述所需功能及使用场景
• ** 文档改进 **：指出文档中的错误或缺失部分

2.2 问题确认流程

1. 搜索现有Issue确保问题未被重复报告
2. 提供环境信息（React Native版本、平台等）
3. 附带上重现步骤和最小可复现代码
4. 必要时添加截图或录屏，可参考项目中的示例图片：

3. 代码开发与测试

3.1 开发规范

• 所有组件开发需遵循src/elements/目录下的现有模式
• 新功能需添加对应的TypeScript类型定义，参考src/index.ts
• 性能优化相关代码请在提交时注明优化点和测试数据

3.2 测试示例编写

测试代码需放置在TestsExample/src/目录，命名格式为TestXXX.tsx（XXX为PR编号）。以下是测试用例示例：

// TestsExample/src/Test2071.tsx
import * as React from 'react';
import {View} from 'react-native';
import Svg, {Circle} from 'react-native-svg';

export default function Test2071() {
  return (
    <Svg width={100} height={100} viewBox="0 0 100 100">
      <Circle cx={50} cy={50} r={40} fill="red" />
    </Svg>
  );
}

3.3 本地验证

运行以下命令确保代码质量：

yarn lint       # 代码风格检查
yarn tsc        # 类型检查
yarn test       # 单元测试

测试应用可通过Example/目录运行，查看组件渲染效果：

4. 提交与PR流程

4.1 提交规范

提交信息需遵循约定式提交规范（Conventional Commits）：

• fix: 修复bug
• feat: 添加新功能
• docs: 文档更新
• refactor: 代码重构

例如：feat: add support for radial gradient

4.2 PR创建步骤

1. ** 推送分支 **：

   git push origin feature/your-feature-name
   

2. ** 创建PR **：通过仓库界面创建Pull Request，选择main分支作为目标
3. ** 填写模板 **：包含以下内容：
   • 变更描述
   • 测试方法
   • 相关Issue链接
   • 截图（如适用）

4.3 代码审查与合并

• PR需通过CI自动检查（lint、test、build）
• 至少需要1名核心维护者批准
• 解决所有评审意见后将被合并到主分支

5. 贡献后续

5.1 版本发布

项目使用release-it进行版本管理，合并到main分支的PR将根据提交信息自动确定版本号：

• fix → 补丁版本（1.0.x）
• feat → minor版本（1.x.0）
• BREAKING CHANGE → 主版本（x.0.0）

5.2 贡献者权益

成功合并PR后，您将：

• 被添加到贡献者列表
• 获得项目维护者的感谢
• 有机会参与项目决策讨论

6. 高级贡献指南

6.1 原生代码开发

如需修改原生模块（Android/iOS）：

• Android代码：android/src/
• iOS代码：apple/Elements/
• Windows平台：windows/RNSVG/

编译原生代码前需运行：

cd Example
yarn install
cd ios && pod install && cd ..

6.2 性能优化建议

• 使用FiberExample测试新架构兼容性
• 避免在渲染路径中创建新对象
• 使用useCallback和useMemo优化重渲染

结语

通过本文档，您已了解react-native-svg项目的完整贡献流程。无论是修复bug、添加功能还是改进文档，每一份贡献都对项目至关重要。如有疑问，可通过Issue或Discussions与社区交流。期待您的PR！

项目示例代码：Example/
测试用例集合：TestsExample/src/
官方文档：USAGE.md

【免费下载链接】react-native-svg 项目地址: https://gitcode.com/gh_mirrors/reac/react-native-art-svg