用Typescript开发NodeJS项目

本文示例用Typescript写一个基于ExpressJS的REST API项目

 

第一步：

全局安装Typescript

npm install -g typescript

在项目路径下，执行：

tsc --init

产生一个tsconfig.json文件，并在文件中添加下配置：

"moduleResolution": "node"

 

第二步：

npm --init

npm初始化，并安装以下package

npm install --save express

npm install --save body-parser

npm install --save-dev @types/node

npm install --save-dev @types/express

npm install --save-dev @types/body-parser

@types的package是typescript版本。

 

第三步：

编写REST API的typescript代码：

app.ts

import express from 'express';
import bodyParser from 'body-parser';

import todoRoutes from './routes/todos';

const app = express();

app.use(bodyParser.json());

app.use(todoRoutes);

app.listen({port: 3000});

routes/todo.ts

import Router from "express";

import { Todo } from "../models/todo";

let todos: Todo[] = [];

const router = Router();

router.get("/", (req, res, next) => {
  res.status(200).json({ todos: todos });
});

router.post("/todo", (req, res, next) => {
  const newTodo: Todo = {
    id: new Date().toISOString(),
    text: req.body.text,
  };

  todos.push(newTodo);

  res.status(201).json({ message: "Added Todo", todo: newTodo, todos: todos });
});

router.put("/todo/:todoId", (req, res, next) => {
  const tid = req.params.todoId;
  const todoIndex = todos.findIndex((todoItem) => todoItem.id === tid);
  if (todoIndex >= 0) {
    todos[todoIndex] = { id: todos[todoIndex].id, text: req.body.text };
    return res.status(200).json({ message: "Updated todo", todos: todos });
  }
  res.status(404).json({ message: "Could not find todo for this id." });
});

router.delete("/todo/:todoId", (req, res, next) => {
  todos = todos.filter((todoItem) => todoItem.id !== req.params.todoId);
  res.status(200).json({ message: "Deleted todo", todo: todos });
});

export default router;

models/todo.ts

export interface Todo{
    id: string;
    text: string;
}

 

第四步：

执行 tsc 可以编译所有ts，但是nodejs不能执行ts代码，用 node app.js 启动node

在tsconfig.json中添加编译选项：

"outDir": "./dist"

可以将所有的js编译到一个目标路径下

 

"rootDir": "./src"

可以指定项目源文件路径，建议把所有ts文件放到这个路径下