最全 Node 项目 TypeScript 配置

Photo by Lucas Benjamin on Unsplash

此文包含:TypeScript 配置、Nodemon 配置、VSCode 调试配置。

TypeScript 配置

在配置文件 tsconfig.json 中可以指定目标输出、项目根目录路径等,指定 sourceMap 为真方便调试。

Nodemon 配置

可以单独开辟一个 nodemon.json 文件描述配置。这里采用 ts-node 和 path/register 来解决 tsconfig.json 中 baseUrl 不是当前目录的问题。

然后你可以在 NPM Script 中方便的使用 nodemon 来启动项目。

继续阅读最全 Node 项目 TypeScript 配置

TrueType 与贝塞尔曲线

Photo by Çağdaş Ermiş on Unsplash

TrueType字体中的字符(或字形)轮廓由直线和二次贝塞尔曲线(bézier)片段构成 —— 维基百科。当我们使用 ttf.js 来解析 TTF 字体的时候,可以得到每个文字所包含的轮廓点的信息。这个轮廓点信息由直线和贝塞尔曲线构成。我们可以利用这些轮廓点来生成 SVG 图片。

图中 Q 开头的坐标都是二阶贝塞尔曲线的控制点。通过控制点信息,依据二次贝塞尔曲线公式就可以渲染出轮廓线条。对其进行填充后,就能得到一个实心的字体或是图标。

继续阅读TrueType 与贝塞尔曲线

源码角度理解 CORS

Photo by Museums Victoria on Unsplash

Cross-Origin Resource Sharing (CORS) 也叫做跨域资源共享。浏览器会自动判别一个 HTTP 请求是否跨域,并自动与后端服务协商。由后端服务来决定是否接受此跨域请求。学习 CORS 中协商过程需要两步,一是通过跨域资源共享 CORS 详解MDN 上的手册,二是通过源码。

koa 中有个中间件就叫做 @koa/cors。此中间件根据 CORS 协议规范,创建了一个与浏览器交互的 CORS 处理函数。本文从此中间件入手,结合手册详细讲述 CORS 的后端实现。

继续阅读源码角度理解 CORS

使用 Node 原生方法处理 HTTP 请求

Photo by frdm . on Unsplash

koa 和 express 两种框架都对原生的 HTTP 进行了封装方便用户快速地开发 Web 应用。但是对于 HTTP 请求体的解析都没有提供内置的处理。

在 Node 中 HTTP 请求对象被分装成了一个流对象,因此需要使用读取流的方法去处理。当然,开源社区为这两种框架都提供了 body-parser 中间件,极大了简化了 HTTP 请求体解析的流程。但是 Node 原生方法是 body-parser 中间件的基础,让我们一起来探索吧。

继续阅读使用 Node 原生方法处理 HTTP 请求