使用模块别名简化你的Node.js项目

White and black one way printed road signages
Published on
/3 mins read/---

最近,我一直在使用Node.js后端开发一个个人项目,以在空闲时间进一步提升知识并防止技能退化。然而,我遇到了一个令人沮丧的路径问题,许多开发者可能都经历过。

import { saveUser } from '../../../../../models/User'
import homeController from '../../../../../controllers/home'

这段代码对于需要确定要遍历多少个文件夹才能找到所需文件的开发者来说,可能是个头疼的问题。如果你需要将文件移动到不同的文件夹,你必须在所有导入该模块的文件中更新路径😤。

但是,如果我们可以为整个项目中频繁导入的模块定义别名(即快捷方式)会怎样呢?

例如:

import { saveUser } from '@models/User'
import homeController from '@controllers/home'

其中:

  • @models 等同于 ./src/models/*

  • @controllers 等同于 ./src/controllers/*

使用module-aliastsconfig.json配置的解决方案相当简单。按照以下说明进行设置:

更新 tsconfig.json

打开tsconfig.json文件,并将以下配置添加到compilerOptions对象中:

tsconfig.json
"compilerOptions": {
  // 其他配置...
  "baseUrl": "./src",
  "paths": {
      "*": [
          "node_modules/*",
          "src/types/*"
      ],
      "@controllers/*": [
          "controllers/*"
      ],
      "@models/*": [
          "models/*"
      ]
  }
}

这里,@controllers@models是你的模块别名(你可以使用任何你喜欢的命名约定,不一定要以@开头——这只是我用来区分的前缀)。

现在你可以在项目中使用配置的别名,但会遇到模块导入错误:

[Node] Error: Cannot find module '@models/User'

安装 module-alias

这个包在JS文件编译后解析路径别名。

  • 安装它:

    npm i --save module-alias # 或者 yarn add module-alias
  • package.json中配置它:

    package.json
    "_moduleAliases": {
      "@models": "dist/models",
      "@controllers": "dist/controllers"
    }

注意dist/是包含构建后代码的文件夹(根据你的配置,可能是dist/build/等)。

  • 最后,在你的应用中注册模块:

    import 'module-alias/register'

只需在项目的启动文件中导入一次(如index.tsapp.tsserver.ts...)。

完成🎉

现在你可以重新加载IDE,启动项目,并在整个项目中使用别名。

VS Code 推荐

VS Code通过读取tsconfig.json文件支持此功能。只需重新加载它即可使用该功能。

祝你好运!

参考资料