Como incluir código em documentos - Contributor guide (2023)

Há várias maneiras diferentes de capturas de tela para incluir código em um artigo publicado no Microsoft Learn:

• Elementos individuais (palavras) dentro de uma linha.

  Veja um exemplo de estilo de code.

  Use o formato de código ao fazer referência a parâmetros nomeados e variáveis em um bloco de código próximo em seu texto. O formato de código também pode ser usado para propriedades, métodos, classes e palavras-chave de linguagem. Para obter mais informações, confira Elementos de código mais adiante neste artigo.

• Blocos de código no arquivo Markdown do artigo.

   ```csharp public static void Log(string message) { _logger.LogInformation(message); } ```

  Use blocos de código embutidos quando não for conveniente usar a exibição de código por referência a um arquivo de código. Para obter mais informações, confira Blocos de código posteriormente neste artigo.

• Blocos de código por referência a um arquivo de código no repositório local.

  :::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" range="2-24,26":::

  Para obter mais informações, confira o tópico Referências a snippet no repositório mais adiante neste artigo.

• Blocos de código por referência a um arquivo de código em outro repositório.

  :::code language="csharp" source="~/samples-durable-functions/samples/csx/shared/Location.csx" highlight="2,5":::

  Para obter mais informações, confira o tópico Referências a snippet fora do repositório mais adiante neste artigo.

• Blocos de código que permitem ao usuário executar o código no navegador.

  :::code source="PowerShell.ps1" interactive="cloudshell-powershell":::

  Para obter mais informações, confira o tópico Snippets de código interativos mais adiante neste artigo.

Além de explicar o Markdown para cada uma dessas maneiras de incluir código, o artigo fornece algumas diretrizes gerais para todos os blocos de código.

Elementos de código

Um "elemento de código" é uma palavra-chave, nome de classe, nome de propriedade etc. de uma linguagem de programação. Nem sempre é óbvio o que é qualificado como código. Por exemplo, os nomes de pacote do NuGet devem ser tratados como código. Em caso de dúvida, confira Diretrizes de formatação de texto.

Estilo de código embutido

