本文由 发布，转载请注明出处，如有问题请联系我们！ 发布时间: 2021-08-01js反编译成typescript-关于 TypeScript 总结

为了更好地处理逐渐从JavaScript向TypeScript转移的过程中碰到的困扰，FreeWheel关键业务流程精英团队评定明确提出了一套从protobf文档自动生成TypeScript种类申明文档的步骤，并适用protobf文档转变开启的种类申明文档自动升级。全部的TypeScript种类申明文本文档都储存为微服务架构，并集中化维护保养在公司货的集中型TypeScript库房中。

1环境

水泵飞轮关键业务流程精英团队的前后左右发展状况。

水泵飞轮关键业务管理系统选用分布式架构，应用Go语言做为微服务架构的编程语言，根据gRPC开展产品的远程控制启用。微服务架构中间的API接口由Protobuf界定，相对应的RPC插口编码由protocol自动生成。

微服务架构必须为Web前面和Open API给予Restful插口，而根据协议书转化成的产品一般用以群集内通讯。为了更好地与HTTP启用兼容，FlyFl应用grpc-gateway来变换Restful插口和代理商分享。

现阶段Web前面根据React部件开发设计，以JavaScript为官方用语。JavaScript是弱种类语言表达，自变量的种类在操作时界定，当今值决策当今种类。当今端互动必须了解变量类型时，前端工程师工作人员只有在查询Protobuf文档的界定来获得当今的变量类型，造成开发设计感受不佳，危害开发设计高效率。

集中型种类脚本制作种类库的规定。

根据这类状况，水泵飞轮关键业务流程的前端工程师精英团队已经逐渐将前端工程师语言表达从JavaScript转换到TypeScript。其首要因素是TypeScript做为JavaScript的典型化超集，填补了静态数据和弱典型化JavaScript的缺点，具备静态数据种类申明，能够降低很多不必要的种类分辨和手动式查询种类的成本费。开发设计流程中的静态数据种类定期检查种类提醒对提升开发设计高效率有积极主动功效。

可是在这个转换全过程中，很多基本上种类申明的结构变成了务必超越的差距，关键表现在下列二点:

缺乏內部公共性库的定义方法。现阶段网上一些相对年久的 JavaScript 库，不大可能用 TypeScript 改变，对这一部分文档假如可以给予一份公共的定义方法会更适合。缺少根据后面 Protobuf 界定相匹配的前面种类申明文档。现阶段全部微服务架构代码仓库已积累超出 700 个Protobuf接口定义文档，15k 个message界定。单纯性靠开发者笔写完成变换并不实际。并且Protobuf插口仍在持续提高和改动，相对应的种类申明文档也必须立即获得升级。

因而，根据企业的微服务质量，维护保养以TypeScript种类为核心的库房的市场需求是不言而喻的。这一库不但适用內部公共性库的种类申明，还适用全部微服务架构的种类申明文档。根据业务外包给全部企业的朋友共享资源，能够减少重覆开发设计的成本费。

这一设计灵感来自于TypeScript社区中最受欢迎的开源软件，Definitively Typed，它给予了npm中较常用的包的很多种类申明文档。与此同时，针对一些不给予申明文档的包，还适用单独开发者完成并上传入Definitively Typed开展共享资源，巨大地推动了TypeScript的普及化。可是DefinitelyTyped不包含Protobuf文档相匹配的前面种类申明文档的解决方法。为了更好地尽早在精英团队內部进行TypeScript的应用和营销推广，急需解决处理这一困扰。

全自动TypeScript种类库转化成方法的技能挑选与设计方案。

definitiytypedyuyuyu先來，大家参照它的构思并融合FreeWheel的发展趋势现况，设计方案并完成了一个全自动维护保养集中型种类库@fw-types的计划方案。

