开源-从查找错别字开始 ​

在坐的各位大佬代码写的都比我好，所以就不班门弄斧了讲怎样写出优雅的代码了，我的分享的主题是做开源，以及我的做开源经历，抛砖引玉一下 😋。

做开源的好处 ​

上班已经很忙了，回家确实是不想动。我一般是这么提醒自己的，就跟锻炼身体一样，抽点时间。

因为我们代码写不过那些大佬就看看有没有机会弯道超车了。很多时候也是一种 时间换天分 的事情。

• 有机会看到大佬是如何写代码的，能学到一些比较先进的技术：

  • 我们公司技术栈都是 react 方向，可以学习一下 vue 方向的技术栈，比如最新的 Vue3。
  • 测试（jest）、工程化 monorepo、等等接触少的技术

• 提升自己影响力的方式之一

  • 还可以写博客、录视频等等，总之就是利用现在的互联网资源。

• 面试杀手锏之一吧，如果有参与明星项目的话，如果是技术面试官看到的话，相信多少会给咱一个面试机会！

  可以和面试官吹吹牛之类的，如果面试官被我们吹到了，心里想：这次稳了，我要 30K😄！

我的开源经历 ​

简单分享一下我给 vitepress 项目贡献代码的经历

vitepress 是一个和 Vue 团队开发的一个能够基于 markdown 生成静态网站的工具，其上一代产品是 vuepress ，前端伙伴应该有用过这个工具。

我有一个个人博客知识星球，有一次我收到腾讯云的一条信息，提示网站底部备案区域有问题。


于是我看了一下 vitepress 的官网关于 footer 这块的配置:footer 配置，发现其配置项只支持 string 类型的参数，于是我想，再加个 link 配置，然后再小小的修改一下代码，让他支持一下点击事件就好了。

这个是很重要的，有自主上线过一些网站的小伙伴应该都知道，只要是咱们国内的网站，工信部都是要求在首页底部需要附上备案链接，以及实现点击之后能够跳转至工信部首页的功能。

之后将项目 fork 下来以后，找到这块的配置，发现这块的处理方式是通过v-html来渲染的，而不是通过插值表达式(两个大括号)来实现的，所以！本质上我们只要传递 html 字符串 => a 标签字符串就好了。

但是文档并没有说明这一点，需要完善一下，尤其是我们国内的网站，都必须要能够链接跳转至工信部的首页，所以这个描述还是很重要的，于是我就给 vitepress 提了一个 pr，结果不到半小时就被合并了。

现在官网里对于这块配置的描述就是当时我加的。

如何做开源 ​

大致的给 xdm 演示一下

• 到 github 上找到一个喜欢的项目

  这里以 vitepress 为例

• fork 它

• 将 fork 的代码克隆至本地

  git clone

• 创建并切换至一个关于这个 pr 的分支

  git checkout -b feat/demo1

• 将项目运行起来

  如何运行一个全新的项目至为关键！就相当于看一个项目的源码了。

  • 先看package.json的启动命令
  • 了解项目的目录结构，每个文件是做什么的
  • 是着运行它，并做一些小修改，查看页面的变化。

• 写代码

  这部分就是写 pr 的部分

• 将本次改动推动到远程的分支

  git push -u origin feat/demo1

• 这时候再 github 这个项目的页面，就会有很明显的合并分支的按钮出现，点合并就好了。

• 输入关于 pr 的信息

  这一步也是比较重要的，要看提交 pr 是否符合统一的规范，不符合规范的可能那些大佬不会看。

• 祈祷被合并进去

  这块就等着吧~。

私活时间 ​

分享完毕，感谢大家，下面我花两分钟带点私活~

我是练习时长快一年的新人 up 主，平时有分享一些前端开发相关内容。如果各位小伙伴们有玩 B 站的话，咱们可以互粉一下 😄