本地搭建typescript项目流程

1.初始化

cnpm init —yes

2.全局安装typescript

cnpm install typesrcipt -g

3.生成tsconfig文件

tsc —int

4.修改tsconfig.json中的配置

"outDir": "./dist" outDir是ts编译后自动生成js文件的保存目录

"rootDir": "./src" rootDir是自己编写的ts源文件所在的目录

5.编译src目录下的ts文件

tsc

6.全局安装ts-node

cnpm install ts-node -g

7.安装nodemon工具（自动检测代码更新并重启项目）

cnpm install -g nodemon

8.在package.json中配置自动检测，自动重启应用程序

"scripts": {
    "dev": "nodemon --watch src/ -e ts --exec ts-node ./src/app.ts"
  }

nodemon --watch src/表示检测目录是package.json同级目录src

-e ts表示nodemon命令准备将要监听的是ts后缀的文件

--exec ts-node .lsrc/projectJapp.ts表示检测到src目录下有任何变化都要重新执行app.ts文件

9.parcel自动打包支持浏览器运行ts文件

• 安装parcel打包工具：cnpm install parcel-bundler --save-dev
• 在项目中新建index.html，再引入index.ts
• 在package.json中给npm添加启动项，支持启动parcel工具包

"scripts": {
  "start": "parcel ./index.html"
},

• 启动parcel工具包

    npm start

启动后如图：