一方面适用自动化技术地由 Protobuf 文档转化成 TypeScript种类申明文档。当Protobuf 文档产生变更后开启转化成 TypeScript种类文档的自动化技术生产流水线，将升级后的文档全自动上传入@fw-types杜兰特，随后开启 npm 分包生产流水线将新的种类包上传入內部的 Artifactory 库房中，进而确保可以跟踪由 Protobuf文档的变更而导致的种类申明文档的转变。另一方面适用前端工程师工作人员能够给较老的前面库填补定义方法，递交 Pull Request 合拼到去中心化杜兰特，共享资源给我们应用。

技术性挑选

现阶段，GitHub上面有许多从Protobuf文档转化成TypeScript文档的专用工具。大家各自对这种专用工具开展了调查和试着，比照如下所示表所显示。

由于大家期待应用插口英语的语法界定的种类，因此大家必须维持初始字段名的环形取名，并转化成Protobuf界定所依靠的别的文件属性。最终，大家挑选原形加载器做为发展流程中的转化成专用工具。针对用户标识符的变换，有三种专用工具能够将Protobuf文档中的蛇名转化成骆驼峰名。AsObject指的是一类变换TypeScript包的专用工具的英语的语法，关键是在空中间取名类名的方式。针对空而言，它自身被理解为一个AsObject，取名空能够合理的阻拦同名的难题，可是每一种种类都必须再加上。启用全过程中的一个目标。另一种变换是以接头的方式，但现阶段以接头的方式发生的非常少。D.ts文件是一个规范化管理的种类申明文档，但事实上大家关注的是种类申明文档的內容。假如內容合乎预估，二者沒有不同之处。新项目的ts文件和d.ts文件。针对导进文档，仅有2个专用工具能够转化成他们相匹配的。ts文件。就社区文化活动来讲，全部这种专用工具全是主题活动的，而且在上个月有相应的递交。构造

总体解决方法的框架图如下所示。从@fw-types代码仓库的通道看来，能够分成两一部分:一是由protobf文档自动生成TypeScript文档，并因为protobf文档的变动而上传入@fw-types库文件；另一种是适用开发者在当地完成种类申明文档，并将他们上传入共享资源库时供大伙儿应用，如同DefinitelyTyped一样。

依据作用，全部管路可分成三个环节，即:

捕捉接口定义文档修改接口定义文档转化成种类申明文件属性申明文档分包

这三个环节将在下一章中详细说明。

3装配流水线持续交付实践活动的详细描述。

捕捉接口定义文档变更。

Protobuf转换为TypeScript的关键环节是维护保养Protobuf文档界定与每个版本号的种类申明文档一一对应。因而，从Protobuf文档的转化成逐渐，就必须不断集成化管路的干预。

捕获接口定义文档的转变是全部管路的第一阶段，如下图所显示。后端工程师工作人员递交Protobuf文档变动，相匹配的微服务架构持续交付完成检测后，将合拼到主支系。我们在微服务架构代码仓库的合拼事情中加入了一个webhook。每每开启合拼事情时，勾子将检验被改动的文档能否包括Protobuf文档，假如包括，则开启下一个每日任务。

插口文档转化成一个种类申明文档。

在这个环节，关键工作中是以Protobuf文档转化成TypeScript种类申明文档，并将修改后的种类申明文档全自动上传入@fw-types。充分考虑git能够更直观地得出变更文档的关键点，这一部分的内容只必须关心种类申明文档的转化成和递交。

种类申明文档的转化成。

在技术性挑选上，大家比照了现阶段非常盛行的一些开源软件，最后挑选了proto-loader做为发展流程中的转化成专用工具。可是软件自身只给予了最开始的转化工作能力，大家也有一些附加的工作中:

专用工具最后转化成的是以.ts后缀名的文档，包括了大家所须要的变量类型申明。但在人们的应用情景中还必须对外开放曝露index.d.ts文件以便捷前端工程师工作人员应用，因而必须将.ts文件统一在index.d.ts文件中向外export。针对转化成的.ts文件，大家还制定了相对的开始注解，反映当今文档是由专用工具自动生成的，而且显式地列举当今.ts 文档的Protobuf来源于，便捷追溯。//DON'T EDIT. THIS IS GENERATED CODE!//package: 微服务架构名//source: / 主库房 / 微服务架构 /proto/Protobuf 文档/***Generated by @fw-types.*Designed by @jsxu*@freewheel**/

