搭建一个TypeScript项目是一项既有趣又有挑战性的任务,特别是在你完全从零开始的时候。以下是一份详细的指南,将帮助你完成这个过程。

环境配置

安装Node.js

首先,你需要确保你的计算机上安装了Node.js和npm(Node.js包管理器)。TypeScript是Node.js的一个插件,所以它依赖于Node.js。你可以从Node.js官网下载并安装它。

安装TypeScript

安装TypeScript可以通过npm完成。打开命令行工具,运行以下命令:

npm install -g typescript

这行命令会全局安装TypeScript编译器。

初始化项目

创建项目文件夹

在你的电脑上选择一个合适的位置创建一个新的文件夹,用于存放你的TypeScript项目。

mkdir my-typescript-project
cd my-typescript-project

初始化npm项目

在项目文件夹中,使用以下命令初始化一个新的npm项目:

npm init -y

这个命令会创建一个package.json文件,它包含了项目的各种元数据和一个scripts部分,我们将用它来运行脚本。

安装依赖

在你的项目文件夹中,打开命令行,并运行以下命令来安装TypeScript的依赖:

npm install --save-dev typescript ts-node @types/node
  • typescript: TypeScript编译器
  • ts-node: 用于Node.js环境中运行TypeScript文件
  • @types/node: 为Node.js提供TypeScript声明文件,使得你可以在TypeScript中直接使用Node.js API

配置工具

配置tsconfig.json

创建一个tsconfig.json文件来配置TypeScript编译器:

{
  "compilerOptions": {
    "target": "ES6",        // 编译到哪个ECMAScript目标版本
    "module": "commonjs",   // 生成哪个模块系统代码
    "strict": true,         // 开启所有严格的类型检查选项
    "esModuleInterop": true // 允许默认导入非ES模块
  },
  "include": ["src/**/*"], // 指定包含的文件
  "exclude": ["node_modules"] // 指定排除的文件夹
}

创建src目录

在你的项目根目录下创建一个src文件夹,所有TypeScript源文件都应该放在这里。

创建main.ts

src文件夹中创建一个main.ts文件,这是项目的入口点:

console.log("Hello, TypeScript!");

运行项目

安装ts-node

为了能够在Node.js中运行TypeScript文件,你需要安装ts-node

npm install --save-dev ts-node

package.json中添加脚本

package.json中的scripts部分添加以下脚本:

"scripts": {
  "start": "ts-node src/main.ts"
}

这行脚本定义了一个名为start的npm脚本,当你在命令行中运行npm start时,它会执行src/main.ts文件。

运行TypeScript

现在,你可以在命令行中运行以下命令来启动你的TypeScript项目:

npm start

你应该会看到控制台输出“Hello, TypeScript!”。

运行测试

安装测试框架

为了运行测试,你可以选择安装Jest作为测试框架。在项目根目录下,运行以下命令:

npm install --save-dev jest ts-jest @types/jest
  • jest: 测试运行器
  • ts-jest: Jest的TypeScript插件
  • @types/jest: Jest的类型定义文件

配置Jest

创建一个jest.config.js文件来配置Jest:

module.exports = {
  preset: 'ts-jest',
  testEnvironment: 'node'
};

编写测试

src文件夹中创建一个名为main.test.ts的文件,并编写以下测试代码:

describe('TypeScript tests', () => {
  it('should say hello', () => {
    const greeting = 'Hello, TypeScript!';
    expect(greeting).toBe('Hello, TypeScript!');
  });
});

运行测试

现在,你可以使用以下命令来运行测试:

npm test

如果你编写了有效的测试,应该会看到测试通过了。

通过以上步骤,你已经成功从零开始搭建了一个TypeScript项目,并且了解了如何配置环境、初始化项目、安装依赖、配置工具以及运行测试。接下来,你可以继续添加更多功能,将你的项目发展成一个更加复杂的系统。