Skip to main content

Создание PHP-проекта для GitHub Codespaces

Начало работы с проектом PHP в GitHub Codespaces путем создания настраиваемой конфигурации контейнера разработки.

Введение

В этом руководстве показано, как настроить пример проекта PHP для повторного использования данных.codespaces.setting-up-project-intro %}

Шаг 1. Открытие проекта в пространстве кода

  1. Войдите в GitHub.com, если вы еще этого не сделали.

  2. Перейдите к https://github.com/microsoft/vscode-remote-try-php.

  3. Нажмите кнопку "Использовать этот шаблон", а затем нажмите кнопку "Открыть" в пространстве кода.

    Снимок экрана: кнопка "Использовать этот шаблон" и раскрывающееся меню, развернутое для отображения параметра "Открыть в пространстве кода".

При создании пространства кода проект создается на удаленной виртуальной машине, выделенной для вас. По умолчанию контейнер для пространства кода имеет множество языков и сред выполнения, включая PHP. Он также включает общий набор инструментов, таких как Composer, XDebug, Apache, pecl, nvm, git, lynx и curl.

Вы можете настроить свое codespace, настроив количество виртуальных ЦП и ОЗУ, добавив файлы с точкой для персонализации вашей среды или изменив установленные инструменты и скрипты. Дополнительные сведения см. в разделе Настройка codespace.

GitHub Codespaces использует файл, вызываемый devcontainer.json для настройки контейнера разработки, используемого при работе в пространстве кода. Каждый репозиторий может содержать один или несколько devcontainer.json файлов, чтобы предоставить вам именно среду разработки, необходимую для работы с кодом в пространстве кода.

При запуске GitHub Codespaces использует devcontainer.json файл и все зависимые файлы, составляющие конфигурацию контейнера разработки, для установки средств и сред выполнения и выполнения других задач установки, необходимых проекту. Дополнительные сведения см. в разделе Основные сведения о контейнерах разработки.

Шаг 2. Добавление конфигурации контейнера разработки

Контейнер разработки по умолчанию или контейнер разработки для GitHub Codespaces позволит успешно работать в проекте PHP, например vscode-remote-try-php. Однако рекомендуется настроить собственный контейнер разработки для включения всех средств и сценариев, необходимых для проекта. Это обеспечит полностью воспроизводимую среду для всех пользователей GitHub Codespaces в репозитории.

Чтобы настроить репозиторий для использования пользовательского контейнера разработки, нужно создать один или несколько файлов devcontainer.json. Вы можете добавить их из предопределенного шаблона конфигурации в Visual Studio Codeили написать собственные. Дополнительные сведения о конфигурациях контейнеров разработки см. в разделе Основные сведения о контейнерах разработки.

  1. Перейдите к Visual Studio Code Command Palette (shift+Command+P CTRL SHIFT++P / ), а затем начните вводить "добавить разработку". Щелкните "Кодовые пространства": добавление файлов конфигурации контейнера разработки.

    Снимок экрана: палитра команд с введенными значениями "Добавить разработку" и "Codespaces: Add Dev Container Configuration Files" (Добавить файлы конфигурации контейнера разработки).

  2. Нажмите кнопку "Создать новую конфигурацию".

  3. В этом примере репозиторий шаблонов, из которого вы создали пространство кода, уже содержит конфигурацию контейнера разработки, поэтому отображается сообщение о том, что файл конфигурации уже существует. Мы перезаписаем существующий файл конфигурации, поэтому нажмите кнопку " Продолжить".

  4. Нажмите кнопку "Показать все определения".

    Снимок экрана: раскрывающийся список "Добавление файлов конфигурации контейнеров разработки" с различными параметрами, включая "Показать все определения".

  5. Введите php и щелкните PHP. Другие варианты доступны, если в проекте используются определенные инструменты. Например, PHP и MariaDB.

  6. Выберите версию PHP, которую вы хотите использовать для проекта. В этом случае выберите версию с меткой "(по умолчанию").

  7. Отображается список дополнительных компонентов, которые можно установить. Мы установим GitHub CLI, средство для взаимодействия с GitHub из командной строки. Чтобы установить это средство, введите и нажмите githubкнопку "ОКGitHub CLI"Сохранить значения по умолчанию".****

  8. Отображается сообщение о том, что файл конфигурации контейнера разработки уже существует. Нажмите кнопку "Перезаписать".

    Файл devcontainer.json создается и открывается в редакторе.

Сведения о настраиваемой конфигурации контейнера разработки

