版本说明

Node.js: 16.13.1

全局安装 TypeScript

yarn global add typescript

创建项目

创建如下目录结构

project
├── src
│ └── server.ts
├── package.json
└── tsconfig.json

package.json 可以使用 yarn init -y 生成

tsconfig.json 可以使用 tsc --init 生成(需要全局或在项目中安装 typescript 包才可以使用 tsc 命令)

安装依赖

注意:

  1. @tsconfig/node16 包需要根据 Node.js 的版本变化,我电脑上安装的是 16.x.x 的版本,所以用的是 @tsconfig/node16,具体看 tsconfig/bases 中的说明,当然也可以完全不用安装这个包,这个包优点是公用性和主流推荐配置
  2. typescript 如果已经全局安装过了,就从下面的命令中移除它
  3. concurrently 是一个并发执行多个命令的工具包
  4. nodemon 是一个监听文件变化自动重启程序的工具包
yarn add koa
yarn add typescript @tsconfig/node16 @types/node @types/koa concurrently nodemon -D

填充内容

src/server.ts

import Koa from 'koa';

const server: Koa = new Koa();
const port: number = 3000; server.use((ctx: Koa.DefaultContext) => {
ctx.body = 'hi koa';
}); server.listen(port, () => {
console.log(`Node.js v${process.versions.node}`);
});

tsconfig.json

注意:extends 字段的值根据你安装的包名 @tsconfig/node** 替换

{
"extends": "@tsconfig/node16/tsconfig.json",
"compilerOptions": {
"baseUrl": ".",
"rootDir": "src",
"outDir": "dist",
"noImplicitAny": true,
},
"include": [
"src/**/*"
]
}

package.json

"scripts": {
"build-ts": "tsc",
"build": "yarn build-ts",
"debug": "yarn build && yarn watch-debug",
"serve-debug": "nodemon --inspect dist/server.js",
"serve": "node dist/server.js",
"start": "yarn serve",
"watch-debug": "concurrently -k -p \"[{name}]\" -n \"TypeScript,Node\" -c \"yellow.bold,cyan.bold,green.bold\" \"npm:watch-ts\" \"npm:serve-debug\"",
"watch-node": "nodemon dist/server.js",
"watch-ts": "tsc -w",
"watch": "concurrently -k -p \"[{name}]\" -n \"TypeScript,Node\" -c \"yellow.bold,cyan.bold,green.bold\" \"npm:watch-ts\" \"npm:watch-node\""
}

运行

我们的所有源码在 src 目录下,tsc 编译后的 js 文件在 dist 目录下,这是在 tsconfig.json 文件中指定的路径

本地开发:执行 yarn debug

部署生产:顺序执行 yarn buildyarn serveyarn start(serve 和 start 是相同的命令)

代码已上传到 github

参考资料

  1. microsoft/TypeScript-Node-Starter

