Deno 使用TypeScript

TypeScript 简介

TypeScript 是 JavaScript 的超集，它为 JavaScript 添加了静态类型检查和其他一些特性。这使得开发大型应用更为容易，因为它允许开发者在编译阶段就发现类型错误，从而提高代码质量并减少运行时错误。

安装 TypeScript

要使用 TypeScript，首先需要安装 TypeScript 编译器。你可以通过 npm（Node 包管理器）来安装它：

npm install -g typescript

创建 TypeScript 项目

为了创建一个基本的 TypeScript 项目，你需要初始化一个新的 npm 项目，并安装必要的依赖项：

mkdir my-deno-ts-project
cd my-deno-ts-project
npm init -y
npm install --save-dev typescript @types/node

配置 TypeScript

为了配置 TypeScript 编译器的行为，你需要创建一个 tsconfig.json 文件。这个文件可以控制诸如输出目录、模块系统、编译选项等。

// www.javascriptcn.com code example
{
  "compilerOptions": {
    "target": "ESNext",
    "module": "esnext",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "outDir": "./dist"
  },
  "include": ["src/**/*.ts"],
  "exclude": ["node_modules"]
}

这里配置了一些常见的选项：

• "target": "ESNext"：设置目标 ECMAScript 版本。
• "module": "esnext"：指定使用的模块系统。
• "strict": true：启用所有严格类型检查选项。
• "outDir": "./dist"：指定编译后的文件输出目录。

编写 TypeScript 代码

在你的项目中，你可以开始编写 TypeScript 代码了。假设你的项目结构如下：

my-deno-ts-project/
├── src/
│   └── main.ts
├── dist/
├── package.json
└── tsconfig.json

在 src/main.ts 中编写如下代码：

// www.javascriptcn.com code example
// src/main.ts

import { serve } from "https://deno.land/std@0.168.0/http/server.ts";

const server = serve({ port: 8000 });
console.log("Server running on http://localhost:8000");

for await (const req of server) {
  req.respond({ body: "Hello World\n" });
}

这段代码使用了 Deno 的标准库来启动一个 HTTP 服务器，监听端口 8000 并响应请求。

编译和运行 TypeScript 代码

为了将 TypeScript 代码编译成 JavaScript，你可以使用 TypeScript 编译器。首先确保你的 tsconfig.json 已经正确配置，然后运行以下命令：

npx tsc

这将根据你的配置编译 TypeScript 源代码，并将生成的 JavaScript 文件输出到 dist/ 目录。

接下来，你可以使用 Deno 来运行编译后的代码：

deno run dist/main.js

你应该会看到类似这样的输出：

Server running on http://localhost:8000

尝试访问 http://localhost:8000，你会看到返回的 "Hello World" 消息。

总结

通过上述步骤，你已经成功地在一个 Deno 项目中集成了 TypeScript。这种组合不仅可以让你利用 TypeScript 的静态类型检查优势，还可以享受到 Deno 强大的现代 JavaScript 运行时带来的便利。希望这些步骤能帮助你在未来的项目中更加高效地使用 TypeScript 和 Deno。