让你的系统支持git管理：使用isomorphic-git让数据库具备版本控制

我们日常开发工作中避免不了要使用代码管理工具，其中git是我们熟知的一种，操作它可以使用git bash命令行也可以使用TortoiseGit(小乌龟)等。

这些都是基于我们在本地进行代码管理，然后跟远端同步，那假设我们的代码就在远端呢？不在本地电脑，或者我们要管理的内容是通过浏览器传过来的，不是我们使用本地编辑器创建的，这时候能处理吗？

概述

要知道git可以管理任何内容，不仅仅是代码。

比如我们的数据库内容修改了之后如何查看修改记录呢？再比如用户传过来的文本或者文件想要存储起来，并且可以修改，那如何查看之前的版本呢？

我们想要把某个接口得到的数据进行版本管理，该如何做到呢？

方法肯定有很多种，今天我们来看看使用isomorphic-git能做些什么吧。

我们来分为三个部分进行讲述，每一部分都对应了不同的可操作内容。

要实现上述所说需求，涉及到了后端的内容，所有功能全部由页面中调用接口实现。

而且通过这种方式，要管理的代码所在的电脑或者服务器上面不需要安装git等，直接本身就可以实现这些功能。

一、本地git文件管理

此处的本地不是指本机电脑磁盘，而是指存放git文件的地方，将放在远端服务器等处。这里是相对于github、gitee等而言的。

1. 初始化git项目文件

通过git.init方法来初始化一个git目录，用来作为你的工作目录进行版本控制。可以指定默认分支，默认为master：

const dir = join(process.cwd(), config.gitFolder)
await git.init({
  fs,
  dir,
  defaultBranch: bd.localBranch
})

这里的gitFolder是我设置的默认路径，指定了存放在当前项目下的public/pageRecord文件夹中。

点击该按钮，我们看下效果：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VgHuuahr-1685928027259)(https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/bee3b95863d34687a65dd1d03e54aa6f~tplv-k3u1fbpfcp-zoom-1.image)]

已经生成了.git文件夹。

2. 同步数据库到本地文件

这个是我自己写的将数据库中的数据同步到public/pageRecord文件夹中，并根据不同的数据记录生成不同的文件夹以及文件，看下效果。

已经将数据库的文件同步到指定文件夹下面了。

3. 将修改文件添加到待提交区

通过git.add将刚生成的文件添加到暂存区，这就相当于我们的git add。看下效果：

这个时候文件就已经添加到git的暂存区了。

4. 将待提交区文件进行提交

通过git.commit来提交刚才的文件，这个就相当于git commit，我们提交一次看看：

由于我们是第一次提交，并且没有设置账户信息，因此需要我们填写一下，再看下工作目录：

这个时候已经将暂存区的文件提交到了分支上面。

好了，服务器上面的git工作目录已经完事了，以github为例，我们继续看下远端git的管理。

二、远端文件管理

1. 配置远端git仓库地址

这里我在自己的仓库上建立一个测试仓库，看看它们是怎么运作的。

这样我们在github上就建立了一个test-project的仓库。

回到我们的页面，点击该按钮：

通过git.addRemote就可以添加该地址，现在我们已经设置好了远端仓库的地址。

2. 拉取远端文件到本地

这里由于我们新建了一个空仓库，并且本地已经生成了git工作目录，因此我们只看第3个功能。

如果github上面已经有一个现成的项目仓库，而本地是空的工作目录，那么可以利用这个功能(git.pull)将github上面的仓库拉取到本地。

3. 推送本地文件到远端

使用git.push来完成此操作，相当于git push

当我们推送的时候需要输入验证信息，点击确认按钮，看看发生了什么：

已经将本地的文件上传到了github上面。

4. 设置其他git配置项

主要是用git.setConfig来设置一些额外的配置项，方便我们后续的操作：

比如我们这里设置账户名称和邮箱，那么它就会同步在配置文件里面：

这里只是举个例子，实际中我们应该使用真实的信息。

三、git日志与配置

1. 提交日志

通过git.log来完成此操作，点击该按钮：

可以输入一些查询的信息选项，也可以直接点击确认，来默认查询：

能够看到，我们刚才的提交记录被展示出来了，点击查看图标，可以查看本次的提交内容：

顶部是我们的提交说明，下面是添加的所有文件信息。

点击对应的文件，可以查看详细内容：

展示出了该文件从无到有的添加过程与内容。

我们现在试着来修改其中一个文件，并添加到暂存区，然后提交到分支，但是不进行推送。

利用上面我们做出的功能来操作一下，看看这回的日志：

已经出现啦！

相应的内容变成了修改。

也能看到修改的详细信息。

2. 文件日志

主要通过git.walk和git.tree来配合完成该功能。

点击该按钮，我们能看到当前git工作目录下的全部文件：

点进对应的目录，一直找到我们刚才修改的文件：

查看日志可以看到该文件被修改的日志记录：

一共被修改了两次，在这里同样可以通过查看图标继续查看详细信息。

3. 文件状态

这里是通过git.statusMatrix来实现文件状态的查看。

可以看到，我们刚才提交之后再未做过任何修改。

现在让我们来修改一下，看看它们的几种状态：

可以看到，有修改的、删除的、新增的。这里全部都列了出来。

4. 基本配置

这里可以查看我们给git设置的配置项，简单来查询一下：

这样就可以看到我们刚才设置的配置信息。

最后

我们通过isomorphic-git实现了从数据库到服务器到github的数据版本控制。并具备了初始化、添加、提交、同步、推送、拉取、信息配置、提交日志查看、文件日志查看、文件状态查看、配置信息查看等功能。

其实isomorphic-git还具有很多其他的能力，可以自己尝试实现一下，这里就不演示了。

总结

使用isomorphic-git能够满足我们开发工作的一部分场景，解决我们需要对一些持久化数据做版本控制的需求，但是需要后端的支持，比如这里我自己写了后端的接口，通过在前端页面中进行友好的交互，来控制想要做的操作。同样它也提供了纯前端的引入，可以通过CDN等方式来实现，然后通过在浏览器的本地存储中实现各种操作。

需要体验可以访问：

// 项目集成isomorphic-git，操作工作目录，作版本控制
// http://lnsstyp.com/manage

有兴趣的小伙伴可以尝试一下，也可以自己做一做，希望能够帮助到你。