Para incluir um elemento de código em um texto de artigo, coloque-o entre acentos graves (`) para indicar o estilo de código.O estilo de código embutido não deve usar o formato de acento grave triplo.

Quando um artigo seja localizado (traduzido em outros idiomas), o texto estilizado como código é deixado sem tradução. Se você quiser impedir a localização sem usar o estilo de código, confira Cadeias de caracteres não localizadas.

Estilo negrito

Alguns guias de estilo mais antigos especificam negrito para código embutido. O negrito é uma boa opção quando o estilo de código é tão intrusivo que pode comprometer a legibilidade. Por exemplo, uma tabela Markdown cheia de elementos de código pode ficar muito confusa com estilos de código em todo lugar. Se você optar por usar o estilo negrito, use sintaxe de cadeias de caracteres não localizadas para garantir que o código não seja localizado.

Links

Um link para a documentação de referência pode ser mais útil do que o formato do código em alguns contextos. Se você usar um link, não aplique o formato do código ao texto do link. A aplicação de estilo de código a um link pode obscurecer o fato de que o texto é um link.

Se você usar um link e se referir ao mesmo elemento posteriormente no mesmo contexto, torne as instâncias subsequentes formato de código em vez de links. Por exemplo:

The first reference to <xref:System.CommandLine> in this text is a link.Subsequent references to `System.CommandLine` can be in code style.

Renderizado:

A primeira referência a System.CommandLine nesse texto é um link.As referências subsequentes ao System.CommandLine podem estar no estilo de código.

Espaços reservados

Se você quiser que o usuário substitua uma seção do código exibido pelos seus próprios valores, use o texto do espaço reservado marcado por colchetes angulares. Por exemplo:

az group delete -n <ResourceGroupName>

(Video) How to Write Godot's Code Reference (contributor tutorial)

Você pode notar que os colchetes devem ser removidos ao substituir valores reais. O Guia de Estilo de Escrita da Microsoft pede itálico, que você pode formatar dentro do código em linha entre colchetes angulares:

<ResourceGroupName> é o grupo de recursos onde...

Chaves { } não são recomendadas para uso como espaço reservados sintáticos. Elas podem ser confundidas com a mesma notação usada em texto substituível, cadeias de caracteres de formato, interpolação de cadeia de caracteres, modelos de texto e constructos de programação semelhantes.

Os nomes de espaço reservado podem ser separados por hifens ("kebab case"), com sublinhados ou não separados (caso Pascal). O caso Kebab pode gerar erros de sintaxe e sublinhados podem estar em conflito com outros sublinhados. Letras todas maiúsculas podem entrar em conflito com constantes nomeadas em muitos idiomas, embora também possam chamar a atenção para o nome do espaço reservado.

<Resource-Group-Name> ou <ResourceGroupName>

Blocos de códigos

A sintaxe para incluir o código em um documento depende de onde o código está localizado:

• No arquivo Markdown do artigo
• Em um arquivo de código no mesmo repositório
• Em um arquivo de código em um repositório diferente

Veja a seguir diretrizes que se aplicam aos três tipos de blocos de código:

• Capturas de tela
• Automatizar a validação do código
• Realçar as principais linhas de código
• Evitar barras de rolagem horizontal
• Identificar claramente código ruim

Capturas de tela

Todos os métodos listados na seção anterior resultam em blocos de código utilizáveis:

• É possível copiar e colar conteúdo desses blocos.
• Eles são indexados por mecanismos de pesquisa.
• Eles estão acessíveis a leitores de tela.

Esses são apenas alguns dos motivos pelos quais as capturas de tela do IDE não são recomendadas como um método de inclusão de código em um artigo. Use capturas de tela do IDE para código somente se você estiver mostrando algo sobre o próprio IDE, como o IntelliSense. Não use capturas de tela apenas para mostrar a colorização e o uso de realce.

Validação de código

Alguns repositórios implementaram processos que compilam automaticamente todo o código de exemplo para verificar se há erros. O repositório do .NET faz isso. Para saber mais, confira Contribuição no repositório .NET.

Se você estiver incluindo blocos de código de outro repositório, trabalhe com os proprietários em uma estratégia de manutenção para o código para que o código incluído não seja interrompido nem desatualizado conforme novas versões das bibliotecas usadas pelo código forem enviadas.

Realçar

Geralmente, os snippets de código incluem mais código do que o necessário para fornecer contexto. Isso ajuda na legibilidade ao destacar as linhas principais que você está focando no snippet, como neste exemplo:

Não é possível realçar código ao incluí-lo no arquivo Markdown do artigo. Ele funciona apenas para snippets de código incluídos por referência a um arquivo de código.

Barras de rolagem horizontal

Quebre linhas longas para evitar barras de rolagem horizontal. As barras de rolagem em blocos de código dificultam a leitura do código. Elas são especialmente problemáticos em blocos de código mais longos, em que pode ser impossível ver a barra de rolagem e a linha que você deseja ler ao mesmo tempo.

Uma boa prática para minimizar as barras de rolagem horizontal em blocos de código é dividir as linhas de código com mais de 85 caracteres. Mas tenha em mente que a presença ou a ausência de uma barra de rolagem não é o único critério de legibilidade. Se usar uma quebra de linha antes do 85º caractere prejudicar a legibilidade ou a praticidade para se copiar/colar, sinta-se à vontade para passar de 85.

Identificar claramente código ruim

Em alguns cenários, é útil apontar padrões de codificação que devem ser evitados, por exemplo:

• Código que causará um erro do compilador em caso de tentativa.
• Código que será compilado corretamente, mas não é recomendado.

Para estes casos:

• Explique o erro nos comentários de código e no texto do artigo.

  Os leitores geralmente ignoram o texto do artigo e observam apenas o código, portanto, não é suficiente explicar o erro apenas no texto do artigo. Também não é suficiente explicar o erro apenas em comentários de código, porque esse conteúdo não é localizado.

• Considere comentar o código se ele causar um erro do compilador.

  O código comentado não interromperá o sistema de CI (integração contínua) se o repositório do artigo tiver um agora ou implementar um no futuro.

Para ver um exemplo de como apresentar um código que não é recomendado, confira Exemplo de uso de rune: alterando o caso de letra. Neste exemplo, os conselhos para evitar isso são até mesmo integrados ao próprio código, pois o nome do método C# é ConvertToUpperBadExample.

Blocos de código embutido

Use blocos de código embutidos somente quando não for conveniente usar a exibição de código por referência a um arquivo de código. Em geral, o código embutido é mais difícil de se testar e manter atualizado em comparação com um arquivo de código que faz parte de um projeto completo. E o código embutido pode omitir o contexto que poderia ajudar o desenvolvedor a entender e usar o código. Essas considerações se aplicam principalmente a linguagens de programação. Blocos de código embutidos também podem ser usados para saídas e entradas (como o JSON), linguagens de consulta (como o SQL) e linguagens de script (como o PowerShell).

Há duas maneiras de indicar se uma seção de texto em um arquivo de artigo é um bloco de código: isolando-a entre acentos graves triplos (```) ou recuando-a. O isolamento é preferencial porque permite especificar o idioma. Evite usar recuos porque é uma prática muito propensa a erros, podendo ainda dificultar a compreensão da sua intenção no código por outros editores quando outras pessoas precisarem editar seu artigo.