При просмотре в обозревателе Visual Studio Code вы увидите, что .devcontainer каталог был добавлен в корневой каталог репозитория проекта, devcontainer.json содержащего файл. Это основной файл конфигурации для пространств кода, созданных из этого репозитория.

devcontainer.json

Добавленный devcontainer.json файл будет содержать значения для nameсвойств и features свойствimage. Некоторые дополнительные свойства, которые могут оказаться полезными, включены, но закомментированы.

Файл будет выглядеть примерно так, в зависимости от выбранного изображения:

// For format details, see https://aka.ms/devcontainer.json. For config options, see the
// README at: https://github.com/devcontainers/templates/tree/main/src/php
{
  "name": "PHP",
  // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
  "image": "mcr.microsoft.com/devcontainers/php:1-8.2-bullseye",

  // Features to add to the dev container. More info: https://containers.dev/features.
  // "features": {},

  // Configure tool-specific properties.
  // "customizations": {},

  // Use 'forwardPorts' to make a list of ports inside the container available locally.
  "forwardPorts": [
    8080
  ],
  "features": {
    "ghcr.io/devcontainers/features/github-cli:1": {}
  }

  // Use 'postCreateCommand' to run commands after the container is created.
  // "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html"

  // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
  // "remoteUser": "root"
}
  • имя. Вы можете присвоить контейнеру разработки любое нужное имя. Предоставляется значение по умолчанию.
  • изображение: имя образа в реестре контейнеров (DockerHub, GitHub Container registryили Реестр контейнеров Azure), которое будет использоваться для создания контейнера разработки для пространства кода.
  • функции: список одного или нескольких объектов, каждый из которых ссылается на одну из доступных функций контейнера разработки. Функции являются автономными, общими единицами кода установки и конфигурации контейнера разработки. Они предоставляют простой способ добавления дополнительных средств, среды выполнения или библиотеки в контейнер разработки. Вы можете добавлять функции в VS Code или в редакторе devcontainer.json на GitHub. Дополнительные сведения см. на вкладке Visual Studio Code или веб-браузера в Добавление функций в файл devcontainer.json.
  • ForwardPorts: все порты, перечисленные здесь, будут перенаправлены автоматически. Дополнительные сведения см. в разделе Переадресация портов в вашем codespace.
  • postCreateCommand: используйте это свойство для выполнения команд после создания пространства кода. Это может быть отформатировано как строка (как описано выше), массив или объект. Дополнительные сведения см. в спецификации контейнеров разработки на веб-сайте "Контейнеры разработки".
  • настройки. Это свойство позволяет настраивать определенное средство или службу при использовании для работы в пространстве кода. Например, можно настроить определенные параметры и расширения для VS Code. Дополнительные сведения см. в разделе "Поддержка средств и служб " на веб-сайте "Контейнеры разработки".
  • remoteUser: по умолчанию вы работаете в качестве пользователя vscode, но при необходимости его можно установить в корневой каталог. Полный список доступных свойств см . в спецификации контейнеров разработки на веб-сайте "Контейнеры разработки".

Дополнительные файлы конфигурации контейнера разработки

Если вы знакомы с Docker, вы можете использовать Dockerfile или Docker Compose, чтобы настроить среду пространства кода в дополнение к файлу devcontainer.json . Это можно сделать, добавив файлы Dockerfile compose.yaml вместе с файлом devcontainer.json . Дополнительные сведения см. в разделе "Использование образов,Dockerfiles" и Docker Compose на веб-сайте "Контейнеры разработки".

Шаг 3. Изменение файла devcontainer.json

После добавления конфигурации контейнера разработки и получения базового представления о том, как все устроено, теперь можно внести изменения для дальнейшей настройки среды. В этом примере вы добавите свойства, которые будут:

  • Запустите composer installпосле создания контейнера разработки, чтобы установить зависимости, перечисленные в composer.json файле.
  • Автоматическое установка расширения VS Code в этом пространстве кода.
  1.        `devcontainer.json` В файле удалите две закомментированные строки о функциях:
    
    // Features to add to the dev container. More info: https://containers.dev/features.
    // "features": {},
    
  2. Измените customizations свойство следующим образом, чтобы установить расширение Composer.

    JSONC
    // Configure tool-specific properties.
    "customizations": {
      // Configure properties specific to VS Code.
      "vscode": {
        "extensions": [
          "ikappas.composer"
        ]
      }
    },
    
  3. Добавьте запятую после features свойства.

    "features": {
      "ghcr.io/devcontainers/features/github-cli:1": {}
    },
    
  4. Раскомментируйте postCreateCommand свойство и добавьте в конец текст, чтобы выполнить команду composer install , если composer.json файл существует. (Существующие команды — это лишь некоторые процедуры установки, позволяющие Apache получать доступ к файлам в рабочей области.)

    JSONC
    // Use 'postCreateCommand' to run commands after the container is created.
    "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html; if [ -f composer.json ];then composer install;fi"
    

