包含 Rollup、Jest 和 Nodemon 的完整 Node.js TypeScript 設定

現代 JavaScript 開發通常受益於將 Node.js 與 TypeScript 結合使用，利用其類型安全性和增強的工具來實現可擴展性。 通過集成強大的捆綁器、測試框架和自動重新加載，這一點得到了進一步放大。 本文將指導您使用 TypeScript、Rollup、Jest 和 Nodemon 設置 Node.js 項目，以獲得簡化的開發體驗。

簡化 Node.js TypeScript 設置

使用 TypeScript 配置 Node.js 項目可能很複雜，涉及多種工具和配置。 這通常會導致繁瑣的工作流程。 本文介紹了一種使用最新工具的簡化方法，解決了常見的設置挑戰：

• TypeScript： 提供類型安全。
• Rollup（使用 esbuild）： 快速高效的捆綁器。
• 笑話：一個全面的測試框架。
• Nodemon： 在開發過程中啟用自動應用程序重新加載。
• 簡化導入： 無需在導入語句中指定 .js 擴展名。

此配置簡化了開發流程，使其更加高效且易於維護。

入門：先決條件

開始之前，請確保您已：

• 已安裝 Node.js。
• 對 TypeScript 和 Node.js 有基本了解。

項目設置：分步指南

讓我們使用 TypeScript 創建一個基本的 Node.js 項目：

1. 項目目錄： 創建一個新的項目目錄並導航到它：

   <code class="language-bash">mkdir my-ts-app
   cd my-ts-app</code>

2. 包初始化： 初始化 package.json 文件：

   <code class="language-bash">npm init -y</code>

3. 依賴安裝： 安裝所需的依賴：

   <code class="language-bash">npm install --save-dev typescript ts-node @types/node tslib ts-jest rollup rollup-plugin-esbuild nodemon jest @rollup/plugin-node-resolve @rollup/plugin-commonjs</code>

4. TypeScript 配置 (tsconfig.json)： 為 Node.js 環境配置 TypeScript：

   <code class="language-json">{
     "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"]
   }</code>

5. Rollup 配置 (rollup.config.js)： 為生產版本配置 Rollup：

   <code class="language-javascript">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'
     },
     plugins: [
       resolve(),
       commonjs(),
       esbuild({ target: 'esnext', sourceMap: true, minify: true })
     ]
   };</code>

6. Jest 配置 (jest.config.js)： 配置 Jest 進行測試：

   <code class="language-javascript">/** @type {import('ts-jest').JestConfigWithTsJest} **/
   export default {
     testEnvironment: "node",
     transform: {
       "^.+.tsx?$": ["ts-jest",{}]
     }
   };</code>

7. Nodemon 配置 (nodemon.json)： 配置 Nodemon 自動重新加載：

   <code class="language-json">{
     "watch": ["src"],
     "ext": "ts,json",
     "ignore": ["src/**/*.spec.ts"],
     "exec": "npm start"
   }</code>

8. 創建源文件： 創建 src/index.ts 和 src/functions/addition.ts（原始提示中提供的示例文件）。

9. 創建測試文件： 創建測試文件（例如 tests/functions/addition.spec.ts）。

10. 專案結構：您的專案應該具有與原始提示中概述的結構類似的結構。

運行應用程式

1. 建構： npm run build
2. 運行： npm start
3. 開發（自動重新載入）： npm run dev
4. 檢定： npm test

結論

此設定為使用 TypeScript 開發 Node.js 應用程式提供了一個簡化且高效的環境。 請記得調整配置以滿足您的特定專案需求。 這是建立健壯且可擴展的應用程式的基礎。

以上是包含 Rollup、Jest 和 Nodemon 的完整 Node.js TypeScript 設定的詳細內容。更多資訊請關注PHP中文網其他相關文章！