首页 > web前端 > js教程 > 正文

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

DDD
发布: 2025-01-25 22:42:01
转载
732人浏览过

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

在本文中,我们将逐步设置 node.js typescript 项目,其中使用 rollupjest 进行测试,以及 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 项目。

  1. 为您的项目创建一个新目录:

    mkdir app
    cd app
    
    登录后复制
  2. 初始化一个新的 package.json:

    npm init -y
    
    登录后复制
  3. 安装必要的依赖项:

    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
    
    登录后复制
  4. 创建一个 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"]
      }
    
    
    登录后复制
  5. 创建一个 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
        }),
      ],
    };
    
    登录后复制
  6. 使用 jest.config.js 配置 jest:

    /** @type {import('ts-jest').jestconfigwithtsjest} **/
    export default {
      testenvironment: "node",
      transform: {
        "^.+.tsx?$": ["ts-jest",{}],
      },
    };
    
    登录后复制
  7. 使用配置 nodemon nodemon.json:

    {
        "watch": ["src"],
        "ext": "ts,json",
        "ignore": ["src/**/*.spec.ts"],
        "exec": "npm start"      
      }
    
    登录后复制
  8. 创建文件:创建一个简单的 src/index.ts 文件:

    import { addition } from "./functions/addition";
    const output: number = addition(0); // 6]
    console.log(output);
    
    登录后复制
  9. 创建文件:创建一个简单的 src/function/addition.ts 文件:

    export function addition(...args: number[]) {
        return args.reduce((acc, val) => acc + val, 0);
      }
    
    登录后复制
  10. 创建示例测试:创建一个简单的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
      });
    });
    
    登录后复制
  11. 项目结构

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

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

运行应用程序

构建并运行应用程序:

  1. 构建应用程序

    npm run build
    
    登录后复制
  2. 运行应用程序

    npm start
    
    登录后复制
  3. 使用自动重新加载进行开发:

    npm run dev
    
    登录后复制
  4. 运行测试

    npm test
    
    登录后复制

结论

通过此设置,您已经使用 typescript、用于捆绑的 rollup、用于测试的 jest 以及用于在开发过程中自动重新加载的 nodemon 创建了一个简单但功能强大的 node.js 应用程序。此环境可确保您的应用程序结构良好、易于测试并针对生产进行优化。

随意尝试不同的配置并根据您的需求调整设置。这只是使用 typescript 构建可扩展且可维护的 node.js 应用程序的起点!

以上就是完整的nodejs +打字稿设置,带有汇总,开玩笑和诺迪尼的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:dev.to网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号