remotion-dev/adicionar-efeito

O que adicionar-efeito faz?

Adicionar um novo efeito ao @remotion/effects, incluindo implementação, exportações de pacotes, documentação, demonstrações, imagens de pré-visualização, atualizações de habilidades do Remotion, testes, formatação e builds.

Tarefas

1. Implementação: Crie o novo efeito em packages/effects/src/.

   • Use TypeScript e siga o padrão de outros efeitos (ex.: packages/effects/src/advanced-google-docs/).
   • Exporte a função Effect como padrão.

2. Exportações do pacote: Atualize packages/effects/src/index.ts.

   • Adicione a exportação do novo efeito.

3. Documentação: Adicione documentação no repositório remotion-dev/template-effects.

   • Siga o formato dos efeitos existentes (arquivo .mdx com metadados).

4. Demonstração: Crie uma demonstração interativa no diretório apps/demo/.

   • Use React e siga o padrão de outras demonstrações.
   • Inclua controles para parâmetros do efeito.

5. Imagem de pré-visualização: Gere uma imagem PNG de pré-visualização.

   • Use um script ou ferramenta de captura.
   • Salve em packages/effects/src/[efeito]/preview.png.

6. Atualização da habilidade do Remotion: Atualize o arquivo packages/effects/SKILL.md.

   • Adicione o novo efeito à lista de efeitos disponíveis.

7. Testes: Escreva testes para o novo efeito.

   • Use Vitest e siga o padrão em packages/effects/src/__tests__/.
   • Teste a saída do efeito com snapshots.

8. Formatação: Execute npx prettier --write . na raiz do monorepo.

9. Build: Execute npx tsc para verificar erros de tipo.

Fluxo de trabalho

Siga esta ordem para evitar conflitos de merge ou erros de build:

1. Implementação
2. Exportações do pacote
3. Testes
4. Build (verifique erros de tipo)
5. Documentação
6. Demonstração
7. Imagem de pré-visualização
8. Atualização da habilidade do Remotion
9. Formatação