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快捷键