向集中化库房递交文档。

在递交文档变更以前，大家必须掌握@fw-types库的总体文件目录构造:

以微服务架构为企业，每一个微服务架构维护保养一个文件目录，包括当今服务项目全部的.d.ts文件，及其统一向外曝露的index.d.ts文件。除此之外每一个微服务架构文件目录下还有一个package.json文档，这一文档是在接口定义文档转化成种类流程应用npm init转化成获得的，该文件包含了当今服务项目的版本号，依靠，名字等內容，给予给事后种类文档分包流程应用。commonTypes为一些基本的种类申明文档，比如 Protocol Buffers 自身理解的一些基本 Protobuf 文档和內部界定的一些公共性 Protobuf 文档。由于这种 proto 依靠基本上每一个微服务架构都是会使用，大家对于此事干了独特解决，独立分包管理方法。@fw-types|._serviceA|----index.d.ts|----type1.d.ts|----type2.d.ts|____package.json|._serviceB|._serviceC|._commonTypes

转化成种类申明文档后，能够根据git status指令得到变更文档的目录。有这两种状况:

A.针对新的微服务服务，相匹配的种类包都还没公布，因此沒有package.json文档，因此大家根据npm init转化成并配备相应的主要参数。

B.针对目前的微服务架构，必须更新package.json文档中的版本号字段名，详尽信息将在事后的package版本管理中详细介绍。

当全部的变更都做好准备，您能够启用git commit指令将变更递交到远程控制库房。大家专业设计方案了递交信息，包含相匹配的递交支系，那样根据递交信息能够方便快捷的追朔种类申明文档和相匹配Protobuf文档的转变。

种类申明文档收拢。

现阶段，水泵飞轮应用Artifacts来管理方法和储存产品工件。Artifactory是JFrog的商品，它不但能够管理方法二进制包文档，还能够管理方法目前市面上基本上全部语言表达的包相互依赖。此环节的种类申明文档收拢实际操作也在于Artifactory对npm包的适用。实际步骤如下所示:

当@fw-types库房的 webhook 检验到 push 事情时，会开启向 Artifactory 分包的每日任务，包以微服务架构为公司实现管理方法。去每一个服务项目下开展版本号较为，获取远侧当今服务项目的最新版与如今杜兰特的版本号核对，当不配对时，表明当今代码仓库下的版本号有一定的升级，必须启用 npm publish发新包。

这儿必须特别注意的是，第一次和第n次签订是有差异的。初次公布合同书时，Artifactory上沒有此产品的包。假如你读过版本号，你能立即出错并终断过程。因而必须确定是不是第一次公布合同书，融合第二阶段转化成种类申明文档的每日任务，对第一次公布的版本号开展特别解决。

最终，Artifactory上微服务架构模块的文件目录构造如下所示:

————————————————Artifactory——————————————————@fw-types ｜————service A ｜———— - ｜————@fw-types ｜—————— service A-0.0.0.tgz ｜—————— service A-0.0.1.tgz ｜—————— service A-0.1.0.tgz ｜—————— service A-0.2.0.tgz ｜————service B ｜————service C ｜————service D

应用状况

现阶段这一步骤早已适用了20 微服务架构，均值每日有5个以内的日常任务是根据Protobuf文档的转变全自动开启的。均值每一个protobuf的转变都能够在统一后的30min内从Artifactory免费下载到合适的包文档中。

在Web前端项目中，早已有三个新项目逐渐逐渐连接这种类别的包，巨大地提高了精英团队前端开发的研发感受。

下面的图是用转化成的TypeScript文档更换初始笔写种类。

4落地式申请办理存在的不足及解决方法。

最后编码获取

从最开始造成的生成全过程。ts文件到最后可以用。ts文件如下图所显示，包含专用工具转化成和二次变换。二次变换包含沉余编码删掉，取名变更和引入途径变更，下边逐一详细介绍。

沉余编码删掉。

原形加载器设计方案将转化成很多文档:

