之前一直是在 Ubuntu 下进行 Python 和 Django 开发, 最近换了电脑, 把在 Virtual Box 下跑的 Ubuntu 开发机挪过来总是频繁崩溃, 索性就尝试把开发环境挪到 Windows 主力机了.
不得不说, 巨硬家这几年在多元并包方面真的是走在了世界前列. 特别是 VSCode, 两年前已经成为了我在 Linux 下的主力 IDE. 于是直接 Google 到了这篇爽文: Django Tutorial in Visual Studio Code, 下面会结合 Anaconda 的开发环境, 翻译这篇官方指导.
0x1 - 安装清单
- - Win10
- - Anaconda3
- - Vistual Studio Code(VSCode)
分别下载并按照好以上三个神器, 选的都是最新稳定版.
0x2 - Anaconda 管理并配置 Python 开发环境
打开 Anaconda Prompt 终端命令行工具(不是 Anaconda Navigator), 先来练习下 conda, 类似于 pip 和 virtualenv 的结合体.
用 conda 创建 Python 开发虚拟环境, 注意要在环境名称 (这里是 my_env) 后加上 python 版本.
conda create -n wechat_env python=3.7
移除环境
conda remove -n wechat_env --all
查看虚拟环境列表, * 代表当前工作所在的虚拟环境:
- (base) C:\Users\freman.zhang>conda env list
- # conda environments:
- #
- base * C:\Anaconda3
- wechat_env C:\Anaconda3\envs\wechat_env
激活及切换环境:
- (base) C:\Users\freman.zhang>conda activate wechat_env
- (wechat_env) C:\Users\freman.zhang>conda env list
- # conda environments:
- #
- base C:\Anaconda3
- wechat_env * C:\Anaconda3\envs\wechat_env
- (wechat_env) C:\Users\freman.zhang>conda deactivate
- (base) C:\Users\freman.zhang>
安装 Django 到开发环境, 如有需要可以指定版本号.
- conda install django
- conda install django==2.2.5
这样 conda 就会自动下载并安装好 Python 和 Django 到指定的开发环境, 无需再事先或单独安装在 OS 中.
conda 详细的管理命令可以到官方文档中详细了解.
0x3 - 在 VSCode 中配置集成开发环境
Django 是一个为安全, 快速和可扩展的 web 开发所设计的高级 Python 框架. Django 对于 URL 路由, 页面模板和数据处理等提供丰富的支持.
在接下来的 tutorial 中, 我们将创建一个简单的三页应用, 并将会用到一个通用的基础模板. 通过在 VSCode 中完整的过一遍这个开发过程, 我们将可以更好的理解如何使用 VSCode 的命令终端, 编辑器和调试器等来高效便捷地进行 Django 应用开发.
整个示例项目的完整代码在 GitHub: .
1. 准备条件
- 在 VScode 中安装 python 插件
- 下载安装 python, 在 Windows 中还需特别注意 PATH 环境变量的配置
我们的安装包和开发环境在前面已经都通过 conda 完成, 对比后就可非常明显的体现出 Anaconda 在包管理方面的便捷性.
2. 集成虚拟开发环境到 VSCode 中
在 VSCode 中按组合键 ctrl+shift+P, 输入 python, 先择 Python: Select Interpreter, 这个命令将会展示出一个所有 VSCode 可用的 python 解释器清单.
从这个清单中选择我们上面用 conda 新建的开发环境 -- 以 ./env or .\env 开头
按组合键 Ctrl+Shift+` 打开一个新的集成命令终端, 在 VSCode 的地步状态栏, 可以看到当前开发环境的标识
0x4 - VSCode 中创建 Django 项目
1. 按组合键 Ctrl+Shift+` 进入开发终端, 相关解释器和虚拟开发环境将会自动被激活. 然后执行如下命令, 如果没有任何报错, 用浏览器打开 http://127.0.0.1:8000, 我们将会看到 Django 的默认欢迎页.
- django-admin startproject web_project C:\web_project
- cd C:\web_project
- python manage.py startapp hello
- python manage.py runserver
2. 接下来是 Django 应用的基础构建
hello/views.py
- from django.http import HttpResponse
- def home(request):
- return HttpResponse("Hello, Django!")
hello/urls.py
- from django.urls import path
- from hello import views
- urlpatterns = [
- path("", views.home, name="home"),
- ]
web_project/urls.py
- from django.contrib import admin
- from django.urls import include, path
- urlpatterns = [
- path("", include("hello.urls")),
- ]
3. 保存所有文件, 然后启动服务 python manage.py runserver, 用浏览器访问应用网址 http://127.0.0.1:8000, 将会看到如下:
0x5 - VSCode 中创建 Django debugger launch profile 开启自动调试
到这里你可能已经在想, 是否有更好的方式来调试和运行应用服务, 而非每次执行一次 python manage.py runserver 呢? 必须有的!
VSCode 的 debugger 是支持 Django 的, 我们通过自定义 launch profile 就可以实现这一点.
1. 切换左边的活动栏到 Debug, 在 Debug 视图的顶部, 我们可以看到如下. No Configuratins 表示 Debugger 还未配置任何运行设定(launch.JSON).
2. 点击齿轮创建并开启一个 launch.JSON 文件, 这个文件里面已经包含了一些调试设定, 每种都是以独立的 JSON 对象存在. 我们添加如下:
- {
- "name": "Python: Django",
- "type": "python",
- "request": "launch",
- "program": "${workspaceFolder}/manage.py",
- "console": "integratedTerminal",
- "args": [
- "runserver",
- "--noreload"
- ],
- "django": true
- },
其中 "django": true 告诉 VSCode 开启 Django 页面模板调试功能.
3. 点击 Debug > Start Debugging 按钮, 浏览器中打开 URL http://127.0.0.1:8000 / 将可以看到我们的 App 顺利的跑起来了.
其实任何时候感觉想要调试一下应用效果时, 我们都可以用 Debug 来启动服务, 此外这个操作还会自动保存所有打开着的文件.
这样就不用每次都到命令行敲一遍启动命令, 倍爽有木有!!!
4. Debug 不仅仅只有启动和保存功能, 我们下面通过具体案例来体验下高级用法.
先码代码
hello/urls.py: 添加访问路由到 urlpatterns list 中
path("hello/<name>", views.hello_there, name="hello_there"),
hello/views.py
- import re
- from datetime import datetime
- from django.http import HttpResponse
- def home(request):
- return HttpResponse("Hello, Django!")
- def hello_there(request, name):
- now = datetime.now()
- formatted_now = now.strftime("%A, %d %B, %Y at %X")
- # Filter the name argument to letters only using regular expressions. URL arguments
- # can contain arbitrary text, so we restrict to safe characters only.
- match_object = re.match("[a-zA-Z]+", name)
- if match_object:
- clean_name = match_object.group(0)
- else:
- clean_name = "Friend"
- content = "Hello there," + clean_name + "! It's " + formatted_now
- return HttpResponse(content)
5. 在 Debug 中设定断点 (breakpoints) 于 now = datetime.now() 所在行.
6. 按 F5 或 Debug > Start Debugging 开启调试, VSCode 顶部将会出现一个如下的 Debug 工具栏.
Pause (or Continue, F5), Step Over (F10), Step Into (F11), Step Out (Shift+F11), Restart (Ctrl+Shift+F5), and Stop (Shift+F5). See VS Code debugging for a description of each command.
7. 在下面的终端中也会出现相关的控制信息. 通过浏览器打开 URL http://127.0.0.1:8000/hello/VSCode, 在页面渲染完成前, VSCode 会暂停在设定的断点处. 黄色小箭头代表其是即将执行到的下一行.
点击 Step Over(F10) 执行 now = datetime.now()所在行.
在左边 Debug 菜单栏我们将会看到很多实时输入信息, 包含运行时的变量值等等. 我们可以在这里检查各个赋值或相关信息是否符合设计目标.
程序暂停在断点位置时, 我们可以回到代码中更改相关语句, 调试器中的相关输入信息也会实时做状态更新. 我们可以尝试将 formatted_now 的赋值做如下更改, 用来直观地比较查看下调试器状态更新.
- now.strftime("%a, %d %B, %Y at %X")
- 'Fri, 07 September, 2018 at 07:46:32'
- now.strftime("%a, %d %b, %Y at %X")
- 'Fri, 07 Sep, 2018 at 07:46:32'
- now.strftime("%a, %d %b, %y at %X")
- 'Fri, 07 Sep, 18 at 07:46:32'
我们可以按 F5 逐行执行接下来的语句, 并观察调试器输出信息, 直到最终应用页面完全渲染完成, 点选 Debug > Stop Debugging 或 command (Shift+F5)关闭调试.
0x5 - Go to Definition
VSCode 也支持查看函数和类的定义查看:
- Go to Definition jumps from your code into the code that defines an object. For example, in views.py, right-click on HttpResponse in the home function and select Go to Definition (or use F12), which navigates to the class definition in the Django library.
- Peek Definition (Alt+F12, also on the right-click context menu), is similar, but displays the class definition directly in the editor (making space in the editor Windows to avoid obscuring any code). Press Escape to close the Peek Windows or use the x in the upper right corner.
0x6 - Template, Static, Models 编程
接下来可以在模板, 静态文件和数据处理的功能编程实现上实践上面介绍的这些功能, 练习整个集成开发环境的操作熟练度.
其实如果有一定基础的话, 我相信一天你就将会从入门到精通.
详细的代码个实现步骤在这里就不在继续往下贴了. 详细教程大家可按这个链接中的内容参照实现.
https://code.visualstudio.com/docs/python/tutorial-django#_create-multiple-templates-that-extend-a-base-template
0x7 - 问题分享
整个过程中只有遇到的问题:
1. VSCode 无法原生支持 Django Models 相关对象的关联检查.
我们需要额外做点工作:
ctrl+shift+`(ESC 下面那个键)打开命令终端, 不用手工敲任何命令, 终端会自动切换和激活到对应的虚拟开发环境.
安装 pylint-django
然后进入 VSCode setting 里面设定 pylint 参数, 具体如下:
就这样, 问题解决!
==========================================================
由于还有繁重的日常工作要忙, 这篇文章历时了几天时间断断续续整理出来, 也精简了不少官方指导中的文字描述. 可能会对各位阅读和操作来带一些困扰, 所以还是建议各位直接去读官方文档. 我们这里主要是集中整理了下 Anaconda 和 VSCode 的集成开发环境配置, 以备未来不时之需, 若能顺便帮到任何人, 将倍感欣慰. 各位若有任何问题, 欢迎提出, 我将会汇整日后自己或其他来源收集到的问题陆续补充到 0x7.
最后, 希望大家能多多动手
多多敲代码
多多点赞
多多分享
回家遛女儿去咯
Over~~
来源: https://www.cnblogs.com/chilliegg/p/11920751.html