使用 Visual Studio Code（VSCode）搭建简单的 Python + Django 开发环境

时间 2019-11-16 标签使用 visual studio code vscode 搭建简单 python django 开发环境

写在前面的话

做为有个 Python 菜逼，以前一直用的 Pycharm，可是在主题这一块怎么调整都感受要么太骚，看起来不舒服，要么就是简直不能看。彷佛用大 JB 公司 IDE 的人彷佛都不怎么重视主题这个东西。前端

我我的是那种“喜新厌旧”的，因此看久了 Pycharm 就感受很难受了，再加上 Pycharm 太笨重了，就换成了之前短期用过的 VSCode，之前没用是懒得折腾插件，如今闲下来准备折腾一下！python

这里放一张我如今的 Pycharm 的配色主题：shell

闲话少说，进入正题！ django

建立 Django 测试项目

这里说明一下，配置的是 Python + Django 的环境，因此我会重新建一个测试的 Django 项目开始，算是总体流程再走一遍！ json

【1】新建一个 Django 项目： 注意，我这里 Python 使用的是 virtualenv 为项目创建的虚拟环境，没用过的照着这个步骤作就行，须要注意那个切换到咱们新环境的命令就行windows

安装配置 VSCode

【1】安装 VSCode：浏览器

下载地址：https://code.visualstudio.com/运维

根据本身电脑对应的操做系统下载对应的版本便可，至于安装过程也和通常的软件同样，没什么特别须要注意的地方！编辑器

安装完成以后打开，最开始的页面是这样的：ide

这时候就须要咱们根据须要安装对应的插件了，这也是整个 VSCode 最出彩的地方。须要啥安装啥，而不用全家桶安装！

【2】插件安装：咱们这里就不用快捷键了，都页面摆在这里，直接点就好了！

这里会有不少推荐的插件，也能够看到咱们安装的和禁用的插件。

1. 首先，咱们安装个汉化界面的插件：Chinese (Simplified) Language Pack for Visual Studio Code

咱们点击右下角 Install 就能安装，值得注意的是，咱们安装后并不会生效，在安装后右下角会弹框提示咱们 Restart，咱们出去 VSCode 就好了！

这时候已经变成了中文界面，咱们能够打开刚刚咱们建立的项目了！

2. 打开项目：左上角 文件 --> 打开文件夹

这时候咱们会发现两个问题，一个是默认主题并很差看，另外一个是文件没有图标进行区分，因此这时候咱们就须要进行配置！

3. 文件图标和主题美化： Material Icon Theme 和 Son of Obsidian Theme

安装完成后点击插件右下角的从新载入就好了！

可是这样主题这些并不会直接就加载出来，须要手动选择：

根据左下角有个设置，里面能够进行不少设置：

我这里将咱们的配置贴出来：

进入设置后能够能够点击这个代码符号将咱们的配置贴进去，固然你也能够本身一项一项的配置，只要你不怕麻烦：

{
    "editor.fontSize": 16,
    "explorer.confirmDragAndDrop": false,
    "extensions.autoUpdate": false,
    "workbench.colorTheme": "Son of Obsidian",
    "editor.fontFamily": "Consolas, Dengxian",
    "workbench.sideBar.location": "left",
    "workbench.startupEditor": "newUntitledFile",
    "workbench.iconTheme": "material-icon-theme",
}

粘贴到右边保存便可：

最终达到的效果以下图：

此时再看，就会发现代码有了舒服的配色，并且文件夹和文件也有了属于本身的图标，固然你也能够到网上选择你喜欢的风格，反正我是挺喜欢这个的。

不少之前用 sublime 的 monokai，在 VSCode 里面也是有 Monokai 的，我我的是看厌了！

4. 接下来即是安装真正协助咱们开发的插件：

Python：Python 语法的基本插件
Django：Django 的插件，用于模板中语法提示和补全，注意不是搜索出来的第一个，而是后面有个 1.0 版本的
XML Tools：整个 VSCode 都会用到的插件，运维配置 VSCode 须要
Beautify：前端美化
View In Browser：浏览器快捷打开前端页面
HTML CSS Support：HTML 基础插件
Path Intellisense：路径补全插件

5. 运行咱们的项目：

配置 Python 环境：我点击添加配置后悔在右边弹出个框，选择 Python 便可，这样就能打开一个配置文件！

在回到咱们的项目，这时候会多了一个文件夹和两个文件：

打开 settings.json 文件，将里面的 Python 路径换成咱们以前 virtualenv 添加的！注意斜线 windows 是双斜线

打开 launch.json 文件配置 Django 启动的参数：找到 Django 的项，我这里给他指定了一个端口，你也能够加其余

运行项目：

访问测试：

安装语法检测和代码格式化工具：

在运行的终端中咱们直接添加 Power shell 就能够至关于咱们在 windows 命令行直接操做命令了，并且是在虚拟 Python 环境下，很方便：

此时咱们须要 pip 安装咱们须要的包：

pip install pylint
pip install yapf
pip install pylint_django

在咱们项目以前生成的 settings.json 文件中加入如下配置：

{
    "python.pythonPath": "E:\\VSCodeProject\\vscode_env\\Scripts\\python.exe",
    "python.formatting.provider": "yapf",
    "python.linting.pylintArgs": [
        "--load-plugins",
        "pylint_django",
    ]
}

最好在重启一下编辑器，这样咱们的 VSCode 就算配置完成了，虽然还有一些小的不足，可是后续能够根据本身的需求慢慢的修复！总的来讲仍是很香的！

小结

看起来过程有些复杂，可是总的来讲仍是不错的，不少东西都是第一次配置就好了，像主题风格这些都是一次配置终身使用。新开项目也就配置一些环境而已。

使用 VSCode 只要区分一些工做区配置和系统配置就行，系统配置就是会影响你之后打开 VSCode 的使用，工做区则是当前项目，也就是咱们在 settings.json 里面的配置！

至于 launch.json 的配置，那彻底是 Python 启动的参数配置，你不一样项目确定会配置不一样的端口的，这没什么好说的。

还有其它一些有用的插件，等到须要的时候再去完善！

最后附带一张 HTML 的样张，这也是我选择这个工具的缘由，很喜欢这个主题啊！