1、vscode的安装

    官网下载并安装:Visual Studio Code

2、在vscode中使用Ts

  • 下载一些必要的插件

        1)、打开vscode的Extensions(shift+ctrl+x),下载TypeScript Extension Pack就好,里面包含了很多插件

  • 更改一些默认的设置

        1)、打开vscode的user settings(shift+ctrl+p)写入下面一些项,会使你的vscode界面更美观,开发更高效,代码更规范(你自己可以再设置后查看效果,我就不截图了)

"editor.renderWhitespace": "boundary" // 在边界处渲染空格

"files.autoSave": "afterDelay" // 延迟自动保存文档

"editor.rulers": [

120

] // 在120个字符处显示一条竖线(可以限制每一行只能写120个字符)

"search.exclude": {

"**/node_modules": true,

"**/bower_components": true,

"**/target": true,

"**/logs": true,

} // 在使用搜索功能时,将这些文件夹/文件排除在外

"files.exclude": {

"**/.git": true,

"**/.svn": true,

"**/.hg": true,

"**/CVS": true,

"**/.DS_Store": true,

"**/*.js": {

"when": "$(basename).ts" // ts编译后生成的js文件将不会显示在工作空间中

},

"**/node_modules": true

} // 这些文件将不会显示在工作空间中

        2)、设置代理

这篇是vscode官方使用ts教程,在有些情况下,如果你设置代理,你是无法使用tsconfig.json这个文件的,下面是在vscode中使用代理的方法(还是在user settings中设置),添加下面两项

"http.proxy": "http://认证账号:认证密码@代理域名:代理端口",

"http.proxyStrictSSL": false,

        3)、ts代码格式化设置

在vscode中ts代码格式化使用的是tslint格式化插件,但是最好在user settings中添加下面两项(因为你在下载了TypeScript Extension Pack这个包后。默认使用的格式化工具变成了prettier)

"prettier.tabWidth": 4,

"prettier.tslintIntegration": true // 使用tslint

养成好的习惯,在写了一些代码后,习惯性的进行代码的格式化(shift+alt+f)

3、vscode的一些常用的快捷键(可能有些快捷键的描述并不是很清楚,可以自己试一下这些快捷键,看看是什么效果)

ctrl+d 选中贯标所在的单词(连续按则多选)

在ctrl+p 的窗口下

       1、直接输入文件名,跳转到文件

       2、? 列出当前可执行的操作

       3、: 跳转到行数,也可以ctrl+g

       4、@ 跳转到symbol

       5、@: 根据分类跳转到symbol

       6、# 根据名字全局查找symbol

ctrl+shift+n 打开新窗口,(但是不能打开同一个文件夹)

ctrl+shift+w 关闭窗口

ctrl+tab 不同文件之间切换(打开的文件之间)

ctrl+f4 关闭文件

ctrl+[ 、ctrl+] (向右)代码行缩进,(光标在任意位置都行)

ctrl+c和ctrl+v 如果不选中,默认复制或者剪切一整行

shift+delete(ctrl+x) 剪切,如果不选中,默认复制或者剪切一整行

shift+alt+up, shift+alt+down 向上,向下复制一行

shift+up, shift+down 向上或者向下选中一行(连按选择多行)

shift+right, shift+left 向左向右单个字母选中

shift+ctrl+enter 在当前行的上方插入一行

ctrl+enter 在当前行的下方插入一行

ctrl+delete 删除光标右边的所有字

home 光标移动到行首

end 光标移动到行尾

ctrl+home 光标移动到文件开头

ctrl+end 光标移动到文件结尾

f12 移动到定义处

alt+f12 定义处的缩略图,不跳过去

shift+ctrl+[ 折叠

shift+ctrl+] 展开

shift+end 选择从光标到行尾

shift+home 选择从行首到光标处

shift+ctrl+k 删除行

alt+left  回退

f8 跳转到下一个error或者warning

ctrl+f 本文件内查找

ctrl+h 本文件内查找替换

shift+ctrl+f 全局查找

shift+ctrl+h 全局查找替换

ctrl+b 侧边栏隐藏或显示

ctrl+ ~ 控制台终端显示与隐藏

shift +ctrl +u 显示output console

shift+ ctrl +y 显示debug console

shift+ctrl+m 显示problem console

ctrl+k ctrl+c 单行注释

ctrl+k ctrl+u 取消单行注释

shift+alt+a 多行注释

这里只列出了那些非常常用的vscode快捷键