Mac安装vscode IDE 撸nodejs代码

1. vscode官网地址：https://code.visualstudio.com   找到mac对应的下载地址，下载后的文件是 zip压缩包，解压后将文件拖到Application目录下即可。

2. 安装各种插件，不分先后，列表如下：

1.Chinese Language Pack for Visual Stidio Code

第一个必备插件自然是vs code的中文简体包，新手一开始不适应vs code这个IDE，建议可以先行使用中文版。

2.open-in-browser

由于 VS Code 没有提供直接在浏览器中打开文件的内置界面，所以此插件在快捷菜单中添加了在默认浏览器查看文件选项，以及在客户端(Firefox，Chrome，IE)中打开命令面板选项。

3.vscode-icons

好的代码始于颜值，vscode-icons是能够让右侧文件夹与不同文件都显示图标。

4.Auto Rename Tag

当HTML标签被修改其中之一时，另一半标签会跟着被修改。

5.beautify

良好的拓展性，可以格式化JSON|JS|HTML|CSS|SCSS代码,比内置格式化好用

6.Quokka

Quokka 是一个调试工具插件，能够根据你正在编写的代码提供实时反馈。它易于配置，并能够预览变量的函数和计算值结果。

7.CSS Peek

使用此插件，你可以追踪至样式表中 CSS 类和 id定义的地方。当你在 HTML 文件中右键单击选择器时，选择“ Go to Definition 和 Peek definition ”选项，它便会跳转到你样式定义的地方。

8.HTML BoilerPlate

通过使用 HTML 模版插件，你只需在空文件中输入 html，并按 Tab 键，即可自动生成干净的HTML文档结构。

9.Prettier

Prettier 是目前 Web 开发中最受欢迎的代码格式化程序。安装了这个插件，它就能够自动应用 Prettier，并将整个 JS 和 CSS 文档快速格式化为统一的代码样式。

10.Themes

在众多的实用插件中，岂能少了漂亮的主题呢？你每天都会与你的 VS Code 编辑器进行“亲密的接触”，为何不把它打扮得更漂亮些呢？这个插件可以更改页面主题。

11.Auto Close Tag

匹配标签，关闭对应的标签。很实用【适用于HTML/XML】。

12.Path AutoComplete

路径自动补全，这个是必须插件之一。

13.HTML CSS Support

让 html 标签上写class 智能提示当前项目所支持的样式。新版已经支持scss文件检索。

 

快捷键

打开一个新窗口 Ctrl+Shift+N

关闭窗口 Ctrl+Shift+W

新建文件 Ctrl+N

文件之间切换 Ctrl+Tab

复制或剪切当前行/当前选中内容 Ctrl+C 、 Ctrl+V

代码格式化： Shift+Alt+F

上下移动一行 Alt+Up 或 Alt+Down

向上向下复制一行 Shift+Alt+Up 或 Shift+Alt+Down

在当前行下方插入一行 Ctrl+Enter

在当前行上方插入一行 Ctrl+Shift+Enter

移动到行首 Home

移动到行尾 End

移动到文件结尾 Ctrl+End

移动到文件开头 Ctrl+Home

移动到定义处 F12

定义处缩略图 只看一眼而不跳转过去 Alt+F12

找到所有的引用 Shift+F12

同时修改本文件中所有匹配的 Ctrl+F12

重命名 比如要修改一个方法名，可以选中后按 F2，输入新名字，回车，则所有该方法的引用也都同步更新了

跳转到下一个 Error 或 Warning 当有多个错误时可以按 F8 逐个跳转

查找 Ctrl+F

查找替换 Ctrl+H

整个文件夹中查找 Ctrl+Shift+F

 

Ok,完毕，

引自 https://blog.csdn.net/weixin_43243583/article/details/86755485