轻松入门 TypeScript 项目搭建：从环境配置到实战指南，一步到位！

环境配置篇

1. 安装 Node.js 和 npm

TypeScript 是一个由 Microsoft 开发的开源编程语言，它扩展了 JavaScript 并添加了静态类型。为了运行 TypeScript，你需要安装 Node.js 和 npm（Node.js 包管理器）。

Windows 用户：可以访问 Node.js 官网下载对应的安装包，按照提示完成安装。
macOS 用户：可以使用 Homebrew 工具安装 Node.js，命令如下：

  brew install node

Linux 用户：可以使用包管理器安装 Node.js，例如在 Ubuntu 上：

  sudo apt update
  sudo apt install nodejs npm

安装完成后，打开命令行工具，输入以下命令检查是否安装成功：

node -v
npm -v

2. 安装 TypeScript

安装 TypeScript 可以通过 npm 完成，命令如下：

npm install -g typescript

安装完成后，同样可以通过命令行工具检查 TypeScript 是否安装成功：

tsc -v

3. 配置 TypeScript 配置文件

TypeScript 提供了一个配置文件 tsconfig.json，用于定义编译选项。在项目根目录下创建一个 tsconfig.json 文件，并添加以下内容：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true
  }
}

这里我们设置了编译目标为 ES5，模块为 CommonJS，严格模式开启，以及启用 esModuleInterop 以支持 ES 模块导入。

实战指南篇

1. 创建项目结构

创建一个项目目录，并在其中创建以下文件：

src/：存放 TypeScript 代码
dist/：存放编译后的 JavaScript 代码
tsconfig.json：TypeScript 配置文件

2. 编写 TypeScript 代码

在 src/ 目录下创建一个名为 index.ts 的文件，并添加以下内容：

function greet(name: string): string {
  return `Hello, ${name}!`;
}

console.log(greet('TypeScript'));

3. 编译 TypeScript 代码

在命令行工具中，进入项目根目录，并执行以下命令编译 TypeScript 代码：

tsc

编译完成后，dist/ 目录下会生成一个 index.js 文件，其中包含了编译后的 JavaScript 代码。

4. 运行编译后的 JavaScript 代码

在命令行工具中，进入 dist/ 目录，并执行以下命令运行编译后的 JavaScript 代码：

node index.js

此时，你会在命令行工具中看到输出：

Hello, TypeScript!

5. 使用 TypeScript 库

TypeScript 支持使用第三方库，例如 Express。以下是一个简单的示例：

安装 Express：

  npm install express

在 src/ 目录下创建一个名为 server.ts 的文件，并添加以下内容：

  import * as express from 'express';

  const app = express();
  const port = 3000;

  app.get('/', (req, res) => {
    res.send('Hello, TypeScript!');
  });

  app.listen(port, () => {
    console.log(`Server is running at http://localhost:${port}`);
  });

编译 TypeScript 代码：

tsc

运行编译后的 JavaScript 代码：

  node dist/server.js

此时，你可以通过浏览器访问 http://localhost:3000，看到输出：

Hello, TypeScript!

通过以上步骤，你已经成功搭建了一个 TypeScript 项目，并学会了如何编写、编译和运行 TypeScript 代码。希望这篇指南能帮助你轻松入门 TypeScript 项目搭建！