Bài tập - Thêm bộ chứa nhà phát triển vào dự án hiện có

  • 4 phút

Khi bạn đang thiết lập bộ chứa phát triển cho một dự án, trước tiên bạn sẽ cần thêm cấu hình bộ chứa vào dự án đó. Cấu hình bộ chứa thiết lập môi trường của bạn trong Visual Studio Code.

Trong bài tập này, bạn sẽ thêm một bộ chứa nhà phát triển và mở dự án Bảng điều khiển Sản phẩm trong bộ chứa.

Thêm bộ chứa phát triển

  1. Quay lại VS Code và dự án bạn nhân bản trước đó.

  2. Nhấn F1 mở Bảng màu Lệnh.

  3. Nhập thêm bộ chứa dev và chọn Bộ chứa Dev : Thêm Tệp Cấu hình Bộ chứa Phát triển. Thao tác này trình bày danh sách Mẫu Bộ chứa Dev. Mẫu chứa tệp nguồn cần thiết để cấu hình môi trường phát triển hoàn chỉnh cho ngăn xếp công nghệ đã xác định.

  4. Chọn Thêm cấu hình vào không gian làm việc.

  5. Chọn các tùy chọn sau:

    Sự quyết định Giá trị
    Chọn mẫu cấu hình bộ chứa Trăn 3
    Phiên bản Python 3.11
    Chọn các tính năng bổ sung để cài đặt Chọn ok

Quan trọng

Trong bước đầu tiên khi chọn mẫu cấu hình, bạn có thể cần chọn "Hiện Tất cả Định nghĩa..." từ danh sách, rồi chọn Python sau khi bộ mẫu đầy đủ tải.

Cấu hình Bộ chứa Nhà phát triển sẽ được thêm vào dự án của bạn. Mã Visual Studio sẽ thông báo cho bạn rằng bây giờ bạn có thể mở dự án trong một bộ chứa. Hiện tại, hãy bỏ qua thông báo này.

Kiểm tra tệp cấu hình

  1. Lưu ý rằng thư mục mới '.devcontainer' được thêm vào dự án.
  2. Bung rộng thư mục đó và lưu ý rằng thư mục đó chứa devcontainer.json tệp mới.

Mở dự án trong bộ chứa

  1. Nhấn F1 mở Bảng màu Lệnh.
  2. Nhập mở lại trong bộ chứa.
  3. Chọn Bộ chứa phát triển: Mở lại trong bộ chứa danh sách các tùy chọn khả dụng.

Container sẽ bắt đầu xây dựng. Bản dựng ban đầu có thể mất vài phút vì phải kéo hình ảnh mới xuống và dựng trên máy của bạn. Sau khi bộ chứa được xây dựng lần đầu tiên, các bản dựng sau này sẽ nhanh hơn nhiều.

Xem Chỉ báo Từ xa

Khi bản dựng bộ chứa hoàn tất, bạn có thể xác nhận rằng bạn đã kết nối với bộ chứa bằng cách kiểm tra Chỉ báo Từ xa. Bây giờ bạn cũng sẽ thấy các tệp dự án của mình được tải trong VS Code.

  • Kiểm tra Chỉ báo Từ xa bằng cách xem góc dưới bên trái của VS Code. Lưu ý rằng bây giờ nó hiển thị "Dev Container: Python 3".

    ảnh chụp màn hình của Chỉ báo Từ xa với văn bản cho biết python bộ chứa dev 3

Quan trọng

Bạn có thể thấy thông báo về Pylance hoặc cải thiện hiệu suất trên Windows. Bạn có thể bỏ qua một cách an toàn mọi thông báo mà bạn thấy trong VS Code. Bạn sẽ không cần phải làm những việc đó.

Kiểm tra bộ chứa

  1. Nhấn Ctrl + ` để mở đầu cuối tích hợp trong Visual Studio Code nếu chưa mở.

  2. Lưu ý rằng dấu nhắc thiết bị đầu cuối có thể trông khác với lời nhắc thiết bị đầu cuối bình thường của bạn.

    nhắc thiết bị đầu cuối tích hợp VS code

  3. Chạy lệnh sau đây để đảm bảo đã cài đặt Python:

    python --version

    Đầu ra của thiết bị đầu cuối phải là phiên bản của Python được sử dụng trong bộ chứa.

Cài đặt quan hệ phụ thuộc dự án

  • Chạy lệnh sau đây trong thiết bị đầu cuối để cài đặt Flask quan hệ phụ thuộc mà bạn cần để chạy dự án:

    pip3 install --user -r requirements.txt

Chạy dự án

  1. Nhập lệnh sau đây trong thiết bị đầu cuối để bắt đầu dự án:

    python app.py

  2. Mở dự án trong trình duyệt bằng cách dẫn hướng đến http://127.0.0.1:5000.

    ảnh chụp màn hình của ứng dụng Bảng điều khiển Sản phẩm Python.

Công việc tuyệt vời! Bạn có một ứng dụng web Python với Flask chạy trên máy tính của bạn, và bạn có thể không biết những điều đó thậm chí là gì. Việc đó ổn! Anh không cần phải làm thế. Container sẽ chăm sóc việc thiết lập toàn bộ môi trường.

Trong phần tiếp theo, bạn sẽ tìm hiểu cách sử dụng tệp devcontainer.json để tự động hóa việc cài đặt phụ thuộc và tùy chỉnh VS Code cho dự án Python này.