Desenvolver uma extensão de ferramenta

Uma extensão de ferramenta é a principal maneira pela qual os usuários interagem com o Windows Admin Center para gerenciar uma conexão, como um servidor ou cluster. Quando você clica em uma conexão na tela inicial do Windows Admin Center e se conecta, você verá uma lista de ferramentas no painel de navegação esquerdo. Quando você clica em uma ferramenta, a extensão da ferramenta é carregada e exibida no painel direito.

Quando uma extensão de ferramenta é carregada, ela pode executar chamadas WMI ou scripts do PowerShell em um servidor ou cluster de destino e exibir informações na interface do usuário ou executar comandos com base na entrada do usuário. As extensões de ferramentas definem para quais soluções devem ser exibidas, resultando em um conjunto diferente de ferramentas para cada solução.

Note

Não está familiarizado com os diferentes tipos de extensão? Saiba mais sobre a arquitetura de extensibilidade e os tipos de extensão.

Prepare seu ambiente

Se ainda não o fez, prepare o seu ambiente instalando as dependências e os pré-requisitos globais necessários para todos os projetos.

Criar uma nova extensão de ferramenta com o SDK do Windows Admin Center

Depois de ter todas as dependências instaladas, você estará pronto para criar sua nova extensão de ferramenta. Crie ou navegue até uma pasta que contém os ficheiros do seu projeto, abra uma linha de comando e defina essa pasta como o diretório de trabalho. Utilizando o SDK do Windows Admin Center que foi instalado anteriormente, crie uma nova extensão com a seguinte sintaxe:

wac create --company "{!Company Name}" --tool "{!Tool Name}" --version latest
Value Explanation Example
{!Company Name} Nome da sua empresa (com espaços) Contoso Inc
{!Tool Name} O nome da sua ferramenta (com espaços) Manage Foo Works

Aqui está um exemplo de uso:

wac create --company "Contoso Inc" --tool "Manage Foo Works" --version latest

Ao usar o Windows Admin Center SDK versões 6.0.0 e superiores, também pode criar extensões de ferramentas baseadas no React. Crie uma nova extensão de ferramenta baseada em React usando a seguinte sintaxe:

wac create-react --company "{!Company Name}" --tool "{!Tool Name}" --version latest
Value Explanation Example
{!Company Name} Nome da sua empresa (com espaços) Contoso Inc
{!Tool Name} O nome da sua ferramenta (com espaços) Manage Foo Works

Eis um exemplo:

wac create-react --company "Contoso Inc" --tool "Manage Foo Works" --version latest

Isso cria uma nova pasta dentro do diretório de trabalho atual usando o nome especificado para sua ferramenta, copia todos os arquivos de modelo necessários para seu projeto e configura os arquivos com o nome da empresa e da ferramenta.

Note

A flag --version neste comando especifica qual versão do SDK do Windows Admin Center pretende direcionar. Leia sobre como direcionar para uma versão diferente do Windows Admin Center SDK para manter sua extensão atualizada com as últimas alterações do SDK e da plataforma.

Em seguida, mude o diretório para a pasta que acabou de ser criada e, depois, instale as dependências locais necessárias executando o seguinte comando:

npm install

Quando isso estiver concluído, você configurou tudo o que precisa para carregar a sua nova extensão no Windows Admin Center.

Adicionar conteúdo à sua extensão

Agora que criou uma extensão com o SDK do Windows Admin Center, está pronto para personalizar o conteúdo. Veja estes guias para exemplos do que pode fazer:

Ainda mais exemplos podem ser encontrados no nosso Guia do Desenvolvedor. O Guia do Desenvolvedor é uma extensão de solução totalmente funcional que pode ser carregada lateralmente no Windows Admin Center e contém uma coleção rica de funcionalidades e exemplos de ferramentas que o utilizador pode explorar e utilizar na sua própria extensão.

Habilite a extensão Guia do Desenvolvedor na página Avançado das configurações do Windows Admin Center.

Personalize o ícone da sua extensão

Você pode personalizar o ícone que mostra sua extensão na lista de ferramentas. Para fazer isso, modifique todas as entradas icon em manifest.json para a sua extensão.

"icon": "{!icon-uri}",
Value Explanation Exemplo URI
{!icon-uri} A localização do recurso de ícone assets/foo-icon.svg

NOTA: Atualmente, os ícones personalizados não são visíveis ao carregar lateralmente sua extensão no modo de desenvolvimento. Como solução alternativa, remova o conteúdo da target seguinte forma:

"target": "",

Essa configuração só é válida para carregamento lateral no modo dev, por isso é importante preservar o valor contido em target e restaurá-lo antes de publicar a sua extensão.

Construa e instale em modo de desenvolvedor a sua extensão

Em seguida, compile e instale lateralmente a sua extensão no Windows Admin Center. Abra uma janela de comandos e mude o diretório para o seu diretório de origem.

  • Para construir e servir a extensão, execute o seguinte comando:

    npm run build
    npm start
    

Mantém este terminal a funcionar.

Por predefinição, a extensão é carregada localmente na porta 4200. Para alterar a porta, modifica os ficheiros package.json e appsettings.json da tua extensão. Certifica-te de que não usas a porta onde o Windows Admin Center está a correr.

Para instalar o seu projeto numa instância local do Windows Admin Center para testes, anexe o projeto servido localmente.

  • Iniciar o Windows Admin Center em um navegador da Web

  • Abra o depurador (F12)

  • Abra a Consola e escreva o seguinte comando para sideload com localhost:

    MsftSme.sideLoad("http://localhost:4200")
    

    Se seguiu as instruções para a instalação manual através de um FQDN, abra a consola e introduza o seguinte comando:

    MsftSme.sideLoad("http://<FQDN>:4200")
    
  • Atualize o navegador web.

O seu projeto aparece agora na lista de Ferramentas com (sideloaded) ao lado do nome.