鬼刃 發表於 2020-1-14 20:03:00

前端开发神器 VSCode 使用总结

<svg xmlns="http://www.w3.org/2000/svg" style="display: none">
                        <path stroke-linecap="round" d="M5,0 0,2.5 5,5z" id="raphael-marker-block" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0)"></path>
                  </svg>
                                          <blockquote>
<p>VSCode 是微软出品的,基于 Electron 和 TypeScript 的,集成了 git 版本管理和命令行终端,而且开源稳定,插件丰富,再搭配一款 Chrome 浏览器,可以说是<code>前端开发神器</code>了。</p>
</blockquote>
<h2>安装指南</h2>
<p>VSCode 需要用到 node.js 和 git,如果没有就到https://nodejs.org/en/download/下载 node.js,然后到https://git-scm.com/downloads下载并安装 git,注意自己的系统版本,最后到https://code.visualstudio.com下载 vscode 并安装好。</p>
<p><img src="https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy83NDk3NjYwLWQxOWRkOGI3YzRiYjFjYjQucG5n?x-oss-process=image/format,png"></p>
<h2>推荐插件</h2>
<p>project manager // 项目管理<br>
prettier // 自动格式化你的代码<br>
gitlens // 查看 git 修改记录<br>
bracket pair colorizer2 // 彩色括号匹配<br>
code spell checker // 单词拼写检查<br>
eslint // javascript 代码风格检查工具<br>
git history // git 历史<br>
npm intellisense // npm 自动补全<br>
path intellisense // 自动补全文件路径<br>
material icon theme // 好看的图标<br>
highlight matching tag // 高亮匹配标签<br>
better toml // toml 文件支持<br>
auto rename tag // 自动重命名标签<br>
auto close tag // 自动关闭标签<br>
debugger for chrome // 在 chrome 里调试<br>
visual studio intellicode // 智能补全<br>
Markdown All in One // 写 markdown 神器<br>
ES7 React/Redux/GraphQL/React-Native snippets // react 代码简写<br>
react native tools // 写 react native<br>
vetur // 写 vue<br>
javascript(es6) code snippets // javascript 代码简写</p>
<h2>推荐快捷键</h2>
<p>F1 打开可以输入命令<br>
F2 重命名变量,方便重构<br>
F5 运行和调试代码<br>
F12 去到定义的地方<br>
shift+F12 查找所有引用<br>
ctrl+g 会让你输入数字,快速定位到指定行<br>
ctrl+enter 在下方另起一行<br>
crtl+f 查找<br>
ctrl+shift+n 多开一个 vscode 编辑器<br>
ctrl+b 开关侧边栏<br>
ctrl+h 替换<br>
ctrl+r 打开最近文件<br>
ctrl+` 终端<br>
ctrl+tab 切换文件<br>
ctrl+shift+e 切到资源管理器<br>
ctrl+p 快速打开文件<br>
ctrl+[左移代码<br>
ctrl+]右移代码<br>
ctrl+/ 行注释<br>
ctrl+t 匹配文本来打开文件<br>
ctrl+shift+t 重新打开关闭的文件<br>
ctrl+shift+home/end 选择光标左侧/右侧全部内容<br>
ctrl+backspace 删除上一个词<br>
ctrl+delete 删除光标右侧的词<br>
ctrl+左/右 跳到上/下一个词<br>
ctrl+shift+左/右 逐个选词<br>
鼠标滚轮或者shift+alt+鼠标拖拽 批量选中,方块选择<br>
ctrl+shift+pageup/pagedown 切换文件<br>
ctrl+d 选中当前词语<br>
ctrl+enter 下方插入一行<br>
alt+左/右箭头 跳回来/过去<br>
alt+shift+上/下箭头 向上/下复制行</p>

                                    

</div>
<div id="MySignature" role="contentinfo">
    博客已迁移到 blog.pythonking.top,如果地址失效或者有其他问题请到 github.com/DongchengWang/my-blog<br><br>
来源:https://www.cnblogs.com/stardust233/p/12193846.html
頁: [1]
查看完整版本: 前端开发神器 VSCode 使用总结