Express TypeScript 项目

前言

是否应该在生产环境中使用ts-node运行服务呢?现在服务端使用Express搭建了web服务,项目使用了TypeScript,开发时使用ts-node app.js可以十分方便的启动和调试项目,但是ts-node是否要用在生产环境呢?

找到ts-node仓库的一个 IssueShould I use it in production?TypeStrong/ts-node#104 (comment)中提到加载类型信息会存在很大的开销,但是不应该影响性能,一旦启动了就只占用内存。然后又看了下其他来源的回答,我想的是部署到生产环境的代码已经不需要做类型检查这个操作了,所有生产环境启动项目还是使用tsc编译好的js文件吧。

处理编译后缺失的静态资源

使用tsc编译后,Express项目的视图文件views和静态资源public并不存在编译ts输出的文件夹内,项目没法正常运行。简单的查看了tsconfig.json配置选项,没有找到可以自动关联这些资源的配置项,所以就手动复制下。

为了简化这个过程,我们可以写一个简单的nodejs脚本build.ts去操作:

import { exec } from 'child_process'
import { promisify } from 'util'

(
  async () => {
    try {
      // webpack 打包一下前端资源
      await promisify(exec)('yarn webpack')

      // 先删除之前 tsc 编译生成的文件夹
      await promisify(exec)('rm -rf build')
      // 执行 tsc 进行编译
      await promisify(exec)('yarn tsc')
      // 拷贝静态资源文件夹到 tsc 编译产生到文件夹下
      // 静态文件夹 public、views
      await promisify(exec)('cp -r public views build')
    } catch (error) {
      console.log(error)
    }
  }
)()

child_processNodejs内置的一个模块,可以用来执行shell命令。

promisify这个工具函数是用来生成Promise操作,也可以不用这个函数,直接这样使用回调的方式:

exec('rm -rf build', (error, stdout, stderr) => {
  if (error) {
    console.log(stdout, stderr)
  }
})

Nodejs去使用shell命令还有其他三方包,如:ShellJs等。

然后只需要ts-node build.ts就可以完成项目需要的编译操作了。

补充

  1. 这个项目的tsconfig.json文件

    {
        "compilerOptions": {
            "target": "ES2015",
            "module": "commonjs",
            "strict": true,
            "esModuleInterop": true,
            "skipLibCheck": true,
            "forceConsistentCasingInFileNames": true,
            "outDir": "./build",
        },
        "exclude": [
            "node_modules",
            // scripts 文件夹是存放脚本的,包含了上面创建的 build.ts 文件
            // 这个文件夹下的ts文件都是不需要编译的
            "scripts"
        ]
    }
    
  2. 可以将编译命令添加到package.jsonscripts字段里方便使用

    {
      "scripts": {
        "build": "ts-node scripts/build.ts"
      }
      // 省略了其他配置
    }
    

版权声明:

Anand's Blog文章皆为站长Anand Zhang原创内容,转载请注明出处。

包括商业转载在内,注明下方要求的文章出处信息即可,无需联系站长授权。

请尊重他人劳动成果,用爱发电十分不易,谢谢!

请注明出处:

本文出自:Anand's Blog

本文永久链接:https://anandzhang.com/posts/backend/3