1.首先新建一个项目
npm init -yes
2.开启Typescript依赖
npm install typescript --save-dev
安装typescript,现在我们可以通过命令行来使用tsc命令
3.安装nodejs类型
npm install @types/node --save-dev
4.使用命令创建一个tsconfig.json文件
npx tsc --init --rootDir src --outDir build --esModuleInterop --resolveJsonModule --lib es6 --module commonjs --allowJs true --noImplicitAny true
去除了无用的注释它的内容像这样的
{
"compilerOptions": {
"target": "es5",
"lib": ["es6"],
"module": "commonjs",
"rootDir": "src",
"resolveJsonModule": true,
"allowJs": true,
"outDir": "build",
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitAny": true,
"skipLibCheck": true
}
}
rootDir: typescript寻找我们编写代码的地方,现在配置为src目录,现在需要在项目录中创建一个src文件夹编写ts代码
5.编写ts代码
新建src/index.ts文件
console.log("hello 梁典典")
执行编译命令npx tsc,在项目目录中会自动创建build/index.js文件,内容如下
"use strict";
console.log("hello 梁典典");
6.配置热重载功能
它将监听你的代码自动进行惹更新
npm install --save-dev ts-node nodemon
项目根目录创建nodemon.json文件
{
"watch": ["src"],
"ext": ".ts,.js",
"ignore": [],
"exec": "ts-node ./src/index.ts"
}
在package,json新增一个脚本命令
"start:dev": "nodemon"
在命令行执行npm run start:dev,就可以自动监听文件更改了
7.创建支持清理和编译的生成版本
安装rimraf
npm install --save-dev rimraf
添加脚本
"build": "rimraf ./build && tsc",
8. 创建生产启动脚本
"start": "npm run build && node build/index.js"
现在可以使用typescript编写代码了
