Repolode
Enviar
sennkuwu

sennkuwu/wechat-style-extractor

Uma ferramenta que extrai modelos visuais reutilizáveis de artigos de contas oficiais do WeChat e os mostra em uma prévia como rich text pronto para colar no editor do WeChat.

Ver no GitHub
Estrelas
155
Forks
18
Issues abertas
0
Último commit
há 2 meses

O que é?

O WeChat Style Extractor recebe o link público de um artigo de uma conta oficial do WeChat e analisa seu layout. Ele contabiliza cores, tamanhos de fonte, alturas de linha, espaçamentos e componentes de conteúdo, como cards, e exibe os parâmetros visuais e as regras dos componentes encontrados.

O parser no servidor busca o artigo, higieniza o HTML, normaliza os estilos e incorpora o stylesheet do artigo para preservar grids, posicionamento, sombras, listas e tabelas. Imagens, imagens carregadas sob demanda e imagens de fundo em CSS são mantidas. Uma prévia na largura de um celular permite conferir o resultado antes de copiá-lo como rich text para o editor do WeChat.

O reconhecimento é heurístico: itens não reconhecidos ficam ocultos e a prévia usa valores padrão; além disso, estilos inline não garantem fidelidade total no editor do WeChat. A busca é limitada a mp.weixin.qq.com, e o WeChat pode ocasionalmente exibir uma página de verificação para o servidor.

Recursos principais

  • 01Extrai cores, tamanhos de fonte, alturas de linha e espaçamentos a partir do link de um artigo.
  • 02Identifica títulos, autores e componentes de conteúdo, como cards.
  • 03Mantém imagens originais, imagens carregadas sob demanda e imagens de fundo em CSS.
  • 04Incorpora o stylesheet do artigo para preservar grids, sombras, listas e tabelas.
  • 05Oferece uma prévia na largura de um celular e copia o resultado como rich text.

Casos de uso

  • Estudar os padrões de layout de artigos populares de contas oficiais do WeChat.
  • Criar modelos originais e reutilizáveis para formatar artigos no WeChat.
  • Conferir a aparência de um artigo em um celular antes de publicá-lo no editor do WeChat.

Início rápido

  1. 1

    Instalar as dependências

    npm install
  2. 2

    Iniciar o servidor de desenvolvimento

    npm run dev
  3. 3

    Compilar para produção (opcional)

    npm run build

Antes de usar

  • É necessário ter o Node.js 22.13 ou mais recente.
  • A busca de artigos só funciona com links de mp.weixin.qq.com, e às vezes o WeChat exibe uma página de verificação de segurança que bloqueia a análise.
  • A extração de estilos é heurística, e os estilos inline podem não ser totalmente preservados no editor do WeChat.

Tópicos

#wechat#style-extraction#rich-text#template#preview#typescript

Perguntas frequentes

O que é wechat-style-extractor?
Uma ferramenta que extrai modelos visuais reutilizáveis de artigos de contas oficiais do WeChat e os mostra em uma prévia como rich text pronto para colar no editor do WeChat. O WeChat Style Extractor recebe o link público de um artigo de uma conta oficial do WeChat e analisa seu layout. Ele contabiliza cores, tamanhos de fonte, alturas de linha, espaçamentos e componentes de conteúdo, como cards, e exibe os parâmetros visuais e as regras dos componentes encontrados.
wechat-style-extractor é gratuito? Qual é a licença?
wechat-style-extractor é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
wechat-style-extractor ainda é mantido?
Atualizado nos últimos 6 meses. O último commit de wechat-style-extractor foi em 5 de set. de 2026.
Para que posso usar wechat-style-extractor?
Estudar os padrões de layout de artigos populares de contas oficiais do WeChat. Criar modelos originais e reutilizáveis para formatar artigos no WeChat. Conferir a aparência de um artigo em um celular antes de publicá-lo no editor do WeChat.
Como instalar wechat-style-extractor?
Instalar as dependências: npm install Iniciar o servidor de desenvolvimento: npm run dev Compilar para produção (opcional): npm run build
Onde consigo wechat-style-extractor?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/sennkuwu/wechat-style-extractor

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados