VSCode搭建开发环境--从PyCharm到拥抱vscode

本文主要是介绍VSCode搭建开发环境--从PyCharm到拥抱vscode，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

VSCode搭建开发环境

前言
安装扩展
全局配置文件
单个项目的配置
快捷键

前言

最近自己的PyCharm Professional的License过期了，导致没有一个好的开发IDE，于是开始拥抱免费的Visual Studio Code啦。

当然，不可否认的是PyCharm对于开发Python来说还是非常好用的，特别是Professional版本。

由于本人不仅写Python，也写一些前端代码，PyCharm或者WebStorm来写前端都导致电脑很卡，特别吃内存。

于是趁此机会拥抱vscode，一方面因为免费，另外vscode有很多扩展(Extensions)，能支持多语言的开发，非常方便。

vscode官网下载

vscode主要是安装扩展，然后就是各种配置项，以满足个人的自定义需求。

安装扩展

在这里插入图片描述
推荐可以安装如下扩展：

Python 导入Python项目会自动识别，IDE会主动推荐安装扩展；
autoDocstring 用于自动生成注释文档的，支持很多风格文档的定义；
Flake8 或者 pylint 用于代码风格检查；若两个都安装了，开启一个使用即可；
- 该插件依赖系统命令，Mac系统可使用brew安装 brew install flake8 或者 brew install pylint ；
- 否则无法生效，或者pip安装，然后按照相关配置说明配置命令行路径，推荐全局安装；
Prettier 可用于格式化代码
GitLens 用于git管理
ESLint 前端代码检查
- 依赖eslint命令，推荐全局安装；
- 也可在项目当前目录下通过package.json配置安装；

以上所有插件都可以通过界面配置，当然也可以通过command + , 快捷方式打开：
在这里插入图片描述

其中git扩展还提供了自己的UI管理界面：command + shift + p 打开搜索：

例如我取消了类上面git blame相关的信息提示：

全局配置文件

在这里插入图片描述

全局配置文件通过json编辑，这里给出配置示例，至于含义可自行搜索一下：

settings.json

{// 开启自动保存"files.autoSave": "afterDelay","[markdown]": {"diffEditor.ignoreTrimWhitespace": true},// 设置Google风格的文档"autoDocstring.docstringFormat": "google-notypes","python.diagnostics.sourceMapsEnabled": true,// python代码检查的设置"pylint.args": ["--disable=C0111", "--max-line-length=120"],"flake8.args": ["--max-line-length=120", "--exclude=migrations", "--ignore=E203,E503,W503"],// 排除在ide内不展示的目录"files.exclude": {"**/__pycache__": true,"**/.idea": true,"**/vendor": true},// 自动化格式代码配置，看需要根据语言打开"[javascriptreact]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"emmet.includeLanguages": {"javascript": "javascriptreact"},"prettier.arrowParens": "avoid","prettier.printWidth": 512,"[jsonc]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"eslint.workingDirectories": ["./frontend"],"git.openRepositoryInParentFolders": "always","[python]": {"diffEditor.ignoreTrimWhitespace": true,"editor.formatOnType": true,"editor.wordBasedSuggestions": "off"},// 用于出现中文"editor.unicodeHighlight.allowedLocales": {"zh-hans": true},// git blame 的格式显示"gitlens.blame.format": "${author|12} ${message|30?} ${agoOrDate|14-}",// git blame不显示头像"gitlens.blame.avatars": false,// 自动去掉行末的空格"files.trimTrailingWhitespace": true,"[json]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"gitlens.codeLens.enabled": false,// 不自动根据打开的文件定位到菜单"explorer.autoReveal": "focusNoScroll",// 菜单文件树目录的缩进"workbench.tree.indent": 16
}

keybindings.json

// 将键绑定放在此文件中以覆盖默认值
[{"key": "shift+cmd+u","command": "-workbench.action.output.toggleOutput","when": "workbench.panel.output.active"},{"key": "shift+cmd+u", // 切换大写"command": "editor.action.transformToUppercase"},{"key": "cmd+u",  // 切换小写"command": "editor.action.transformToLowercase"}
]

单个项目的配置

放在项目根目录下，新建文件夹.vscode , 里面可以用于放配置文件覆盖全局配置。
.vscode/settings.json

{// 设置前端目录路径"eslint.workingDirectories": ["./frontend"],// 设置python后端目录路径"python.analysis.extraPaths": ["./backend"],"flake8.cwd":"${workspaceFolder}/backend"
}