1. 在webapp文件夹新建js和ts文件夹
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/f3e759a9267aee114ed0865c7d45281f.png#pic_center)
2.将ts文件夹在终端中打开(Win则在cmd)
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/9cd9441820fa1925710ea3b3479b1c8a.png#pic_center)
3.在ts目录下生成tsconfig.json文件
输入下面代码可以生成tsconfig,json
tsc --init
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/48d56995cbdd39d663e69f2d0fd86301.png#pic_center)
4.修改配置文件
打开tsconfig.json修改如下两行
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/f56636d7ea82d6d86b1dafdcfc39bf87.png#pic_center)
5.监视tsconfig文件
在终端输入,以开启监视
tsc -p tsconfig.json --watch
回车后会提示出,则已经开启监视
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/0009acdafa47ae2d63fb4047da9b828d.png#pic_center)
6.完成
之后每当我们重启tomcat服务器,或者重新部署项目的时候都会自动编译ts文件到js文件夹中
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/c841f7a90cfe300be6b7acfcb3a4755f.png#pic_center)
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/167425541b60d38d144cf24d9064a431.png#pic_center)