前端环境部署

一、Git

 官方下载地址：Git - Downloading Packagehttps://git-scm.com/download/win

下载后，装在其他盘，不用装在C盘。

如果右键中有了Git Bush Here 或者 Git Gui Here说明就成功了。

二、TortoiseGit

下载：TortoiseGit

找到网站中对应的软件格式，我们大多都是"for 64-bit Windows"的格式，顺手把下面的中文插件下载了（如果你需要的话）：

下载之后，点击应用程序进行安装，记得把安装目录放到其他盘符，不需要放到系统盘。

切记一切安装结束之后，再运行language的语言插件应用程序，他会自动在你电脑里找到小乌龟，并在运行结束的最后一步，把应用语言给勾选上。

具体如何配置puttykey，可以参考我写的另一个博客：

TortoiseGit生成PuTTyKey教程_thiStefan的博客-CSDN博客正确使用代码管理工具：小乌龟。https://blog.csdn.net/weixin_42216094/article/details/118258271?spm=1001.2014.3001.5502

三、NodeJs

官方下载地址：

下载 | Node.js 中文网http://nodejs.cn/download/建议下载比最新版本稍微低一些的版本，比如最新的是v16.14.0，那么我们可以下载v14的版本，低版本的出错误的概率要小的多，比如我们的项目需要用python27的依赖，如果我们用了v16的新版本node，npm install的时候会出现报错现象，但是v14的就可以正常使用python27的依赖。

下载完成之后，进一步的去安装，这里你有两种选择：

3.1、装在C盘（系统盘）中

如果是对自己的电脑无所谓，或者你用的是公司电脑（doge），那么你一路点击next进行安装即可，然后在cmd中使用：node -v 来验证是否安装成功，path环境变量是安装时自动加入的，默认走的C盘路径。因为global和cache会往系统盘中钻，且不说它对于电脑的运行速度有多少影响，但是作为一个将电脑文件夹都归类分好的程序员本员至少是忍不了的，如果介意请看下面的教程。

3.2、装在其他盘中

我们在安装程序中，选择装在D盘中，绿色框中是安装后本来就有的文件，蓝色框是我们需要去创建的文件夹，日后有大用（doge。

 蓝色框中的文件夹，用来存放各种node全局插件和cache，我们只需要cmd设置一下node，让它听话的自动保存到这两个文件中：

npm config set prefix "D:\Nodejs\node_global"
npm config set cache "D:\Nodejs\node_cache"

如果你输入上面两条命令，没反应，就是最好的反应。

接着输入以下命令来验证你的地址有没有设置成功：

npm config ls

在cmd打出来的日志中，看到自己设置的路径，代表我们目前的操作都没有问题了：

 接下来就是path的环境变量设置了：

 在vscode中的cmd通过node -v验证之前，记得把之前的cmd控制台关掉，因为它进行的验证还是你配环境之前的。如果还是找不到npm，就用管理员身份打开vscode。

 然后可以验证下，global插件能不能到D盘中，我们这里下载一个功能是移除文件的插件（这个插件安装之后，可以通过rimraf加文件名删除指定文件）：

npm install rimraf -g

 完美（金星语气）。

四、python

进入官网下载：

 和上面各类依赖一样，我们选择安装到D盘（非系统盘），之后配置path环境变量：

在cmd中执行（记得保存完环境变量配置之后，关掉之前的cmd，重新再开一个cmd，因为有缓存）：

python

 出现版本了，就是安装成功了，如果没有，看看path路径有没有写错。

五、VSCode

这里没什么了，就是一些好用些的插件：

5.1、auto系列

自动帮你补全或重命名标签的插件，写dom有帮助。

5.2、braket pair colorizer

 braket pair colorizer 花括号会变成不同颜色，一对儿一个颜色，看JS的时候有帮助。

(现已移除，VSCode会内置这个插件，需要在VSCode的setting.json中设置上：

"editor.bracketPairColorization.enabled": true,

"editor.guides.bracketPairs": "active"

5.3、theme & icon package

 city lights icon package 和 eva theme 算是我个人比较喜欢的文件图标主题和开发主题。

5.4、indent-rainbow

 indent-rainbow 会更明显的显示出每一行的段前空格，更方便阅读代码。

5.5、live browser & open in browser

 live browser 和 open in browser 、chinese language 必下，一个是给你打开一个热加载的页面，一个是右键在浏览器打开，一个是中文语言包。

5.6、snippets

 snippets 这类插件基本是一些语言代码片段，方便开发，比如输入log就联想console.log()。

5.7、jsdoc

 是可以帮你快速生成文件注释的插件，格式类似于这样：

 使用上就是鼠标选中你想自动生成注释的代码块或者某func，然后键盘Ctrl+Shift+P调出VSCode的搜索框，输入gen jsdoc回车即可：

 5.8、GitLens

 GitLens在提交代码时，会自动进行eslint检测，检测你的代码中不符合es6规则的代码，并且禁止提交后标注出某个文件的某个错误代码。

在这里也可以很方便管理代码：