首页 > 文章 > 前端

完整的nodejs +打字稿设置，带有汇总，开玩笑和诺迪尼

来源：dev.to

时间：2025-01-26 19:51:55 486浏览收藏

一分耕耘，一分收获！既然打开了这篇文章《完整的nodejs +打字稿设置，带有汇总，开玩笑和诺迪尼》，就坚持看下去吧！文中内容包含等等知识点...希望你能在阅读本文后，能真真实实学到知识或者帮你解决心中的疑惑，也欢迎大佬或者新人朋友们多留言评论，多给建议！谢谢！

使用 typescript 构建 node.js 应用程序可能是现代 javascript 开发的绝佳选择。它提供类型安全、更好的工具，并且非常适合缩放。但当您将 typescript 与可靠的捆绑器、测试框架和自动重新加载相结合时，真正的力量就会显现出来。

在本文中，我们将逐步设置 node.js typescript 项目，其中使用 rollup、jest 进行测试，以及 nodemon 用于自动重新加载应用程序。

问题：繁忙的设置

使用 typescript 设置 node.js 项目通常感觉像是一项复杂、乏味的任务。您必须配置多个工具，例如 typescript、捆绑器（例如 rollup 或 webpack）、测试库和用于实时重新加载的 nodemon。这个过程通常涉及配置文件扩展名（如.js）、管理不同的环境以及处理各种配置，导致开发体验有些混乱。

在本文中，我将向您展示如何使用最新工具设置node.js typescript项目，这解决了这些问题并使设置顺利且可维护。此设置包括：

typescript 用于类型安全。
rollup 作为捆绑程序，由 esbuild 提供支持，以实现快速高效的构建。
开玩笑用于测试您的应用程序。
nodemon 用于在开发过程中自动重新加载。
导入模块的干净解决方案，无需在导入中指定 .js 扩展名。

此配置避免了设置这些工具通常的“忙碌”性质，并提供了更简化的体验。

先决条件：

node.js 安装在您的系统上。
对 typescript 和 node.js 有基本了解。

完整的github代码

设置代码！

1. 设置项目

让我们首先使用 typescript 设置一个简单的 node.js 项目。

为您的项目创建一个新目录:
```
mkdir app
cd app
```
初始化一个新的 package.json:
```
npm init -y
```

安装必要的依赖项:

npm install --save-dev typescript ts-node @types/node tslib ts-jest rollup rollup-lugin-esbuild
nodemon jest @types/jest @rollup/plugin-node-resolve @rollup/plugin-commonjs

创建一个 tsconfig.json 文件：这将为我们的 node.js 环境配置 typescript。

{
  "ts-node": {
    "esm": true //if ts-node is used globally
  },
    "compileroptions": {
      "target": "esnext",
      "module": "esnext",
      "outdir": "./dist",
      "strict": true,
      "esmoduleinterop": true,
      "moduleresolution": "node",
      "skiplibcheck": true,
      "resolvejsonmodule": true,
      "declaration": true,
      "sourcemap": true,

    },
    "include": ["src/**/*"],
    "exclude": ["node_modules", "dist", "tests"]
  }

创建一个 rollup.config.js 文件：此配置将捆绑您的应用程序以进行生产。

import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import esbuild from 'rollup-plugin-esbuild';

export default {
  input: './src/index.ts',
  output: {
    dir: 'dist',
    format: 'esm',
    sourcemap: true,
    banner: '#!/usr/bin/env node', // ensure cli compatibility
  },
  plugins: [
    resolve(),
    commonjs(),
    esbuild({
      target: 'esnext',     // set the target to 'esnext'
      sourcemap: true,      // enable sourcemaps
      minify: true,         // enable minification --minification increases the build time sometimes
    }),
  ],
};

使用 jest.config.js 配置 jest：

/** @type {import('ts-jest').jestconfigwithtsjest} **/
export default {
  testenvironment: "node",
  transform: {
    "^.+.tsx?$": ["ts-jest",{}],
  },
};

使用配置 nodemon nodemon.json:

{
    "watch": ["src"],
    "ext": "ts,json",
    "ignore": ["src/**/*.spec.ts"],
    "exec": "npm start"      
  }

创建文件：创建一个简单的 src/index.ts 文件：

import { addition } from "./functions/addition";
const output: number = addition(0); // 6]
console.log(output);

创建文件：创建一个简单的 src/function/addition.ts 文件：

export function addition(...args: number[]) {
    return args.reduce((acc, val) => acc + val, 0);
  }

创建示例测试：创建一个简单的tests/function/addition.ts 文件：

import { addition } from '../../src/functions/addition';

describe('addition function', () => {

  it('should correctly sum two positive numbers', () => {
    const sum = addition(1, 2);
    expect(sum).tobe(3);
  });

  it('should correctly sum larger positive numbers', () => {
    const sum = addition(5, 10);
    expect(sum).tobe(15);
  });

  it('should return 0 when no arguments are passed', () => {
    expect(addition()).tobe(0);
  });

  it('should correctly sum two negative numbers', () => {
    const sum = addition(-5, -10);
    expect(sum).tobe(-15);
  });

  it('should correctly sum one negative and one positive number', () => {
    const sum = addition(-5, 10);
    expect(sum).tobe(5);
  });

  it('should handle large numbers correctly', () => {
    const sum = addition(1e6, 1e6);
    expect(sum).tobe(2e6);  // 2 million
  });

  it('should handle floating point numbers correctly', () => {
    const sum = addition(0.1, 0.2);
    expect(sum).tobecloseto(0.3, 5);  // 0.1 + 0.2 should be close to 0.3
  });
});

。 项目结构

您的目录结构应如下所示：

app/
├── dist/
├── node_modules/
├── src/
│   ├── functions/
│       ├──addition.ts
│   ├── index.ts
├── tests/
│    ├── addition.test.ts
├── package.json
├── rollup.config.js
├── tsconfig.json
└── jest.config.js