当前位置: 首页 > article >正文

express搭建ts(TypeScript)运行环境

要在使用 TypeScript 的环境下运行一个简单的 Express 应用,可以使用 ts-node 直接运行 TypeScript 文件,而无需先将其编译为 JavaScript。以下是一个简单的示例,展示了如何设置和运行一个基本的 Express 应用。

步骤

1. 初始化项目

首先,初始化一个新的 Node.js 项目:

mkdir lmb-express
cd lmb-expres
npm init -y

2. 安装必要的依赖

安装 Express 和 TypeScript 以及类型定义:

npm install express
npm install --save-dev typescript @types/express @types/node ts-node

3. 创建 tsconfig.json

可以直接使用 tsc --init 生成,内容无需修改。
也可以在项目根目录下创建一个 tsconfig.json 文件,内容如下:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  }
}

4. 创建项目结构

创建一个 src 目录,并在其中创建 index.ts 文件:

mkdir src
touch src/index.ts

5. 编写 index.ts

src/index.ts 文件中编写以下代码:

import express from 'express';

const app = express();
const port = 3000;

app.get('/', (req, res) => {
  res.send('Hello, TypeScript with Express!');
});

app.listen(port, () => {
  console.log(`Server is running at http://localhost:${port}`);
});

6. 运行 TypeScript 文件

6.1、使用 ts-node 直接运行 index.ts 文件:

npx ts-node src/index.ts

你应该会看到控制台输出类似以下内容:

Server is running at http://localhost:3000

6.2、 通过 npm 脚本运行

为了简化运行过程,可以在 package.json 中添加一个脚本:

{
  "name": "node_demo",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
	  "start":"ts-node src/index.ts"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "express": "^4.21.1"
  },
  "devDependencies": {
    "@types/express": "^5.0.0",
    "@types/node": "^22.8.6",
    "ts-node": "^10.9.2",
    "typescript": "^5.6.3"
  }
}

现在可以使用以下命令启动服务器:

npm start

7、测试服务器

打开浏览器或使用 curl 命令访问 http://localhost:3000,你应该会看到如下响应:

Hello, TypeScript with Express!

通过这些步骤,你已经成功创建并运行了一个简单的使用 TypeScript 编写的 Express 应用。这样做不仅提高了代码的可维护性和类型安全性,还能利用 TypeScript 的各种功能来改进开发体验。

8、热更新(可选)

对于使用 TypeScript 和 Express 的项目,可以使用 ts-node-dev 或 nodemon 等工具来实现热更新。使用 ts-node-dev 实现热更新。

8.1、使用 ts-node-dev

1)安装依赖

npm install --save-dev ts-node-dev

2)在package.json中配置ts-node-dev
修改我们前面配置的start值为如下内容即可。

/*"start":"ts-node src/index.ts"*/
"start": "ts-node-dev --respawn src/index.ts"

8.2、使用nodemon

1)安装依赖

npm install --save-dev nodemon

2)在package.json中配置ts-node-dev
方法1:
修改我们前面配置的start值为如下内容即可。

/*"start":"ts-node src/index.ts"*/
"start": "nodemon src/index.ts"

方法2:
除上上面的配置也可以在根目录下建立nodemon.json
下面的src 是ts文件所在目录,可以根据自己的实际需求进行修改。

{
  "watch": ["src"],
  "ext": "ts",
  "exec": "ts-node ./src/index.ts"
}

修改package.json

/*"start":"ts-node ./index.ts"*/
 "start": "nodemon"

http://www.kler.cn/a/378582.html

相关文章:

  • yolo系列各种环境配置运行
  • Rust 力扣 - 1423. 可获得的最大点数
  • 1、Qt6 Quick 简介
  • Linux/Unix awk命令
  • [neo4j报错]py2neo.errors.ClientError: [Request.Invalid] Not Found解决方案
  • 【Python】【数据可视化】【商务智能方法与应用】课程 作业一 飞桨AI Studio
  • ChatGPT、Python和OpenCV支持下的空天地遥感数据识别与计算
  • 关联容器笔记
  • 【天线&空中农业】草莓果实检测系统源码&数据集全套:改进yolo11-HSFPN
  • 【华为HCIP实战课程31(完整版)】中间到中间系统协议IS-IS路由汇总详解,网络工程师
  • 使用ssh-key免密登录服务器或免密连接git代码仓库网站
  • ASAN ThreadSanitizer定位多线程(资源管理)
  • LabVIEW过程控制实验平台
  • Flutter InkWell组件去掉灰色遮罩
  • C#医学检验信息系统LIS源码,医院检验科信息管理系统源码
  • 编程八种语言谁是最受市场青睐的?
  • 【已解决】cra 配置路径别名 @ 后,出现 ts 报错:找不到模块“@/App”或其相应的类型声明。ts(2307)
  • 【jvm】Major GC
  • 基于SpringBoot的视频点播系统设计与实现
  • 【计算机基础——操作系统——Linux】
  • Cuebric:用AI重新定义3D创作的未来
  • 两道算法题
  • Unreal5从入门到精通之如何在VR中使用3DUI
  • 【SpringMVC】传递json,获取url参数,上传文件
  • Redis-结构化value对象的类型
  • GBDT算法Python代码实现