WebStorm：TypeScript的自动化编译
本章介绍了如何在WebStorm中实现TypeScript的自动化编译，适用于不想使用VSCode而选择JetBrains工具的初学者。文章指出，在使用Vue或React等框架时，由于官方提供的脚手架和构建工具（如Webpack或Vite）已经配置好，开发者无需额外考虑自动化编译。实现步骤包括：创建一个空项目，编写index.html和index.ts文件，通过命令行生成tsconfig.json
·
目的：本章展示如何使用Webstrom实现TypeScript的自动化编译
适用场景：不想使用VS code，采用JetBrains的WebStrom工具，作为初学者实现TypeScript的自动化编译
为什么做项目不需要考虑自动化编译的原因：无论是Vue，还是React框架，官方提供的有脚手架，使用Webpack或者Vite构建工具进行配置，自己想怎么写ts文件都没问题
步骤：
1. 随便创建一个空的项目
2. 编写两个文件，index.html和index.ts（名字无所谓，注意src中的名字保持一致就行），代码如下：
<!-- index.html代码 -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript" src="index.js"></script>
</body>
</html>// index.ts代码
const person = {
name: '测试',
age: 20
}
console.log(`我叫${person.name}，我今年${person.age}岁了`)3. 创建文件完成后，在命令行输入
tsc --init
会自动创建一个tsconfig.json配置文件
接着命令行输入：
tsc --watch就可以实现自动监视，完成自动化编译，马上就生成index.js文件。当ts文件变化时，js文件也会变化，到此，自动化编译就已经完成。
更多推荐
6
0- 0
已为社区贡献1条内容
所有评论(0)