Um dos princípios fundamentais do desenvolvimento de software é DRY (Don’t Repeat Yourself), que também se aplica à documentação. Se você se encontrar repetindo o mesmo conteúdo em vários lugares, deve criar um snippet personalizado para manter seu conteúdo sincronizado.

​
Criando um snippet personalizado

Pré-condição: Você deve criar seu arquivo de snippet no diretóriosnippetspara que a importação funcione.

Qualquer página no diretóriosnippetsserá tratada como um snippet e não será renderizada como uma página independente. Se você quiser criar uma página independente a partir do snippet, importe o snippet para outro arquivo e chame-o como um componente.

​
Exportação padrão

  1. Adicione conteúdo ao seu arquivo de snippet que você deseja reutilizar. Opcionalmente, você pode adicionar variáveis que podem ser preenchidas via props quando você importar o snippet. Neste exemplo, nossa variável é word.
snippets/my-snippet.mdx
Hello world! This is my content I want to reuse across pages.
  1. Importe o snippet para o seu arquivo de destino.
destination-file.mdx
---
title: My title
description: My Description
---

import MySnippet from '/snippets/path/to/my-snippet.mdx';

## Header

Lorem impsum dolor sit amet.

<MySnippet/>

​
Exportando com variáveis

  1. Opcionalmente, você pode adicionar variáveis que podem ser preenchidas via props quando você importar o snippet. Neste exemplo, nossa variável é word.
snippets/my-snippet.mdx
My keyword of the day is {word}.
  1. Importe o snippet para o seu arquivo de destino com a variável. A propriedade será preenchida com base na sua especificação.
destination-file.mdx
---
title: My title
description: My Description
---

import MySnippet from '/snippets/path/to/my-snippet.mdx';

## Header

Lorem impsum dolor sit amet.

<MySnippet word="bananas" />

​
Variáveis reutilizáveis

  1. Exporte uma variável do seu arquivo de snippet:
snippets/path/to/custom-variables.mdx
export const myName = 'my name';

export const myObject = { fruit: 'strawberries' };
  1. Importe o snippet do seu arquivo de destino e use a variável:
destination-file.mdx
---
title: My title
description: My Description
---

import { myName, myObject } from '/snippets/path/to/custom-variables.mdx';

Hello, my name is {myName} and I like {myObject.fruit}.