Fastify是一个快速、低开销（low overhead）的Node.js web框架，拥有许多出色的性能特性。它允许你轻松地构建可扩展的、容错的Web应用程序。
TypeScript则是一种由微软开发的静态类型检查的Javascript。它允许我们在编写JavaScript代码时添加类型注释，并找到并修复我们开发中的bug。
在这篇文章中，我们将学习如何在Fastify应用程序中使用TypeScript进行开发，以及如何最大程度地利用这两个强大的工具。
准备工作
在深入讨论前，我们需要进行一些准备工作：
安装 Fastify
你可以通过npm全局安装Fastify：
--- ------- -- -------
或使用npx快速应用Fastify的默认模板:
--- ----------- -------- --------------
安装 TypeScript
接下来，我们需要通过npm全局安装TypeScript：
--- ------- -- ----------
配置 TypeScript
TypeScript需要一个配置文件（tsconfig.json）告诉它如何编译我们的代码。创建一个新的tsconfig.json文件：
-
------------------ -
--------- ---------
--------- -----------
--------- ---------
--------- -----
------------------ -----
-------------------- -----
------------ ----
--
---------- -------------
---------- ---------------- ---------------
-这个tsconfig文件的配置项需要注明一些重要的事情：
- target: TypeScript编译的目标代码版本。我们选择es2017，因为Fastify需要ES6的Promise API。
- module: 生成的代码模块系统。我们使用了commonjs模块。
- outDir: TypeScript结果放置的地方。
- strict: 开启TypeScript的严格模式。
- esModuleInterop: 允许安全的在不同模块系统中导入代码。
- resolveJsonModule: 允许我们导入JSON文件作为模块的一部分。
- sourceMap: 开启生成的代码映射。
构建Fastify服务器
现在我们可以通过npx快速创建一个Fastify的项目：
--- ----------- -------- ------------------
fastify-typescript目录中已经有了所有的 Fastify 项目模板。现在删除不需要的部分（views目录和样板）。
接下来，我们创建src目录，它将包含我们所有的TypeScript代码。为了启动Fastify，我们需要在src目录中创建server.ts文件。在其中添加如下代码：
------ -------- - --------------- - ---- ----------
----- ------- --------------- - --------- ------- ---- ---
--------------- ----- --------- ------ -- -
------------ ------ ------- ---
---
----- ----- - ----- -- -- -
--- -
----- --------------------
- ----- ----- -
----------------------
----------------
-
--
--------首先，我们导入Fastify库。然后配置一个Fastify实例，将logger参数置为true。
然后，我们定义了GET路由，向 "/” 路径发出请求会返回一个JSON对象。最后，我们定义了start()方法，它将启动服务器并监听3000端口。如果服务器启动失败，将会记录错误信息并退出进程。
我们还需要更新 package.json 文件，加入依赖的包 :
-
------- ---------------------
---------- --------
------- ---------------
---------- -
------ -------- ---------------
-------- ------
-------- ----- ---------------
--
--------------- -
---------- ---------
--
------------------ -
-------------- -----------
---------- ----------
------------- --------
-
-这个package.json文件添加了三个脚本：dev、build和start。
- dev: 使用ts-node运行服务器。
- build: 编译TypeScript代码。
- start: 使用node运行编译后的JavaScript代码。
同时，这个文件还添加了fastify模块的依赖。
现在我们可以运行 yarn dev 或 npm run dev 命令启动服务器，它应该监听在localhost:3000端口，并且在浏览器中访问 http://localhost:3000 将得到响应对象。
TypeScript 中的 Fastify 装饰器
在讲如何重构之前，先来简单介绍下Fastify的装饰器。Fastify提供了一些装饰器，可以让我们使用类更方便（注：在ES6中，class/babel 等装饰器主要是语法糖的使用。），也让我们可以更容易地构建可维护的应用程序。
每个装饰器都绑定在 Fastify 实例中。我们可以通过以下示例学习他们的用法。
基本路由
Fastify可以通过装饰器加路由。路由通过接收请求URL和处理器函数，然后返回处理结果。以下是一个基本装饰器路由的例子：
------ - --------------- - ---- ----------
------ - ----------- --- - ---- ---------------------
----------------
----- ---- -
---------
----- -------------- ------ -
------------ ------ ------- ---
-
-
----- ------- --------------- - --------- ------- ---- ---
---------------------------------------------- -
----------- -
---------------------
--
---
---------------------------------
------------------------- -
---- -------------------- -----------
-------------- -------------------
---
------------------------------- ------ -- -
------------ ------ ------ --- ------ ---
---
-------------------------------- --------
------------------- ----- -------- -- -
-- ----- -
-----------------
----------------
-
------------------- --------- -- -------------
---如您所见，在Fastify中构建装饰器路由非常容易。我们首先使用@Controller装饰器声明路由控制器，然后使用@GET装饰器声明路由。
带参数的路由
我们可以在装饰器上使用占位符来定义路由参数。下面例子中的请求将带一个名为id的参数：
---------------------
----- ---- -
------------
----- -------------- ------ -
----- - -- - - ---------------
------------ -- ---
-
-帶请求体的路由
在路由中，我们也可以处理请求体。我们可以使用@POST装饰器来获取POST请求体：
---------------------
----- ---- -
----------
----- -------------- ------ -
----- - ----- --- - - -------------
------------ ----- --- ---
-
-有了Fastify的装饰器，让我们看看如何在我们的应用程序中使用它们。
TypeScript重构
现在让我们来重构 server.ts 文件，使用装饰器。我们创建 routes 目录，在目录下创建 index.ts 文件、routes.ts 然后我们将删除原来的routes（通过删除routes文件及routes文件引用），通过重构重要代码，使用 Fastify 的装饰器新特性。
使用@Controller装饰器
第一步，我们创建 routes/index.ts 文件，并添加控制器装饰器：
------ - --------------- - ---- ----------
------ - ---------- - ---- ---------------------
------ - ------ - ---- -----------
----- ------- -------- - -
--- ------------
--
----------------
------ ----- ---------------- -
------------------- -------- ------- ---------------- -
-------------------- -- --------------------------
-
-在这里，我们将路由控制器放在一个名为RoutesController的类中。我们下一步将引用这个RoutesController，并使用@Controller将其绑定到Fastify实例上。
使用@GET装饰器
现在，让我们看看如何 创建一个路由，如何使用@GET装饰器。以下是在我们的新控制器中创建GET路由的代码：
------ - --------------- ------------ - ---- ----------
------ - ----------- --- - ---- ---------------------
----------------
------ ----- ---------------- -
-- -------
---------
----- -------------- --------------- ------ ------------- -
------------ ------ ------- ---
-
-这样，我们就定义了一个路由到根路由，并用 @GET 装饰器修饰了index方法。
使用@POST装饰器
我们在上文已经演示了如何使用@POST装饰器处理请求体。我们重构的示例中，RoutesController 中添加的@POST路由：
----------------
------ ----- ---------------- -
-- -------
----------
----- -------------- --------------- ------ ------------- -
----- - ----- --- - - -------------
------------ ----- --- ---
-
-结论
通过上面的学习，我们了解了基于Fastify的TypeScript编 写,并且简化配置节点，大大提高了我们的开发效率。正如您在这篇文章中所看到的，可以使用装饰器编写模块化、可维护和高可读性的代码。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6735703b0bc820c5824e711c