16
翻译:疯狂的技术宅
原文:https://medium.com/dailyjs/ho...

本文首发微信公众号:前端先锋
欢迎关注,每天都给你推送新鲜的前端技术文章


clipboard.png

我们在工作中经常会进行很多繁琐的任务:更新配置文件,复制和粘贴文件,更新 Jira 标签等。

慢慢的花在这些任务上的时间会越来越多。我在 2016 年时在一家网络游戏公司工作时,类似的工作很多。当时我在为游戏构建可配置的模板,这项工作也许很有价值,但是由于要重新设置皮肤,我必须把大约70%的时间消耗在制作那些游戏的副本、模板和部署等工作上。

什么是Reskin?

公司 reskin 的定义是使用相同的游戏机制,屏幕和元素的定位,但改变了视觉美学,​​如颜色和资源等(译者吐槽:实际上就是给游戏换皮。。。)。所以像 “石头剪子布” 这样的简单游戏,我们将创建一个有如下基本资源的模板。

clipboard.png

但是当我们创建一个 reskin 时,会使用不同的资源,同时还要保证游戏仍然可以正常工作。如果你玩过像“糖果传奇” 或“疯狂的小鸟”这样的游戏,会发现它们通常会在万圣节,圣诞节或复活节发布很多风格类似的游戏。从商业角度来看这很有意义。现在......让我们回到实施过程。我们的每个游戏都共享相同的 JavaScript 文件,并加载到具有不同内容和资源路径的 JSON 文件中。结果会怎样?

clipboard.png

实际上我和其他开发人员的时间表上已经积压了大量的任务,我的第一个想法就是“很多工作都可以进行自动化处理”。每当我创建一个新游戏时,都必须执行以下步骤:

  1. 对模板存储库进行 git pull 以确保它们是最新的;
  2. 从主分支创建一个新分支 —— 由 Jira 故障单 ID 进行标识;
  3. 制作我需要构建的模板的副本;
  4. 运行 gulp;
  5. 更新 config.json 文件中的内容。这将涉及资源路径,标题以及服务请求的数据;
  6. 在本地进行构建,并检查与相关人员的 word 文档匹配的内容。 是的,我知道;
  7. 与设计师确认他们是否对外观满意;
  8. 合并到主分支并继续处理下一个分支;
  9. 更新 Jira 标签的状态,并为相关人员发表评论;
  10. 清盘并重复。

clipboard.png

相比较而言,这比单纯的开发工作多了许多管理上的事情。我以前曾经接触过 Bash 脚本,并通过它来创建一些脚本以减少工作量。其中一个脚本更新了模板并创建了一个新分支,另一个脚本则执行提交并将项目合并到演示和生产环境。

通常手动设置项目需要三到十分钟,部署可能需要五到十分钟。但是根据游戏的复杂程度,也可能需要十分钟到半天。尽管脚本能有所帮助,但仍需要大量的时间用于更新内容或追查丢失的信息。

clipboard.png

通过编写代码来缩短时间是远远不够的。我们还需要思考优化工作流程的好方法,以便可以更多地去依赖脚本。比如将内容从 word 文档中移出,并转移到 Jira 标签中,再将其分解为相关的自定义字段。设计人员不是发送公共驱动器上资源所在位置的链接,而是去设置一个内容交付网络(CDN)存储库,其中包含对资源的暂存和发布到生产环境的 URL。

Jira API

这些事情可能需要一段时间才能实施,但我们的流程确实会随着时间的推移而得到改善。我对我们的项目管理工具 Jira 的 API 进行了一些研究,并对正在处理的 Jira 标记做了一些请求,得到了大量有价值的数据,所以我决定将这些请求集成到了自己的 Bash 脚本中,以便能够从 Jira 标记中读到值,并在完成后发布评论和通知相关人员。

从 Bash 过渡到 Node

Bash 脚本很好,但如果有人在 Windows 机器上工作,它们就无法运行了。在做了一些挖掘之后,我决定用 JavaScript 将整个过程包装成一个定制的构建工具。我给这个工具取名为Mason,它将会改变一切。

CLI

当你在终端中使用 Git 时(我假设你在这样做),会发现它有一个非常友好的命令行界面。如果你拼写错误或输入错误的命令,它会友好地对其认为你想要输入的内容提出建议。一个名为 commander的库应能够提供相同的功能,它是我使用的众多库之一。

请参考下面这个简化的代码示例。它正在对命令行界面(CLI)程序进行引导。

src/mason.js

使用 npm,你可以从 package.json 运行一个链接,它将会创建一个全局别名。

npm link

它将为我提供一个可以调用的命令,被称为 mason。所以每当我在终端中调用 mason 时,它将运行 mason.js 脚本。所有任务都属于一个名为 mason 的综合命令,我每天都用它来构建游戏,节省的时间真的是......令人难以置信。

你可以在下面看到:我将 Jira 标签编号作为参数传给命令。这将会使用 curl 去请求 Jira API ,并获取更新游戏所需的所有信息。然后它将继续构建和部署项目。最后我会发表评论并标记相关人员和设计师,让他们知道工作已经完成。

$ mason create GS-234
... calling Jira API 
... OK! got values!
... creating a new branch from master called 'GS-234'
... updating templates repository
... copying from template 'pick-from-three'
... injecting values into config JSON
... building project
... deploying game
... Perfect! Here is the live link 
http://www.fake-studio.com/game/fire-water-earth
... Posted comment 'Hey [~ben.smith], this has been released. Does the design look okay? [~jamie.lane]' on Jira.

依靠这些我们就完成了关键的步骤!我对整个项目感到非常满意。


本文首发微信公众号:前端先锋

欢迎扫描二维码关注公众号,每天都给你推送新鲜的前端技术文章

欢迎扫描二维码关注公众号,每天都给你推送新鲜的前端技术文章


欢迎继续阅读本专栏其它高赞文章:


疯狂的技术宅
44.4k 声望39.2k 粉丝