在node环境中搭建typescript开发环境

在node中搭建TS开发环境

安装TypeScript

与安装第三方库差不多,建议初次安装就使用全局安装 npm i -g typescript

关于TS的编译

默认情况下,TS会做出下面几种假设:

  1. 假设当前的执行环境是dom
  2. 如果代码中没有使用模块化语句(import、export),便认为该代码是全局执行
  3. 编译的目标代码是ES3

有两种方式更改以上假设:

  1. 使用tsc命令行的时候,加上选项参数
  2. 使用ts配置文件,更改编译选项 (在终端使用 tsc --init 命令能创建默认配置文件)

TS的配置文件

使用了配置文件后,使用tsc进行编译时,不能跟上文件名,如果跟上文件名,会忽略配置文件。

@types/node 因为在ts中只能配置es环境,去掉document环境后console等命令无法使用,使用要搭建一个node环境

@types是一个ts官方的类型库,其中包含了很多对js代码的类型描述。

JQuery:用js写的,没有类型检查 安装@types/jquery,为jquery库添加类型定义

安装TS的库时因为一般只需要在开发环境中使用,建议使用 npm i -D @types/node

常用配置(将TS文件转换为JS文件时要遵循的标准)

{

     "compilerOptions": {//配置选项

        "target": "es2016" ,//配置编译目标时使用的版本标准,

        "lib": [ "es2016"],//指定目标运行时环境

        "module": "commonjs",//配置编译目标时使用的模块化标准

        "outDir": "./dist",//指定编译后的js文件存放路径

        "strictNullChecks":true,//严格检查undefined和null的赋值

    },

    include:[ './src' ]//在编译ts文件时只查找 ./src 文件夹下的ts文件进行编译

    files:[ './src/index.ts','./test.ts' ] //指定编译文件

}

使用第三方库简化流程

ts-node: 将ts代码在内存中完成编译,同时完成运行

使用 ts-node ./src/index.ts 命令加文件路径名的格式编译代码同时运行代码

nodemon: 用于检测文件的变化

执行:nodemon --exec ts-node ./src/index.ts

执行:nodemon -e ts --exec ts-node ./src/index.ts(-e ts 表示只监控ts扩展名)

执行:nodemon --watch src -e ts --exec ts-node ./src/index.ts(--watch src 表示只监控src文件夹下的ts文件)

./src/index.ts文件发生变化后会自动编译并执行

也可以将上面的执行命令 写入项目的package.json中,

如图 可以直接使用npm run dev启动项目

在node环境中搭建typescript开发环境_第1张图片

你可能感兴趣的:(typescript,javascript,前端)