练习 - 将开发容器添加到现有项目

已完成

在为项目设置开发容器时，需要先向相应项目添加容器配置。 容器配置在 Visual Studio Code 中设置环境。

在本练习中，你将添加开发容器，并在容器中打开产品仪表板项目。

添加开发容器

1. 返回到 VS Code 和之前克隆的项目。

2. 按 F1 打开命令面板。

3. 键入“添加开发容器”并选择“开发容器: 添加开发容器配置文件”。 这显示了开发容器模板的列表。 模板包含为指定技术堆栈配置完整开发环境所需的源文件。

4. 选择“将配置添加到用户数据文件夹”。

5. 选择以下选项：

   选项	值
   选择容器配置模板	Python 3
   Python 版本	3.11
   选择要安装的其他功能	选择“确定”

重要

选择配置模板的第一步，可能需要从列表中选择“显示所有定义...”，然后在完整模板集加载完后，选择“Python”。

开发容器配置将添加到项目中。 Visual Studio Code 会通知你，说明现在可以在容器中打开项目。 现在，请关闭此通知。

检查配置文件

1. 请注意，已将名为“.devcontainer”的新文件夹添加到项目中。
2. 展开该文件夹，请注意，该文件夹包含 devcontainer.json 文件。

在容器中打开项目

1. 按 F1 打开命令面板。
2. 键入“在容器中重新打开”。
3. 在可用选项列表中，选择“开发容器: 在容器中重新打开”。

容器将开始生成。 初始生成可能要几分钟的时间，因为必须下载新映像，然后在计算机上生成。 首次生成容器后，后续生成的速度将更快。

查看远程指示器

容器生成完成后，可以通过检查远程指示器来确认是否已连接到容器。 现在还应会看到项目文件已加载到 VS Code 中。

• 通过查看 VS Code 的左下角来检查远程指示器。 请注意，它现在显示“开发容器: Python 3”。

  

重要

可能会看到有关 Pylance 或提高 Windows 性能的通知。 可以放心地关闭在 VS Code 中看到的任何通知。 无需执行这些操作。

检查容器

1. 如果尚未打开，请按 + `，在 Visual Studio Code 中打开集成终端。

2. 请注意，终端提示可能看起来不同于常规终端提示。

   

3. 运行以下命令以确保已安装 Python：

   python --version
   

   终端的输出应为容器中使用的 Python 版本。

安装项目依赖项

• 在终端运行以下命令，安装运行项目所需的 Flask 依赖项：

  pip3 install --user -r requirements.txt
  

运行项目

1. 在终端中输入以下命令，启动项目：

   python app.py
   

2. 导航到 http://127.0.0.1:5000，在浏览器中打开项目。

   

干得漂亮! 你已在计算机上运行带有 Flask 的 Python Web 应用程序，而你可能都不知道它们是什么。 这是正常的。 不必了解。 容器负责设置整个环境。

在下一部分中，可了解如何使用 devcontainer.json 文件来自动安装依赖项，以及如何为此 Python 项目自定义 VS Code。