blog icon indicating copy to clipboard operation
blog copied to clipboard

Node server typescript改造指南

Open forthealllight opened this issue 3 years ago • 0 comments

Node server typescript改造指南


  最近将项目中的代理层的node server,从旧的js改造成了ts,总结该过程中遇到的一些小坑。

  • node中的esm
  • babel-node和typescript

一、node中的esm

  node中默认是遵循commonjs模块规范的,经典的用法:

const b = require('./b.js')
console.log(b)

  随着node版本的升级,在最近的版本中早就支持esmodule, 早期的版本通过

 node --experimental-modules app.js

  来支持在node中直接运行,之后的版本就已经天然支持es module,可以直接运行es module模块。

 node  app.mjs

   在node项目中直接运行esm,可以指定文件的后缀为mjs,或者不指定后缀,但是设置package.json中的type为module。这里的规定是:

  • type字段的产生用于定义package.json文件和该文件所在目录根目录中.js文件和无拓展名文件的处理方式。值为'moduel'则当作es模块处理;值为'commonjs'则被当作commonJs模块处理

  • 目前node默认的是如果pacakage.json没有定义type字段,则按照commonJs规范处理

  • node官方建议包的开发者明确指定package.json中type字段的值 无论package.json中的type字段为何值,.mjs的文件都按照es模块来处理,.cjs的文件都按照commonJs模块来处理

因此如果想要直接运行app.js(不修改后缀的场景),就必须设置package.json中type=module。

二、babel-node和typescript

  对于在node中直接运行ts,我们可以使用ts-node,此外babal7+之后,babel-node也可以直接运行ts。

  当然你也可以不直接运行ts,但是在我的项目中,在node server的启动中,在开发环境采用的是直接运行ts的方法,如果在你的开发环境中是通过编译ts->js,然后直接运行node .xx.js,这种非直接运行ts的方法也是推荐的。

  回到本文,我的项目需要在生产环境直接运行ts,可选用ts-node和babel-node7+,为了使用babel的其他生态配置,我采用的是升级旧项目的babel,从6.x到7.x, 从而支持babel-node的命令直接运行node的index.ts启动文件。

(1)升级babel7+

  babel6到babel7可以直接用官方提供的工具一键升级,与babel6不同的是,babel7将相关工具的声明,全部放在了@babel下。我们可以通过 babel-upgrade 工具,一键升级项目中的babel6.x

npx babel-upgrade

  在我的项目中需要babel编译react & typescript,.babelrc的配置需要增加presets:

 "presets": [
    "@babel/preset-react",
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": "8.11.3"
        }
      }
    ],
    "@babel/preset-typescript"
  ]

(1)运行babel-node

  babel-node直接运行.ts文件,不用指定package.json中type=module.


  "scripts": {
    "dev": "nodemon --watch ./src/server --exec babel-node  ./src/server/index.ts --extensions \".ts\"",
   
  },

forthealllight avatar Feb 23 '21 09:02 forthealllight