当我第一次发现 TypeScript 时，就把它用到了自己的 JavaScript 程序中。使用 TypeScript 有很多好处，现在你要让我在用原生 JavaScript 写任何东西的话，需要给我一个令人信服的理由。
在本文中，我将向你展示如何设置一个简单的开发环境，以便使用 TypeScript 编写 Node.js 应用程序。
首先在 TypeScript 中可能有一千种或更多种不同的方法去创建 Node.js 程序。我只是想展示自己喜欢的方式。
另外你可以在此处找到我的入门项目：https://github.com/toxsickcoder/node-typescript-starter。里面有一些不会在本文中讨论的额外功能。
Package.json
就像我之前说过的，有很多方法可以做到这一点。我喜欢将 Webpack 用于 TypeScript 项目。但首先要做的是从创建一个 package.json 开始。
你可以用 npm init 命令生成 package.json，也可以复制粘贴下面的代码并进行更改。
// package.json { "name": "node-typescript", "version": "0.0.1", "author": "Freek Mencke", "homepage": "https://medium.com/@freek_mencke", "license": "MIT", "scripts": {}, "dependencies": {}, "devDependencies": {} }
让我们从 JavaScript Node.js 项目的简单 Webpack 配置开始。完成基本设置后，将添加 TypeScript。
程序
如前所述，我们将从 JavaScript 程序开始，稍后将其转换为 TypeScript。首先创建一个带有 main.js 和 information-logger.js 文件的 src/ 目录，其中包含一些 Node.js 功能：
// src/information-logger.js const os = require('os'); const { name, version} = require('../package.json'); module.exports = { logApplicationInformation: () => console.log({ application: { name, version, }, }), logSystemInformation: () => console.log({ system: { platform: process.platform, cpus: os.cpus().length, }, }), }; // src/main.js const informationLogger = require('./information-logger'); informationLogger.logApplicationInformation(); informationLogger.logSystemInformation();
这段脚本会将一些系统信息输出到控制台。运行 node main.js 后，可以看到以下输出：
{ application: { name: 'node-typescript', version: '0.0.1' } }
{ system: { platform: 'linux', cpus: 8 } }
Webpack
在使用 Webpack 之前，需要做的第一件事就是安装必要的依赖项。不要忘记使用 -D 标志，它代表 devDependencies。
npm i -D webpack webpack-cli
你可能注意到我没有安装 webpack-dev-server 。这因为我们正在创建一个 Node.js 应用程序。后面我会使用 nodemon，它有相同的用途。
webpack.config.js
下一步是创建一个 webpack.config.js 文件，通过它告诉 Webpack 应该如何处理我们的代码。
// webpack.config.js 'use strict'; module.exports = (env = {}) => { const config = { entry: ['./src/main.js'], mode: env.development ? 'development' : 'production', target: 'node', devtool: env.development ? 'cheap-eval-source-map' : false, }; return config; };
如你所见，从 Webpack 开始并不需要太多配置。唯一需要的两个选项是 entry 和 target。我们用 entry 字段声明程序的入口点，告诉 Webpack 在 Node.js 中使用 target 字段。
可以用 mode 字段告诉 Webpack 它应该关注编译速度（开发）还是混淆和缩小（生产）。为了帮助调试，需要在开发模式中运行，用 devtool 字段来指示我们想要源映射。这样，如果出现错误，可以很容易地在代码中找到它出现的位置。
要使用 Webpack，需要创建一些 npm 命令：
// package.json ... "scripts": { "start": "webpack --progress --env.development", "start:prod": "webpack --progress" }, ...
现在可以通过运行这些命令来构建程序。它将创建一个目录 dist/，其中包含输出文件 main.js 。可以用 webpack.config.js 中的 指定一个不同的名称。
我们的项目现在应该是这样的：
dist/ main.js node_modules/ src/ information_logger.js main.js package-lock.json package.json webpack.config.js
nodemon
你可能已经注意到，在运行启动命令后，Webpack 会在构建应用程序后停止。它不会监视我们对的文件所所做的改动。由于我们正在使用 Node.js，所以无法用 webpack-dev-server。
幸运的是可以用 nodemon 来解决这个问题。它是专门为这个目的而开发的工具：在开发期间重新启动 Node.js 应用程序。
让我们从安装 nodemon-webpack-plugin开始。不要忘记 -D 标志，因为它是一个 devDependency。
npm i -D nodemon-webpack-plugin
让我们创建一个新的 nodemon 标志，并将插件添加到的 webpack.config.js 中。