subline ts 环境配置

最新推荐文章于 2024-06-18 09:51:35 发布

pan # jun

最新推荐文章于 2024-06-18 09:51:35 发布

阅读量280

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/dante_777/article/details/132987070

版权

3个步骤，2个配置；在实际使用编译过程中会遇到点小问题，所以还是静静的看完全文吧。

步骤：

1.sublime text3编辑器，安装好package control，能顺利安装各种插件；（这是基础，如果这个都不懂的话，我建议还是不要往下看了）；

2.安装typescript插件，用以识别ts文件；（这个插件安装超级慢，请慢慢等待安装完成）

3.安装SublimeOnSaveBuild插件，用以ctrl + s保存文件时自动编译；

以上是准备工作，下面开始配置插件；

因为我的sublime安装了中文插件包，所以sublime菜单都是中文的，我自己觉得中文很亲切（虽然可能真的会有点low），这个中文安装包也是sublime的插件；

配置：

1. 编辑器上方菜单栏工具 -> 编译系统 -> 最后一项新建编译系统，此时会自动弹出一个文件，把默认内容清空，把以下内容写入文件：

{

"cmd": ["tsc","$file"],

"file_regex": "(.*\\.ts?)\\s\$([0-9]+)\\,([0-9]+)\$\\:\\s(...*?)$",

"selector": "source.ts",

"windows": {

"cmd": ["tsc.cmd", "--target", "ES5", "$file"]

}

ctrl + s 保存，保存路径就用默认路径，随便命个名（但至少你自己知道是什么名字，后面会用到），比如我定义的就叫ts.sublime-build，文件名是自定义的，文件后缀是自动生成的；

重启sublime（这是常见操作，每次安装插件基本上都要重启）；

2.新建一个ts文件，随便写点ts代码，ctrl + s保存，然后 ctrl + shift + b（用...编译），此时会弹出一个小窗口让你选择用什么编译规则编译，上方的ts.sublime-build文件就起作用了，你会看到小窗口里面有两个选项，一个是typescript，另一个是ts，显然应该选择ts，不然我上面一系列操作干吊；（这里你可能会疑问，为什么不用插件自带的typescript来编译呢，那么请你反向思考一下，如果插件自带的可以用的话，我下面还搞那么多操作搞毛）；

3.如果每次写ts代码，写一点，ctrl + shift + b 或者 ctrl + b 编译真的是太麻烦了，很明显不符合我超级无敌懒的特性，所以再次配置步骤3中的插件SublimeOnSaveBuild；

4.编辑器上方菜单栏首选项 -> Package Settings -> SublimeOnSaveBuild -> Settings — User，写入以下内容：

{

"filename_filter": "\\.(ts||sass|less|scss)$",

"build_on_save": 1

}

第一个配置项是检测的语言，第二个配置项，1，就是true，不解释；

上面配置2里面遇到一个问题，ctrl + shift + b 和我安装的美少女战士皮肤的搜狗输入法的颜文字快捷键冲突了，这个冲突跟搜狗皮肤没有什么关系，我只是为了强调一下我用的是美少女战士的皮肤而已；所以需要修改一下搜狗输入法的快捷键，然后才能顺利的ctrl + shift + b调出编译控制台；

至于为什么要用ctrl + shift + b来编译呢，网上的教程都说是用ctrl + b编译；

我在实际使用过程中，发现，不用ctrl + shift + b，直接用ctrl + b编译时，每次sublime底部都会弹出一个窗口，让我输入需要编译的代码，此时我就炸掉了，我写的代码是ts文件里面的，难道我要copy一遍到这个窗口吗，那是万万不可以的；

我索性按了一下enter键，哇，竟然编译了。我才明白，当我直接用ctrl + b编译的时候，sublime根本不知道我要编译的文件是什么类型的，因此也不知道该用什么编译系统来编译，所以才让我手动编译一遍，每次写新的ts，每次ctrl + b，sublime都不知道我要编译的是什么，然后每次ctrl + b，再 enter，这个操作又让我烦了；因此，用ctrl + shift + b，让sublime记住我对该类型文件用什么编译系统编译，没错，ctrl + shift + b的作用就是让sublime记住该类型后缀文件需要用什么编译系统编译，用ctrl + shift + b手动编译一次，下次sublime就能记住这种类型的文件是什么情况了，就可以自己完成编译了；

最后，你就可以像在vscode里面写代码一样，写完自动编译，nice，搞了1个半小时，文档写了一刻钟；结果很简单，过程很艰辛；

还好弄好了，感觉整个世界都美好了；