默认情况，WebStorm是提供了创建TypeScript的模版文件，但是不提供自动编译ts文件为js和map文件。? 网上找的一些教程，主要是教大家额外配置一个File Watcher来对ts文件进行自动编译。后来我发现新版本的WebStorm已经提供自动编译的功能了，只是需要设置一下。
WebStorm自带配置自动编译TypeScript功能? 通过 File – Settings，调出 Settings界面，然后选择以下的界面即可配置：
他默认Compile那里的Enable TypeScript Compiler是没有打勾的，所以打上勾就可以了。? 打勾后默认是使用选择 Use tsconfig.json的设置方式的。所以你还得增加一份tsconfig.json配置文件。? WebStorm也是提供了模版，直接新建，选择创建 tsconfig.json File即可。
?
tsconfig.json的默认信息：
?{
? "compilerOptions": {
? ? "module": "commonjs",
? ? "target": "es5",
? ? "sourceMap": true
? },
? "exclude": [
? ? "node_modules"
? ]
?}
具体的参数信息，可以考虑这里： https://HdhCmsTesttslang.cn/docs/handbook/tsconfig-json.html ? 如果不想使用tsconfig.json的话，那么可以直接使用WebStorm内置的参数选项，也就是旁边的? Set options manually? 我个人推荐是使用是tsconfig.json，毕竟方便自由，只要熟悉了配置信息，就好多了，而且egret和laya都是使用tsconfig.json的。
通过File Watcher来自动编译TypeScript? 这个就是网上介绍比较多的方式，我自己也是测试过，也是一样是可以的，这个有点像Set options manually的方式，参数什么的需要自己配置。根据个人喜好了。一些参数的简要说明：
?Program:C:\Users\[username]\AppData\Roaming\npm\tsc.cmd
注意，这个安装了nodejs之后就会有，请按照自己实际的用户名
?Arguments:--sourcemap --target "ES5"
?Output paths to refresh:$FileNameWithoutExtension$.js:$FileNameWithoutExtension$.js.map
?Working directory:$FileDir$
?
其实参数之后配置，还可以根据自己的实际情况，配置不同的目录，比如编译后输出到bin-debug目录。
?
?
?
默认情况，WebStorm是提供了创建TypeScript的模版文件，但是不提供自动编译ts文件为js和map文件。? 网上找的一些教程，主要是教大家额外配置一个File Watcher来对ts文件进行自动编译。后来我发现新版本的WebStorm已经提供自动编译的功能了，只是需要设置一下。
WebStorm自带配置自动编译TypeScript功能? 通过 File – Settings，调出 Settings界面，然后选择以下的界面即可配置：
他默认Compile那里的Enable TypeScript Compiler是没有打勾的，所以打上勾就可以了。? 打勾后默认是使用选择 Use tsconfig.json的设置方式的。所以你还得增加一份tsconfig.json配置文件。? WebStorm也是提供了模版，直接新建，选择创建 tsconfig.json File即可。
?
tsconfig.json的默认信息：
?{
? "compilerOptions": {
? ? "module": "commonjs",
? ? "target": "es5",
? ? "sourceMap": true
? },
? "exclude": [
? ? "node_modules"
? ]
?}
具体的参数信息，可以考虑这里： https://HdhCmsTesttslang.cn/docs/handbook/tsconfig-json.html ? 如果不想使用tsconfig.json的话，那么可以直接使用WebStorm内置的参数选项，也就是旁边的? Set options manually? 我个人推荐是使用是tsconfig.json，毕竟方便自由，只要熟悉了配置信息，就好多了，而且egret和laya都是使用tsconfig.json的。
通过File Watcher来自动编译TypeScript? 这个就是网上介绍比较多的方式，我自己也是测试过，也是一样是可以的，这个有点像Set options manually的方式，参数什么的需要自己配置。根据个人喜好了。一些参数的简要说明：
?Program:C:\Users\[username]\AppData\Roaming\npm\tsc.cmd
注意，这个安装了nodejs之后就会有，请按照自己实际的用户名
?Arguments:--sourcemap --target "ES5"
?Output paths to refresh:$FileNameWithoutExtension$.js:$FileNameWithoutExtension$.js.map
?Working directory:$FileDir$
?
其实参数之后配置，还可以根据自己的实际情况，配置不同的目录，比如编译后输出到bin-debug目录。
?
查看更多关于WebStorm自动编译TypeScript的详细内容...