Создание первой надстройки области задач Project

В этой статье вы ознакомитесь с процессом создания надстройки для области задач Project.

Необходимые компоненты

  • Project 2016 или более поздней версии для Windows

Создание надстройки

Выполните следующую команду, чтобы создать проект надстройки с помощью генератора Yeoman. Папка, содержащая проект, будет добавлена в текущий каталог.

yo office

Примечание.

При выполнении команды yo office может появиться запрос о политиках сбора данных генератора Yeoman и средств CLI надстройки Office. Используйте предоставленные сведения, чтобы ответить на запросы подходящим образом.

При появлении запроса предоставьте следующую информацию для создания проекта надстройки.

  • Выберите тип проекта:Office Add-in Task Pane project
  • Выберите тип скрипта:JavaScript
  • Как вы хотите назвать надстройку?My Office Add-in
  • Какое клиентское приложение Office вы хотите поддерживать?Project

Запросы и ответы для генератора Yeoman в интерфейсе командной строки.

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

Знакомство с проектом

Проект надстройки, который вы создали с помощью генератора Yeoman, содержит образец кода для простой надстройки области задач.

  • Файл ./manifest.xml в корневом каталоге проекта определяет настройки и возможности надстройки.
  • Файл ./src/taskpane/taskpane.html содержит разметку HTML для области задач.
  • Файл ./src/taskpane/taskpane.css содержит код CSS, который применяется к содержимому области задач.
  • Файл ./src/taskpane/taskpane.js содержит код API JavaScript для Office, который упрощает взаимодействие между областью задач и клиентским приложением Office. В этом кратком руководстве код Name настраивает поле Notes и поле выбранной задачи проекта.

Проверка

  1. Перейдите к корневой папке проекта.

    cd "My Office Add-in"

  2. Выполните указанные ниже действия, чтобы запустить локальный веб-сервер и загрузить неопубликованную надстройку.

    Примечание.

    • Надстройки Office должны использовать HTTPS, а не HTTP, даже во время разработки. Если после выполнения одной из следующих команд вам будет предложено установить сертификат, примите запрос на установку сертификата, который предоставляет генератор Yeoman. Кроме того, вам может потребоваться запустить командную строку или терминал с правами администратора, чтобы внести изменения.

    • Если вы впервые разрабатываете надстройку Office на компьютере, в командной строке может появиться запрос на предоставление Microsoft Edge WebView исключения замыкания на себя ("Разрешить замыкания на себя локальный узел для Microsoft Edge WebView?"). При появлении запроса введите Y , чтобы разрешить исключение. Обратите внимание, что вам потребуются права администратора, чтобы разрешить исключение. После этого вам не следует запрашивать исключение при загрузке неопубликованных надстроек Office в будущем (если вы не удалите исключение с компьютера). Дополнительные сведения см. в разделе "Не удается открыть эту надстройку из localhost" при загрузке надстройки Office или с помощью Fiddler.

      Запрос в командной строке, чтобы разрешить Microsoft Edge WebView исключения замыкания на себя.

    • При первом использовании генератора Yeoman для разработки надстройки Office браузер по умолчанию открывает окно, в котором вам будет предложено войти в учетную запись Microsoft 365. Если окно входа не отображается и возникает ошибка загрузки неопубликованных приложений или времени ожидания входа, выполните команду atk auth login m365.

    • Чтобы протестировать надстройку Project, выполните следующую команду в корневом каталоге проекта. Это запустит локальный веб-сервер и загрузит неопубликованную надстройку.

      npm start

    Если надстройка не загружает неопубликованное приложение автоматически, следуйте инструкциям в разделе Загрузка неопубликованных надстроек Office в Windows, чтобы вручную загрузить надстройку в Project.

  3. В Project создайте простой план проекта.

  4. Выберите отдельную задачу в проекте.

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

    Приложение Project с загруженной надстройкой области задач.

  6. Если вы хотите остановить локальный веб-сервер и удалить надстройку, следуйте применимым инструкциям:

    • Чтобы остановить сервер, выполните следующую команду. Если вы использовали npm start, следующая команда также удаляет надстройку.

      npm stop

    • Если вы вручную загрузили неопубликованную надстройку, см. статью Удаление неопубликоченной надстройки.

Устранение неполадок

  • Автоматическое npm install выполнение шага Yo Office может завершиться ошибкой. Если при попытке запустить npm startвы видите ошибки , перейдите в только что созданную папку проекта в командной строке и вручную запустите npm install. Дополнительные сведения о Yo Office см. в статье Создание проектов надстроек Office с помощью генератора Yeoman.

  • При запуске npm install генератора Yeoman или проекта могут отображаться предупреждения. В большинстве случаев эти предупреждения можно игнорировать. Иногда зависимости становятся устаревшими, а их замена не поддерживается другими пакетами, от которых зависит проект. Если вы хотите устранить эти предупреждения, используйте npm-check-updates средство .

    • В командной строке в корневом каталоге проекта выполните команду npm i -g npm-check-updates. При этом средство устанавливается глобально.
    • Запустите ncu -u. Он предоставляет отчет обо всех пакетах и о том, какие версии они будут обновлены.
    • Выполните команду npm install , чтобы обновить все пакеты.

    Дополнительные сведения о предупреждениях при запуске npm installсм. в разделе Предупреждения и зависимости в мире Node.js и npm.

  • Если кнопка надстройки не отображается на ленте (например, Показать область задач), нажмите кнопку Надстройки на вкладке Главная ленты, а затем выберите тестовую надстройку.

Дальнейшие действия

Поздравляем! Вы успешно создали надстройку области задач Project! Следующим шагом узнайте больше о возможностях надстроек Project и изучите распространенные сценарии.

Надстройки Project

См. также

  • Last updated on