Os indicadores de idioma são colocados imediatamente após os acentos graves triplos de abertura, como no exemplo a seguir:

Markdown:

 ```json { "aggregator": { "batchSize": 1000, "flushTimeout": "00:00:30" } } ```

Renderizado:

{ "aggregator": { "batchSize": 1000, "flushTimeout": "00:00:30" }}

Para saber mais sobre os valores que você pode usar como indicadores de idioma, confira Nomes e aliases de idiomas.

Se você usar uma palavra de idioma ou de linguagem não compatível após os acentos graves triplos (```), essa palavra aparecerá na barra de título da seção de código na página renderizada. Sempre que possível, use um indicador de idioma ou de ambiente em seus blocos de código embutido.

Referências a snippet no repositório

A maneira preferencial de incluir snippets de código para linguagens de programação em documentos é por referência a um arquivo de código. Esse método fornece a capacidade de realçar linhas de código e disponibiliza o contexto mais amplo do snippet no GitHub para os desenvolvedores usarem. Você pode incluir código usando o formato de dois-pontos triplos (:::) manualmente ou em Visual Studio Code com a ajuda do Pacote de Criação do Learn.

1. No Visual Studio Code, pressione Alt + M ou Option + M e selecione Snippet.
2. Depois que Snippet for selecionado, será solicitada uma Pesquisa Completa, uma Pesquisa com Escopo ou uma Referência de Repositório Cruzado. Para pesquisar localmente, selecione Pesquisa Completa.
3. Insira um termo de pesquisa para localizar o arquivo. Depois de encontrar o arquivo, selecione-o.
4. Em seguida, selecione uma opção para determinar quais linhas de código devem ser incluídas no snippet. As opções são: ID, Range e Nenhuma.
5. Com base na sua seleção da etapa 4, forneça um valor, se necessário.

Exibir o arquivo de código completo:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs":::

Exibir parte de um arquivo de código, especificando os números de linha:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" range="2-24,26":::

Exibir parte de um arquivo de código, especificando um nome de snippet de código:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" id="snippet_Create":::

As seções a seguir explicam esses exemplos:

• Usar um caminho relativo para o arquivo de código
• Incluir apenas os números de linha selecionados
• Fazer referência a um snippet nomeado
• Realçar linhas selecionadas

Para obter mais informações, confira o tópico Referências a sintaxe do snippet mais adiante neste artigo.

Caminho para o arquivo de código

Exemplo:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" range="2-24,26":::

O exemplo é do repositório de documentos do ASP.NET, arquivo de artigo aspnetcore/data/ef-mvc/crud.md. O arquivo de código é referenciado por um caminho relativo para aspnetcore/data/ef-mvc/intro/samples/cu/Controllers/StudentsController.cs no mesmo repositório.

Números de linha selecionados

Exemplo:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" range="2-24,26":::

Esse exemplo exibe apenas as linhas 2-24 e 26 do arquivo de código StudentController.cs.

Opte pelo uso de snippets de código nomeados em vez de números de linha embutidos em código, conforme explicado na próxima seção.

Snippet nomeado

Exemplo:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" id="snippet_Create":::

Use apenas letras e sublinhados para o nome.

O exemplo exibe a seção snippet_Create do arquivo de código. O arquivo de código para este exemplo tem marcas de snippet em comentários no código C#:

// code excluded from the snippet// <snippet_Create>// code included in the snippet// </snippet_Create>// code excluded from the snippet

Os trechos de código nomeados podem ser aninhados, conforme mostrado no seguinte exemplo:

// <Method>public static void SomeMethod(){ // <Line> // Single line of code. // </Line>}// </Method>

Quando o Method trecho de código é renderizado, as marcas Line não são incluídas na saída renderizada.

Sempre que possível, faça referência a uma seção nomeada em vez de especificar números de linha. As referências a números de linha são frágeis, já que os arquivos de código são inevitavelmente alterados de maneiras que mudam os números de linha.Não necessariamente você será notificado sobre essas alterações. Seu artigo pode começar a mostrar as linhas erradas, e talvez você não faça ideia de que algo mudou.

Realçar linhas selecionadas

Exemplo:

:::code language="csharp" source="intro/samples/cu/Controllers/StudentsController.cs" range="2-24,26" highlight="2,5":::

O exemplo destaca as linhas 2 e 5, contando do início do snippet exibido. Números de linha para realce não são contados desde o início do arquivo de código. Em outras palavras, as linhas 3 e 6 do arquivo de código são realçadas.

Referências a snippet fora do repositório

Se o arquivo de código que você desejar citar estiver em outro repositório, será preciso configurar o repositório de código como um repositório dependente. Ao fazer isso, especifique um nome para ele. Esse nome servirá como um nome de pasta para fins de referências de código.

Por exemplo, o repositório de documentos é Azure/azure-docs, e o repositório de código é Azure/azure-functions-durable-extension.

Na pasta raiz de azure-docs, adicione a seguinte seção em .openpublishing.publish.config.json:

 { "path_to_root": "samples-durable-functions", "url": "https://github.com/Azure/azure-functions-durable-extension", "branch": "main", "branch_mapping": {} },

Agora, quando você se referir a samples-durable-functions como se fosse uma pasta em azure-docs, na verdade você estará se referindo à pasta raiz no repositório azure-functions-durable-extension.

Você pode incluir código usando o formato de dois-pontos triplos (:::) manualmente ou em Visual Studio Code com a ajuda do Pacote de Criação do Learn.

1. No Visual Studio Code, pressione Alt + M ou Option + M e selecione Snippet.
2. Depois que Snippet for selecionado, será solicitada uma Pesquisa Completa, uma Pesquisa com Escopo ou uma Referência de Repositório Cruzado. Para pesquisar entre repositórios, selecione Referência de Repositório Cruzado.
3. Você receberá uma seleção de repositórios que estão em .openpublishing.publish.config.json. Selecione um repositório.
4. Insira um termo de pesquisa para localizar o arquivo. Depois de encontrar o arquivo, selecione-o.
5. Em seguida, selecione uma opção para determinar quais linhas de código devem ser incluídas no snippet. As opções são: ID, Range e Nenhuma.
6. Com base na sua seleção da etapa 5, forneça um valor.

Sua referência ao snippet ficará assim:

:::code language="csharp" source="~/samples-durable-functions/samples/csx/shared/Location.csx" highlight="2,5":::

No repositório azure-functions-durable-extension, o arquivo de código está na pasta samples/csx/shared. Conforme observado anteriormente, os números de linha para realce são relativos ao início do trecho, em vez do início do arquivo.

Snippets em um notebook do Jupyter

Você pode referenciar uma célula em um notebook do Jupyter como um snippet de código. Para referenciar a célula:

1. Adicione metadados de célula ao notebook para as células que deseja referenciar.
2. Configure o acesso ao repositório.
3. Use a sintaxe do snippet do notebook do Jupyter no arquivo markdown.

Adicionar metadados ao notebook

1. Nomeie a célula adicionando metadados de célula ao notebook do Jupyter.

   • No Jupyter, você pode editar metadados de célula habilitando primeiro a barra de ferramentas da célula: Exibir >Barra de ferramentas da célula >Editar metadados.
   • Depois que a barra de ferramentas da célula estiver habilitada, selecione Editar Metadados na célula que deseja nomear.
   • Ou, então, você pode editar os metadados diretamente na estrutura JSON do notebook.

2. Nos metadados da célula, adicione um atributo "name":

   "metadata": {"name": "<name>"},

   Por exemplo:

   "metadata": {"name": "workspace"},

   Dica

   Você pode adicionar outros metadados que deseja para ajudar a acompanhar o local em que a célula está sendo usada. Por exemplo:

    "metadata": { "name": "workspace", "msdoc": "how-to-track-experiments.md" },

Configurar o acesso ao repositório

Se o arquivo de notebook que deseja referenciar estiver em outro repositório, configure o repositório de código como um repositório dependente.

Referência de sintaxe de snippets do notebook do Jupyter

Depois que o notebook contiver os metadados necessários, referencie-o no arquivo markdown. Use o <cell-name-value> adicionado ao notebook e o <path> configurado como o repositório dependente.

[!notebook-<language>[] (<path>/<notebook-name.ipynb>?name=<cell-name-value>)]

Por exemplo:

[!notebook-python[] (~/MachineLearningNotebooks/train-on-local.ipynb?name=workspace)]

Use uma das linguagens compatíveis para o identificador <language>.

Snippets de código interativos

Blocos de código interativo embutido

Para os seguintes idiomas, é possível tornar os snippets de código executáveis na janela do navegador:

• Azure Cloud Shell
• Azure PowerShell Cloud Shell
• C# REPL

Quando o modo interativo é habilitado, as caixas de código renderizado apresentam um botão Experimentar ou Executar. Por exemplo:

 ```azurepowershell-interactive New-AzResourceGroup -Name myResourceGroup -Location westeurope ```

é renderizado da seguinte forma:

New-AzResourceGroup -Name myResourceGroup -Location westeurope

E

 ```csharp-interactive var aFriend = "Maria"; Console.WriteLine($"Hello {aFriend}"); ```

renderiza como:

 var aFriend = "Maria"; Console.WriteLine($"Hello {aFriend}");

Para habilitar esse recurso para um bloco de código específico, use um identificador de linguagem especial. As opções disponíveis são:

• azurepowershell-interactive: habilita o Azure PowerShell Cloud Shell, como no exemplo anterior
• azurecli-interactive – Habilita o Azure Cloud Shell
• csharp-interactive – Habilita o C# REPL

No Azure Cloud Shell e PowerShell Cloud Shell, os usuários podem executar comandos apenas em suas respectivas contas do Azure.

Snippets de código incluídos por referência

É possível habilitar o modo interativo para snippets de código incluídos por referência.Para habilitar esse recurso para um bloco de código específico, use o atributo interactive. Os valores de atributo disponíveis são:

• cloudshell-powershell: habilita o Azure PowerShell Cloud Shell, como no exemplo anterior
• cloudshell-bash – Habilita o Azure Cloud Shell
• try-dotnet: habilita o Try .NET
• try-dotnet-class: habilita o Try .NET com scaffolding de classe
• try-dotnet-method: habilita o Try .NET com scaffolding de método

Estes são alguns exemplos:

:::code source="PowerShell.ps1" interactive="cloudshell-powershell":::

:::code source="Bash.sh" interactive="cloudshell-bash":::

No Azure Cloud Shell e PowerShell Cloud Shell, os usuários podem executar comandos apenas em suas respectivas contas do Azure.

Na experiência do .NET Interativo, o conteúdo de seu bloco de código depende de qual das três experiências de scaffolding você escolhe:

• Sem Scaffolding (try-dotnet): o bloco de código deve representar um texto integral do programa. Por exemplo, o arquivo Program.cs gerado por dotnet new console seria válido. Isso é mais útil para apresentar um pequeno programa integral, incluindo as diretivas using necessárias. No momento, as instruções de nível superior não têm suporte.
• Scaffolding de método (try-dotnet-method): o bloco de código deve representar o conteúdo de um método Main em um aplicativo de console. Você pode assumir as diretivas using adicionadas pelo modelo dotnet new console. Essa configuração é mais útil para trechos pequenos que demonstram um recurso.
• Scaffolding de classe (try-dotnet-class): o bloco de código deve representar uma classe com um método Main como ponto de entrada do programa. Pode ser usado para mostrar como os membros de uma classe interagem.

Referência de sintaxe do snippet

Sintaxe:

:::code language="<language>" source="<path>" <attribute>="<attribute-value>":::

• <language> (opcional)

  • Linguagem do snippet de código. Para mais informações, consulte a seção Linguagens com suporte mais adiante neste artigo.

• <path> (obrigatório)

  • O caminho relativo no sistema de arquivos que indica o arquivo de snippet de código a ser referenciado.

• <attribute> e <attribute-value> (opcional)

  • Usados juntos para especificar como o código deve ser recuperado do arquivo e como ele deve ser exibido:
    • range: 1,3-5 Um intervalo de linhas. Este exemplo inclui as linhas 1, 3, 4 e 5.
    • id: Create A ID do snippet que precisa ser inserido do arquivo de código. Esse valor não pode coexistir com o intervalo.
    • highlight: 2-4,6 Intervalo e/ou números de linhas que precisam ser realçadas no snippet de código gerado. A numeração é relativa às linhas exibidas (conforme especificado por intervalo ou ID), não ao arquivo.
    • interactive: cloudshell-powershell, cloudshell-bash, try-dotnet, try-dotnet-class, try-dotnet-method O valor da cadeia de caracteres determina quais tipos de interatividade estão habilitados.
    • Para obter detalhes sobre a representação do nome da marca em arquivos de origem de snippet de código por linguagem, consulte as Diretrizes do DocFX.

Idiomas com suporte

O Pacote de Criação do Learn inclui um recurso para fornecer a conclusão da instrução e a validação dos identificadores de idioma disponíveis para blocos de cerca de código.

Blocos de código isolados

Próximas etapas

Para obter informações sobre a formatação de texto para tipos de conteúdo que não são código, confira Diretrizes de formatação de texto.