前端框架

在nodejs中使用Typescript

2021-09-06  本文已影响0人  梁典典
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编写代码了

上一篇下一篇

猜你喜欢

热点阅读