简介
github-portfolio-component 是一个用于构建属于自己的 GitHub 仓库展示页面的开源组件，该组件由 React 框架构建，是一款非常适用于开发者的展示组件，在招聘、项目展示等场合都十分实用。
安装
使用该组件前需要先安装 npm 包管理工具，如果已经安装可以跳过此步骤，否则请参照 npm官网 的安装教程进行安装。
安装成功后，在命令行窗口输入以下命令来安装组件：
npm install github-portfolio-component
使用
安装完成后，在你的项目中引入组件：
import GithubPortfolio from 'github-portfolio-component';
Props
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
username |
string |
必填项，你的 GitHub 账户名 | |
repositories |
string[] |
[] |
要展示的仓库名称，留空则展示所有公共仓库 |
maxRepositories |
number |
5 |
展示的最大仓库数量，例：maxRepositories={10} 展示最多十个仓库 |
colored |
boolean |
true |
是否开启颜色显示 |
showForks |
boolean |
true |
是否展示 Fork 数量 |
showDescription |
boolean |
true |
是否展示仓库描述信息 |
languageFilter |
string |
all |
语言过滤器,允许的值为 'all', 'javascript', 和 'python', 留空则不应用语言过滤器 |
showSize |
boolean |
false |
是否展示总代码量,如果为 true，则总代码量会被展示在展示的仓库数量下面 |
cacheTimeout |
number |
5 |
请求在缓存过期前多久刷新，单位为分钟，例如，如果设为 60，数据将在 60 分钟后刷新 |
示例
-- -------------------- ---- ------- ---------------- --------------------------- ----------------------- -------- --------- ------------------- --------------- ---------------- ----------------------- --------------------------- --------------- ----------------- --
贡献
如果您需要对该项目进行贡献，欢迎在 Github 仓库上发起一个 pull request 或提供一个 issue，非常感谢您的贡献。
结语
通过本文的介绍和示例，相信你已经能够成功使用 github-portfolio-component 这一开源组件来为自己的 GitHub 仓库展示页面增加更多的吸引力和功能性，让其更加个性化。希望本文能够对你有所帮助，谢谢你的阅读！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005754881e8991b448ea4f1