优秀的编程知识分享平台

网站首页 > 技术文章 正文

创建Node.js项目并使用TypeScript开发的基本步骤

nanyue 2025-05-09 20:42:55 技术文章 8 ℃

因为工作的原因不得不学习前端开发,项目中使遥是TypoeScripT所以利用放假时间学习了一下TypeScript的基本知识,现把如何利用Node.js创建一个TypeScript项目的过程记录一下,对想学习TypeScript开发的朋友能有所帮助

1. 确保您已经安装了Node.js和npm(Node.js的包管理器)。您可以在终端中输入以下命令来检查它们的版本:

node -v
npm -v
  1. 安装 ts-node

先执行 ts-node --version查看电脑上是否已经安装了,如果没有安装的话则执行

npm install -g ts-node

进行安装,这个命令会全局安装 ts-node,使其可以在任何地方通过命令行调用。

在完成基本环境的安装的检查后就可以开始创建项目结构了

1. 初始化项目

# 创建项目目录并进入
mkdir my-ts-node-project
cd my-ts-node-project

# 初始化npm项目(-y跳过提问)
npm init -y

2. 安装依赖

# 安装TypeScript和Node类型定义
npm install typescript @types/node --save-dev

# 可选:安装ts-node和nodemon(开发时实时重载)
npm install ts-node nodemon --save-dev

3. 初始化TypeScript配置

# 生成tsconfig.json
npx tsc --init

修改生成的 tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "CommonJS",
    "rootDir": "./src",
    "outDir": "./dist",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*"]
}

4. 创建目录结构

my-ts-node-project/
├── src/
│   └── index.ts    # 主入口文件
├── dist/           # 编译后的JS文件(自动生成)
├── node_modules/
├── package.json
└── tsconfig.json

对于SRC的目录需要手工创建一下,创建完成后,在VS-CODE中打开整个项目结构,然后新建终端窗口,在终端窗口里输入touch ./src/index.ts 就可以生成文件

5. 编写示例代码

在 src/index.ts 中写入:

function sayHello(name: string): void {
  console.log(`HELLO ${name.toUpperCase()}`);
}

sayHello("world");

6. 配置运行脚本

在 package.json 的 scripts 字段中添加:

{
  "scripts": {
    "build": "tsc",
    "start": "node dist/index.js",
    "dev": "nodemon --watch 'src/**/*.ts' --exec ts-node src/index.ts"
  }
}

7. 运行项目

方式一:开发模式(实时重载)

npm run dev
# 输出:HELLO WORLD

方式二:编译后运行

npm run build  # 编译TS到JS
npm start      # 运行编译后的JS
# 输出:HELLO WORLD

关键步骤说明

  1. TypeScript配置:tsconfig.json 指定了源码目录(src)和编译输出目录(dist)。
  2. 类型安全:@types/node 提供了Node.js API的类型定义。
  3. 开发工具
  4. ts-node 直接运行TS文件(无需手动编译)
  5. nodemon 监听文件变化自动重启

最终效果

无论选择 npm run dev 还是 npm run build && npm start,控制台都会输出:
HELLO WORLD

可以根据需求扩展项目结构(如添加 test 目录或 config 文件)


到这里第一个项目结构就生成了,接下来就可以抱起书本认真的开始学习TypeScript开发了,

本人的目标是一周内学会TypeScript开发

最近发表
标签列表