针对每一个message转化成一个.ts文件针对 rpc 插口转化成相对应的 .Service.ts文件用以运作时 protobuf 种类获得的 ProtoGrpcType 文档

针对水泵飞轮的业务场景，大家只关注。与信息相关的ts文件。除此之外，每一个信息转化成的插口还会继续有一个附加的._Output种类，这对咱们而言也没有什么用。因此这种不必要的编码必须删掉，导进要依据具体情况做好调节。

取名变动

原形加载器将信息名做为的文件夹名称。ts，这也许会造成文件夹名称反复的难题。比如，当微服务架构下的2个protobuf文件包含一条仅有英文大小写不一样的信息时，转化成的。ts文件仅有英文大小写不一样，储存在同一途径下。在一些不区别英文大小写的操作系统中，最后只剩余一个文档。因而，必须不断检验和重新命名转化成的文件夹名称，并应用Protobuf文件夹名称来区别他们。

转化成文档导进途径变更。

proto-loader转化成的种类申明文档中有对其他类型申明文档的引入。在立即转化成的結果中，导进的途径选用各种各样服务项目的Protobuf文档的初始途径关联，储存在proto子途径中，如import../proto/如下图所显示。

————————————————proto——————————————————micro_services_repo ｜————service A ｜—————— proto ｜—————— a.proto ｜—————— b.proto ｜—————— c.proto ｜————service B ｜————service C ｜————service D

大家维护保养的@fw-types途径如下所示，沒有proto根目录。因而假如。导进的ts文件途径与初始的原形途径一致，将不能恰当载入。必须变更它产生的文档导进途径，并在人们的@fw-types文件管理方法表格“导进”中载入它。/.

————————————————typescript——————————————————@fw-types ｜————service A ｜—————— a.ts ｜—————— b.ts ｜—————— c.ts ｜—————— index.d.ts ｜————service B ｜————service C ｜————service D

除此之外，因为一些程序的取名发生了转变，也必须更改相对应文档的导进途径，进而最后完成恰当种类的导进。

包版本管理

针对每一个微服务项目申明包，每一次升级d.ts文件时都必须升级版本信息，升级后的版本信息做为递交信息一起发给@fw-types。大家选用了SemVer标准。命名规范选用x.y.z的方式:

X 表明主版本信息，当 API 兼容模式转变时，X 增长Y 表明次版本信息，当存有不危害兼容模式的作用提升时，Y 增长Z 表明修定号，当存有不危害兼容模式的 Bug 修补时，Z 增长

现阶段，水泵飞轮关键应用proto3版本号。根据默认设置的前向兼容模式，大家临时只更新x和y位。由于难以界定Protobuf的bug修补个人行为，因此仅有兼容模式的更改和新特点的添加。最后版本号是融合Protobuf的修改明确的。X位表明兼容问题的变更，Y位表明在新字组词段中加上新作用。

前面库的种类适用。

此解决方法的效果是维护保养公司货的TypeScript种类集中化储存库。除开为Protobuf文档转化成TypeScript种类申明文档以外，它还应当遮盖前面库的一些种类申明。因而，大家也适用前端工程师工作人员在@fw-types库房中以Pull Request的方式递交企业现阶段应用的JavaScript库的笔写种类申明文档，并共享给全公司的朋友，期待在企业方面维护保养一个活泼的TypeScript绿色生态。

5未来计划和市场前景。

总的来说，能够看得出尽管proto-loader解决了绝大多数难题，但也引进了许多附加的工作中。大家方案订制一个版本号的根据proto-loader的转化成专用工具，以达到FreeWheel的要求，进而减少一部分编码开展二次变换的维护保养成本费。这一部分工作中早已在进行中。

除此之外，转化成的编码都还没lint和恢复出厂设置。为了更好地保证统一的转化成文档款式，大家必须加上对lint和恢复出厂设置的适用。

最终，@fw-types库房的兴起和应用必须给予更简洁的浏览流程，再次提升对大量微服务架构和前面库的适用，促使从JavaScript到TypeScript的转移更为简易顺畅。