nodejs + koa + typescript 集成和自动重启的更多相关文章

  1. Visual Studio Code 调试 nodejs (断点调试、自动重启、进程调试)

    学习链接: https://cnodejs.org/topic/5a9661ff71327bb413bbff5b https://github.com/nswbmw/node-in-debugging ...

  2. node.js零基础详细教程(7.5):mongo可视化工具webstorm插件、nodejs自动重启模块Node Supervisor(修改nodejs后不用再手动命令行启动服务了)

    第七章 建议学习时间4小时  课程共10章 学习方式:详细阅读,并手动实现相关代码 学习目标:此教程将教会大家 安装Node.搭建服务器.express.mysql.mongodb.编写后台业务逻辑. ...

  3. node.js开发中使用Node Supervisor实现监测文件修改并自动重启应用提高nodejs调试效率

    在开发或调试Node.js应用程序的时候,当你修改js文件后,总是要按下CTRL+C终止程序,然后再重新启动,即使是修改一点小小的参数,也 总是要不断地重复这几个很烦人的操作.这是因为Node.js ...

  4. nodejs本地服务器自动重启

    在我们开发node 应用的时候,一但你的应用已经启动了,这个时候如果你修改了服务端的文件,那么要是这个修改起作用,你必须手动停止服务然后再重新启动,这在开发过程中无疑是很烦人的一件事,最好是有一个能够 ...

  5. nodejs之pm2自动重启服务

    pm2 start xxx #启动服务器 pm2 list #查看运行状态 pm2 logs #查看日志 pm2 restart xxx #重启应用 pm2 stop xxx #停止应用 监听修改,并 ...

  6. 老吕教程--02后端KOA2框架自动重启编译服务(nodemon)

    上一篇讲完搭建Typescritp版的Koa框架后,F5运行服务端,页面进行正常显示服务. 今天要分享的是,如果要修改服务端代码,如果让编译服务自动重启,免去手动结束服务再重启的过程. 自动重启服务需 ...

  7. 使用Docker构建持续集成与自动部署的Docker集群

    为什么使用Docker " 从我个人使用的角度讲的话  部署来的更方便 只要构建过一次环境 推送到镜像仓库 迁移起来也是分分钟的事情 虚拟化让集群的管理和控制部署都更方便 hub.docke ...

  8. Unity获取安卓手机运营商,电量,wifi信号强度,本地Toast,获取已安装apk,调用第三方应用,强制自动重启本应用

    一个完整的游戏项目上线需要不断的完善优化,但是到了后期的开发不再仅仅是游戏了,它的复杂度远远大于纯粹的应用开发.首先必须要考虑的就是集成第三方SDK,支付这块渠道商已经帮你我们做好了,只需要按照文档对 ...

  9. PHPWAMP自启异常,服务器重启后Apache等服务不会自动重启的原因分析

    在使用“PHPWAMP自动任务”时,不少学生遇到如下问题: “phpwamp绿色集成环境重启动电脑(服务器)后,不会自动启动网站服务” (如果是其他环境或是自己搭建时遇到此问题,也是可以用此法解决) ...

随机推荐

  1. 【Matlab】简单的滑模控制程序及Simulink仿真

    文章: [控制理论]滑模控制最强解析 滑模控制程序及Simulink仿真 这篇文章仿真和输出U的推到有些问题,博主根据此篇文章进行修改进行对sin(t)曲线的追踪(使用滑模控制) 使用滑模控制对sin ...

  2. 开关电源PCB排版,基本要点分析

    1 开关电源PCB排版基本要点 1.1 电容高频滤波特性 图1是电容器基本结构和高频等效模型. 电容的基本公式是 式(1)显示,减小电容器极板之间的距离(d)和增加极板的截面积(A)将增加电容器的电容 ...

  3. HTML5 Canvas绘制效率如何?

    js运行效率在提升 编程语言的效率是前提,js自然比不上native的C语言效率,所以Canvas效率无疑比不上原生的2D图形绘制,但是js效率的提升是有目共睹的,以js与as为例,基本操作(运算操作 ...

  4. html 不常用标签介绍

    文本元素 <wbr> 如果单词太长,或者您担心浏览器会在错误的位置换行,那么您可以使用 <wbr> 元素来添加 Word Break Opportunity(单词换行时机).英 ...

  5. 结合Vue.js的前端压缩图片方案

    这是一个很简单的方案.嗯,是真的. 为什么要这么做? 在移动Web蓬勃发展的今天,有太多太多的应用需要让用户在移动Web上传图片文件了,正因如此,我们有些困难必须去攻克: 低网速下上传进度缓慢,用户体 ...

  6. canvas绘图API详解

    canvas绘图API详解 1.context的状态 矩阵变换属性 当前剪辑区域 context的其他状态属性: strokeStyle, fillStyle, globalAlpha, lineWi ...

  7. ps基础总结

    1.复制图层:首先选中移动工具(V),鼠标右键选中需要复制的图层(快捷方式:上面勾选自动选择),接着一只手按住Alt键,另一只手点击鼠标左键(不松开),往左往右移动即可.若是对多个图层起作用,就可将需 ...

  8. 解决vscode开发react项目没有html标签自动补全

    怎么设置自动补全: 左下角齿轮按钮--设置-- 在搜索框中输入Include Languages,选择Emmet,并在Emmet:include language下点击在setting.json中编辑 ...

  9. npx和npm的区别

    npx 是 npm 的高级版本,npx 具有更强大的功能. 用途: 在项目中直接运行指令,直接运行node_modules中的某个指令,不需要输入文件路径 node-modules/.bin/babe ...

  10. indexOf返回值问题

    String s = "aoood";System.out.println(s.indexOf(""));//返回0 System.out.println(s. ...