Crie o seu primeiro suplemento do painel de tarefas do Project

Neste artigo, você passará pelo processo de criação de um suplemento do painel de tarefas do Project.

Pré-requisitos

• Node.js (a versão mais recente de LTS). Visite o siteNode.js para transferir e instalar a versão certa para o seu sistema operativo.

• A versão mais recente do Yeoman e do Yeoman gerador de Suplementos do Office. Para instalar essas ferramentas globalmente, execute o seguinte comando por meio do prompt de comando.

  npm install -g yo generator-office
  

  Observação

  Mesmo se você já instalou o gerador Yeoman, recomendamos atualizar seu pacote para a versão mais recente do npm.

• Office conectado a uma assinatura Microsoft 365 (incluindo o Office na web).

  Observação

  Se ainda não tiver o Office, poderá qualificar-se para uma subscrição de programador Microsoft 365 E5 através do Programa para Programadores do Microsoft 365. Para obter detalhes, consulte as FAQ. Em alternativa, pode inscrever-se numa avaliação gratuita de um mês ou comprar um plano do Microsoft 365.

• Project 2016 ou posterior no Windows

Criar o suplemento

Execute o comando a seguir para criar um projeto de suplemento usando o gerador Yeoman. Será adicionada uma pasta que contém o projeto ao diretório atual.

yo office

Quando solicitado, forneça as informações a seguir para criar seu projeto de suplemento.

• Escolha um tipo de projeto:Office Add-in Task Pane project
• Escolha um tipo de script:JavaScript
• Qual é o nome do seu suplemento?My Office Add-in
• Que aplicação cliente do Office pretende suportar?Project

Depois que você concluir o assistente, o gerador criará o projeto e instalará os componentes Node de suporte.

Explore o projeto

O projeto de suplemento que você criou com o gerador Yeoman contém um código de exemplo para um suplemento básico do painel de tarefas.

• O arquivo ./manifest.xml no diretório raiz do projeto define as configurações e os recursos do suplemento.
• O arquivo ./src/taskpane/taskpane.html contém a marcação HTML do painel de tarefas.
• O arquivo ./src/taskpane/taskpane.css contém o CSS que é aplicado ao conteúdo no painel de tarefas.
• O arquivo ./src/taskpane/taskpane.js contém o código da API JavaScript do Office que facilita a interação entre o painel de tarefas e o aplicativo cliente do Office. Neste início rápido, o código define o campo Name e o campo Notes da tarefa selecionada de um projeto.

Experimente

1. Navegue até a pasta raiz do projeto.

   cd "My Office Add-in"
   

2. Conclua as etapas a seguir para iniciar o servidor Web local e fazer o sideload do seu suplemento.

   Observação

   • Os Suplementos do Office devem utilizar HTTPS e não HTTP, mesmo quando estiver a desenvolver. Se lhe for pedido para instalar um certificado depois de executar um dos seguintes comandos, aceite o pedido para instalar o certificado que o gerador Yeoman fornece. Você também pode executar o prompt de comando ou terminal como administrador para que as alterações sejam feitas.

   • Se esta for a primeira vez que desenvolve um Suplemento do Office no seu computador, poderá ser-lhe pedido na linha de comandos para conceder ao Microsoft Edge WebView uma isenção de loopback ("Permitir loopback localhost para o Microsoft Edge WebView?"). Quando lhe for pedido, introduza Y para permitir a isenção. Tenha em atenção que precisará de privilégios de administrador para permitir a isenção. Uma vez permitido, não lhe deverá ser pedida uma isenção quando carregar os Suplementos do Office no futuro (a menos que remova a isenção do seu computador). Para saber mais, consulte "Não é possível abrir este suplemento a partir do localhost" ao carregar um Suplemento do Office ou ao utilizar o Fiddler.

     

   • Quando utiliza o gerador Yeoman pela primeira vez para desenvolver um Suplemento do Office, o seu browser predefinido abre uma janela onde lhe será pedido para iniciar sessão na sua conta do Microsoft 365. Se não for apresentada uma janela de início de sessão e encontrar um erro de tempo limite de sideload ou início de sessão, execute atk auth login m365.

   • Para testar o suplemento no Project, execute o seguinte comando no diretório de raiz do projeto. Esta ação inicia o servidor Web local e efetua sideloads do seu suplemento.

     npm start
     

   Se o seu suplemento não carregar automaticamente em sideload, siga as instruções em Sideload Suplementos do Office no Windows para carregar manualmente o suplemento no Project.

3. Em Project, crie um plano de projeto simples.

4. Selecione uma única tarefa dentro do projeto.

5. Na parte inferior do painel de tarefas, escolha o link Executar para renomear a tarefa selecionada e adicionar anotações à tarefa selecionada.

   

6. Quando quiser parar o servidor Web local e desinstalar o suplemento, siga as instruções aplicáveis:

   • Para parar o servidor, execute o seguinte comando. Se tiver utilizado npm start, o seguinte comando também desinstala o suplemento.

     npm stop
     

   • Se tiver carregado manualmente o suplemento em sideload, consulte Remover um suplemento sideloaded.

Solução de problemas

• Certifique-se de que o seu ambiente está pronto para o desenvolvimento do Office ao seguir as instruções em Configurar o seu ambiente de desenvolvimento.

• O passo automático npm install que o Yo Office executa pode falhar. Se vir erros ao tentar executar npm start, navegue para a pasta do projeto recentemente criada numa linha de comandos e execute npm installmanualmente . Para obter mais informações sobre o Yo Office, consulte Criar projetos de Suplementos do Office com o Yeoman Generator.

• Poderá ver avisos gerados ao executar npm install para o gerador Yeoman ou para o projeto. Na maioria dos casos, pode ignorar estes avisos com segurança. Por vezes, as dependências são preteridas e as respetivas substituições não são suportadas por outros pacotes dos quais o projeto depende. Se quiser resolve estes avisos, utilize a npm-check-updates ferramenta .

  • Na linha de comandos no diretório do projeto de raiz, execute npm i -g npm-check-updates. Esta ação instala a ferramenta globalmente.
  • Execute ncu -u. Isto fornece um relatório de todos os pacotes e de que versões serão atualizados.
  • Execute npm install para atualizar todos os pacotes.

  Para obter mais informações sobre avisos ao executar npm installo , consulte Avisos e dependências no Node.js e npm world.

• Se não vir o botão de suplemento no friso (por exemplo, Mostrar Painel de Tarefas), selecione o botão Suplementos no separador dofriso Base e, em seguida, selecione o suplemento de teste.

Próximas etapas

Parabéns, você criou com êxito um suplemento do painel de tarefas do Project! Em seguida, saiba mais sobre os recursos de um suplemento do Project e explore os cenários comuns.

Confira também

• Visão geral da plataforma Suplementos do Office
• Desenvolver Suplementos do Office
• Principais conceitos dos Suplementos do Office
• Exemplos de código do suplemento do Project
• Usando o Visual Studio Code para publicar