Теперь devcontainer.json файл должен выглядеть примерно так, в зависимости от выбранного изображения:

// For format details, see https://aka.ms/devcontainer.json. For config options, see the
// README at: https://github.com/devcontainers/templates/tree/main/src/php
{
  "name": "PHP",
  // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
  "image": "mcr.microsoft.com/devcontainers/php:1-8.2-bullseye",

  // Configure tool-specific properties.
  "customizations": {
    // Configure properties specific to VS Code.
    "vscode": {
      "extensions": [
        "ikappas.composer"
      ]
    }
  },

  // Use 'forwardPorts' to make a list of ports inside the container available locally.
  "forwardPorts": [
    8080
  ],
  "features": {
    "ghcr.io/devcontainers/features/github-cli:1": {}
  },

  // Use 'postCreateCommand' to run commands after the container is created.
  "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html; if [ -f composer.json ];then composer install;fi"

  // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
  // "remoteUser": "root"
}
  1. Сохранение изменений.

  2. Перейдите к VS Code Command Palette (shift+Command+P CTRL SHIFT++P / ), а затем начните вводить "перестроить". Щелкните Codespaces: Перестроить контейнер.

    Снимок экрана: палитра команд с поиском "перестроить контейнер" и параметром "Codespace: Перестроить контейнер" в раскрывающемся списке.

    Совет

    Иногда может потребоваться выполнить полную перестроение, чтобы очистить кэш и перестроить контейнер с помощью свежих образов. Дополнительные сведения см. в разделе Перестроение контейнера в пространстве кода. Прежде чем вы зафиксируете изменения в репозитории, выполните повторную сборку внутри codespace, чтобы гарантировать правильное внесение изменений. Если что-то приведет к сбою, вы будете помещены в codespace с контейнером восстановления, который можно собрать повторно, чтобы сохранить настройку контейнера.

    После повторного создания контейнера разработки, и пространство кода становится доступным снова, postCreateCommand будет запущено, установка зависимостей Composer и расширение Composer будет доступно для использования.

Шаг 4. Запуск приложения

В предыдущем разделе вы изменили postCreateCommand набор пакетов с помощью composer install команды. После установки зависимостей можно запустить приложение. Однако в этом сценарии сначала необходимо изменить порты, которые будет прослушивать Apache. Мы перенаправляем порт 8080, поэтому мы покажем Apache использовать этот порт, а не порт 80 по умолчанию.

  1. В терминале пространства кода введите:

    Shell
    sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf
    
  2. Затем введите:

    Shell
    sudo sed -i 's/<VirtualHost \*:80>/ServerName 127.0.0.1\n<VirtualHost \*:8080>/' /etc/apache2/sites-enabled/000-default.conf
    
  3. Затем запустите Apache с помощью средства управления:

    Shell
    apache2ctl start
    
  4. При запуске проекта в правом нижнем углу VS Codeпоявится сообщение уведомления "toast", указывающее, что приложение доступно через переадресованный порт. Чтобы просмотреть запущенное приложение, нажмите кнопку "Открыть в браузере".

Шаг 5. Фиксация изменений

Когда вы внесли изменения в пространство кода либо новый код, либо изменения конфигурации, вы хотите зафиксировать изменения. Фиксация изменений конфигурации в репозитории гарантирует, что любой пользователь, создающий пространство кода из этого репозитория, имеет ту же конфигурацию. Любые настройки, такие как добавление расширений VS Code, будут доступны всем пользователям.

В этом руководстве вы создали пространство кода из репозитория шаблонов, поэтому код в вашем пространстве кода еще не хранится в репозитории. Вы можете создать репозиторий, публикуя текущую ветвь в GitHub.

Дополнительные сведения см. в разделе Использование системы управления версиями в codespace.

Следующие шаги

Теперь вы сможете добавить настраиваемую конфигурацию контейнера разработки в собственный проект PHP.

Ниже приведены дополнительные ресурсы для более сложных сценариев.