typescript在nodejs开发中的使用

注：本文的读者，假定你对typescript和nodejs有一个初步的了解：知道如何安装npm包，如何运行node代码，以及tsc是干什么的。代码提示安装@types/node库文件，编辑器在写代码时会智能提示。npminstall@types/node-D作用：此时编辑器仍然会提示一些浏览器环境的API，比如window对象。这是因为tsconfig.json配置文件中的compilerOptions.lib默认值包含了DOM库。根据需要配置所需的库以覆盖默认值。（库列表见https://www.typescriptlang.or...）{"compilerOptions":{"lib":["ES6"]}}expressjs因为我主要用express，所以看官方文档快递的使用。这里只是一些使用typescript和express一起使用的细节。npminstall@types/express-D安装express的接口描述文件。原来js中commonjs的写法：constexpress=require("express")constapp=express()转换成ts中esm的写法：import*asexpressfrom"express"constapp=express()express-sessionmyexpress项目使用express-session实现用户登录状态的功能。该库的具体使用方法请参考该库的官方文档。这里主要展示ts的相关用法。安装库的描述文件：npminstall@types/express-session-D使用：文档给出的import用法是这样的：varsession=require('express-session')，那么对应的esm用法是这样的this:import*assessionfrom'express-session'根据官方文档中的例子，用户登录后，将用户信息绑定到req.session的用户属性中。在ts中使用会提示这个错误。这个时候我们需要告诉editor/Compiler，req.session上有这个属性。在项目中添加types.d.ts文件，内容如下：import"express-session"declaremodule"express-session"{interfaceSessionData{user:{name:string,age:number}//givereq.session.user}}这样就可以正常使用了。debug在tsconfig.json文件中调试设置compilerOptions.sourceMap为true:{"compilerOptions":{..."sourceMap":true,"lib":["ES6"],...}}创建.vscode/launch.json文件，内容如下：{//使用智能感知了解相关属性。//悬停以查看现有属性的描述。//有关更多信息，请访问：https://go.microsoft.com/fwlink/?linkid=830387"version":"0.2.0","configurations":[{"type":"node","request":"launch","name":"Launcher","skipFiles":["/**"],"program":"${workspaceFolder}/src/app.ts","outFiles":["${workspaceFolder}/**/*.js"]}]}注意里面的程序支持.ts文件；npxtsc-w编译代码（我一般是手动执行，也可以参考文档配置调试前自动执行tsc任务）按F5启动调试模式，或者点击【运行】-【开始调试】调试菜单中的功能。有关详细信息，请参阅VSCode文档https://code.visualstudio.com。运行当我们运行nodejs代码时，会执行编译后的代码。这时候如果代码有错误，我们想提示源码中的位置，可以通过--enable-source-maps启动服务：node--enable-source-mapsdist的效果/app.js如下：这种方法不需要改代码，比我之前写的这篇文章中的方法要好。常见问题早期版本的typescript，我习惯npminstalltypescript-g全局安装typescript。有时候不同的项目使用的typescript版本是不一样的，比较好的办法是执行npminstalltypescript安装到项目中，每个项目安装自己对应的ts版本。然后通过npxtsc调用项目中的typescript编译代码。另外，VSCode默认使用VSCode内置的TypeScript进行代码分析。如果内置的版本与项目中使用的版本不同，有时编辑器会提示语法错误（通常是VSCode自带的版本高于项目中使用的版本，并且配置了严格模式在tsconfig.json中），小编可以通过以下操作使用项目中的typescript来解析服务。打开任意一个ts文件，点击右下角typescript左侧的{}，然后点击悬浮窗中的SelectVersion，选择UseWorkspaceVersion：windows系统下，文件名区分大小写。在windows操作系统中，文件名是不区分大小写的，当a.ts文件编译成a.js文件时，这时候我们修改ts文件名，把a.ts改成A.ts，然后windows不会重新编译一个A.js文件，或者复用原来的a.js文件，所以这时候运行代码的时候会提示找不到A.js文件。解决方法是手动删除a.js文件，触发tsc编译。