为 Ionic 做贡献
感谢您对 Ionic Framework 做贡献的兴趣!
贡献礼仪
请参阅 贡献者行为准则 以了解行为准则信息。
创建问题
-
如果您有关于使用该框架的问题,请在 Ionic 论坛 上提问。
-
您需要清楚地描述重现您遇到的问题所需的步骤。尽管我们非常愿意尽可能地帮助用户,但在没有明确的重现步骤的情况下诊断问题非常耗时,并且不可持续。
-
Ionic 存储库的问题列表专门用于错误报告和功能请求。不符合要求的问题将立即关闭。
-
没有明确的重现步骤的问题将不会被分类。如果一个问题被标记为“needs: reply”,并且在 14 天内没有收到问题的作者的进一步回复,它将被关闭。
-
如果您认为自己发现了错误,或者有新的功能想法,请首先确保它还没有被 报告。您可以搜索现有问题,查看是否有类似的问题报告。包括已关闭的问题,因为它们可能已包含解决方案而被关闭。
-
接下来, 创建一个新问题,详细解释该问题。请在提交问题之前填写填充的问题表单。
创建良好的代码重现
什么是代码重现?
代码重现是一个小的应用程序,它用于演示特定问题。代码重现应该包含重现问题所需的最少代码量,并且应该专注于一个问题。
为什么要创建重现?
您遇到的问题的代码重现有助于我们更好地隔离问题的根源。这是修复任何错误的重要第一步!
如果没有可靠的代码重现,我们不太可能能够解决这个问题,导致它被关闭。换句话说,创建问题的代码重现有助于我们帮助您。
如何创建重现
- 使用我们的一个入门模板创建一个新的 Ionic 应用程序。
blank
入门应用程序是一个很好的选择。您可以使用以下 Ionic CLI 命令创建一个:ionic start myApp blank
- 添加重现您遇到的问题所需的最小代码量。不要包含任何不必要的代码。这包括您安装的任何第三方插件。
- 在 GitHub 上发布该应用程序,并在 创建问题 时包含指向它的链接。
- 务必包含重现问题的步骤。这些步骤应该清晰易懂。
创建重现的好处
- 使用最新版本的 Ionic:通过创建一个新的 Ionic 应用程序,您可以确保您是在测试最新版本的框架。有时您遇到的问题在框架的较新版本中已经得到解决!
- 最小的表面积:通过删除重现问题所需的代码,可以更容易地识别问题的原因。
- 不需要秘密代码:创建问题的最小重现可以防止您发布项目中使用的任何专有代码。
- 获得帮助修复问题:如果我们能够可靠地重现问题,我们很有可能能够解决它。
创建拉取请求
-
感谢您抽出时间做出贡献!在提交拉取请求之前,我们要求您请 创建一个问题,解释错误或功能请求,并让我们知道您计划为此创建拉取请求。如果问题已经存在,请在该问题上发表评论,让我们知道您想为此提交拉取请求。这有助于我们跟踪拉取请求,并确保没有重复的工作。
-
正在寻找需要修复的问题?请务必查看我们的 需要帮助 标签的问题!
设置
- 下载安装程序 用于 Node.js 的 LTS 版本。这是安装 npm 的最佳方式。
- 分叉 Ionic 存储库。
- 克隆您的分叉。
- 从 master 创建一个新的分支来进行您的更改。
- 导航到您要修改的包的目录(core、angular 等)。
- 运行
npm install
以安装该包的依赖项。 - 按照下面特定包的步骤操作。
核心
修改组件
- 在
/core/src/components/
中找到要修改的组件。 - 查看 Stencil 文档 和其他组件,了解这些组件的实现。
- 对组件进行更改。如果更改过于复杂或超出常規,请添加注释,以便我们理解这些更改。
- 预览您的更改 在本地。
- 修改文档 如果需要。
- 运行 lint 在该目录上,并确保没有错误。
- 构建项目.
- 构建完成后,提交更改。请在每次提交时遵循 提交消息格式。
- 提交拉取请求 您更改的内容。
预览更改
- 从
core
目录中运行npm start
。 - 浏览器应该在
https://127.0.0.1:3333/
中打开。 - 从此处,导航到其中一个组件的测试,以预览您的更改。
- 如果不存在显示您更改的测试,请 添加新测试或更新现有测试。
- 要在 RTL 模式下测试,在您进入所需组件的测试后,在 URL 末尾添加
?rtl=true
;例如:https://127.0.0.1:3333/src/components/alert/test/basic?rtl=true
。
Lint 变更
- 运行
npm run lint
来 lint TypeScript 和 Sass。 - 如果有 lint 错误,运行
npm run lint.fix
自动修复任何错误。重复步骤 1 以确保错误已修复,如果未修复,请手动修复它们。 - 要仅 lint 和修复 TypeScript 错误,请分别运行
npm run lint.ts
和npm run lint.ts.fix
。 - 要仅 lint 和修复 Sass 错误,请分别运行
npm run lint.sass
和npm run lint.sass.fix
。
修改文档
- 在组件目录中找到
readme.md
文件。 - 修改此文件中的
<!-- Auto Generated Below -->
所在行 **上面** 的文档。 - 要更新该行以下的任何自动生成的文档,请在以下位置进行相关更改
Usage
:更新组件目录的usage/
目录中组件的使用示例Properties
、Events
或Methods
:更新组件的 TypeScript 文件 (*.tsx
)CSS Custom Properties
:更新组件的主 Sass 文件 (*.scss
)
修改测试
- 在组件目录的
test/
文件夹中找到要修改的测试。 - 如果存在测试,请通过添加示例来修改测试,以重现已修复的问题或添加的功能。
- 如果需要新的测试,最简单的方法是复制组件
test/
目录中的basic/
目录,重命名它,然后编辑index.html
和e2e.ts
文件中的内容(有关此文件的更多信息,请参见 截图测试)。 preview/
目录在文档中用作演示。只有在测试中存在错误或 API 发生了未在测试中更新的更改时,才更新此测试。
截图测试
- 如果测试存在于截图中,则测试目录中将有一个名为
e2e.ts
的文件。 - 可以通过包含此文件并添加一个或多个包含对
page.compareScreenshot()
的调用的test()
调用来添加截图测试。有关示例,请参见 Stencil 端到端测试 和core/
中的现有测试。 - 重要:每个
test()
应该只有一个截图 (page.compareScreenshot()
) 调用 **或** 它应该在每个测试结束时检查期望。如果存在不匹配,则测试将失败,这将阻止其余测试运行,例如,如果第一个截图失败,则其余截图调用将不会被调用,除非 它们在单独的测试中或所有期望都在最后被调用。 - 要在本地运行截图,请使用以下命令:
npm run test.screenshot
。- 要为特定测试运行截图,请传递测试路径或要搜索的字符串。
- 例如,运行所有
alert
测试:npm run test.screenshot alert
。 - 或者,运行基本
alert
测试:npm run test.screenshot src/components/alert/test/basic/e2e.ts
。
构建变更
- 完成所有更改并更新文档后,在
core
目录中运行npm run build
。如果需要,这将把您的更改添加到任何自动生成的的文件。 - 查看更改,如果一切看起来都正确,请 提交 更改。
- 确保构建完成后再提交。如果您对文档、属性、方法或需要更新生成文件的任何其他内容进行了更改,则需要提交此更改。
- 更改推送后,发布分支并 创建拉取请求。
提交拉取请求
- 创建一个新的拉取请求,将
master
分支作为base
。您可能需要点击compare across forks
才能找到您的更改。 - 有关更多信息,请参见 从分叉创建拉取请求 GitHub 帮助文章。
- 请尽您所能填写提供的拉取请求模板,并包含任何相关问题。
提交消息指南
我们对 Git 提交消息的格式有非常严格的规则。这将产生易于理解的消息,在浏览项目历史记录时易于遵循。我们还使用 Git 提交消息来生成我们的 变更日志。我们的格式与 Angular 的 提交消息指南 非常相似。
提交消息格式
我们遵循 常规提交规范。提交消息由 **标题**、**正文** 和 **脚注** 组成。标题包含 **类型**、**范围** 和 **主题**
<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
**标题** 是必需的,**范围** 是可选的。
还原
如果提交还原了先前的提交,则它应该以 revert:
开头,后跟已还原提交的标题。在正文中,它应该说明:This reverts commit <hash>.
,其中哈希是正在还原的提交的 SHA。
类型
如果前缀是 feat
、fix
或 perf
,它将出现在变更日志中。但是,如果存在任何 BREAKING CHANGE,提交将始终出现在变更日志中。
必须是以下之一
- feat:一项新功能
- fix:一个错误修复
- docs:仅文档更改
- style:不影响代码含义的更改(空白、格式、缺少分号等)
- refactor:既不修复错误也不添加功能的代码更改
- perf:改进性能的代码更改
- test:添加缺少的测试
- chore:对构建过程或辅助工具和库(如文档生成)的更改
范围
范围可以是任何指定提交更改位置的内容。通常它将引用一个组件,但它也可以引用一个实用程序。例如 action-sheet
、button
、css
、menu
、nav
等。如果您对同一组件进行了多次提交,请保持此组件的命名一致。例如,如果您对导航进行了更改,并且第一个提交是 fix(nav)
,则应继续使用 nav
来进行与导航相关的任何其他提交。一般来说,如果您修改了组件,请使用文件夹的名称。
主题
主题包含对更改的简洁描述
- 使用祈使句,现在时:“change” 而不是 “changed” 或 “changes”
- 不要将首字母大写
- 不要在末尾放置句号
.
- 提交消息的整个长度不得超过 50 个字符
- 描述提交做了什么,而不是它与什么问题相关或修复什么问题
- 简洁,但描述性 - 通过阅读主题,我们应该对提交做了什么有一个很好的理解
正文
与 **主题** 一样,使用祈使句,现在时:“change” 而不是 “changed” 或 “changes”。正文应包含更改的动机,并将其与以前的行为进行对比。
脚注
脚注应包含有关 **破坏性变更** 的任何信息,也是引用此提交 **关闭** 的 GitHub 问题的场所。
破坏性变更 应该以 BREAKING CHANGE:
开始,后面跟着一个空格或两个新行。提交消息的其余部分将用于此。
示例
不会出现在生成的变更日志中
docs(changelog): update steps to update
出现在“Features” 标题下,toast 子标题下
feat(toast): add 'buttons' property
出现在“Bug Fixes” 标题下,skeleton-text 子标题下,并带有指向问题 #28 的链接
fix(skeleton-text): use proper color when animated
closes #28
出现在“Performance Improvements” 标题下,以及“Breaking Changes” 标题下,其中包含破坏性更改的解释
perf(css): remove all css utility attributes
BREAKING CHANGE: The CSS utility attributes have been removed. Use CSS classes instead.
出现在“Breaking Changes” 标题下,其中包含破坏性更改的解释
refactor(animations): update to new animation system
BREAKING CHANGE:
Removes the old animation system to use the new Ionic animations.
如果以下提交和提交 667ecc1
位于同一个发布版中,它们不会出现在变更日志中。如果不是,则还原提交将出现在“Reverts” 标题下。
revert: feat(skeleton-text): add animated property
This reverts commit 667ecc1654a317a13331b17617d973392f415f02.
许可
通过将您的代码贡献到 ionic-team/ionic GitHub 存储库,您同意在 MIT 许可下许可您的贡献。