Create WCM React Artefato

Gerador automatizado de artefatos WCM React - cria projetos completos baseados em templates.

📋 Pré-requisitos

• Node.js >= 14.0.0
• npm ou yarn

� Guia de Uso

1. Clone o repositório

git clone https://github.com/seu-usuario/wcm-react-artefato.git
cd wcm-react-artefato

2. Instale as dependências

npm install

3. Execute o gerador localmente

Para gerar um novo WCM, execute o comando:

node bin/index.js nome-do-WCM

Ou simplesmente:

node bin/index.js

Se você não especificar o nome, o WCM será criado com o nome padrão meu-WCM.

4. Responda às perguntas interativas

O gerador irá fazer algumas perguntas para configurar seu WCM:

• Descrição do WCM: Descrição breve do que o WCM faz
• Autor: Seu nome ou nome da equipe
• Versão inicial: Versão inicial do WCM (padrão: 1.0.0)

5. Projeto criado!

Após responder as perguntas, seu WCM será criado na pasta especificada com toda a estrutura configurada.

O arquivo template-config.js contém toda a configuração de perguntas e placeholders. É muito simples de usar:

Estrutura da Configuração

module.exports = {
  questions: {
    // Cada pergunta tem:
    nomeUnico: {
      question: "Texto da pergunta: ",
      placeholders: ["{{PLACEHOLDER1}}", "{{PLACEHOLDER2}}"], // pode ser um ou mais
      default: "valor padrão se usuário não responder",
    },
  },

  autoPlaceholders: {
    // Placeholders preenchidos automaticamente
    "{{PLACEHOLDER}}": "valor", // ou função: () => "valor"
  },
};

Exemplos de Uso

Adicionar uma nova pergunta simples

license: {
  question: "📄 Escolha a licença (MIT/GPL/Apache): ",
  placeholders: ["{{PROJECT_LICENSE}}"],
  default: "MIT"
}

Pergunta com múltiplos placeholders

framework: {
  question: "🚀 Framework (vue/react/vanilla): ",
  placeholders: ["{{FRAMEWORK}}", "{{PROJECT_FRAMEWORK}}", "{{TECH_STACK}}"],
  default: "vanilla"
}

Placeholder automático

autoPlaceholders: {
  "{{CURRENT_DATE}}": () => new Date().toLocaleDateString('pt-BR'),
  "{{PROJECT_VERSION}}": "1.0.0"
}

Vantagens

✅ Simples: Apenas um arquivo para configurar tudo
✅ Flexível: Um placeholder pode ser usado em vários arquivos
✅ Reutilizável: Uma pergunta pode preencher vários placeholders
✅ Automático: Alguns placeholders são preenchidos automaticamente
✅ Expansível: Fácil de adicionar novas perguntas sem modificar código

Como usar nos templates

Nos seus arquivos template (HTML, CSS, JS), simplesmente use os placeholders:

<title>{{PROJECT_NAME}}</title>
<meta name="description" content="{{PROJECT_DESCRIPTION}}" />
<meta name="author" content="{{PROJECT_AUTHOR}}" />
<meta name="license" content="{{PROJECT_LICENSE}}" />

// {{PROJECT_DESCRIPTION}}
const projectInfo = {
  name: "{{PROJECT_NAME}}",
  version: "{{PROJECT_VERSION}}",
  framework: "{{FRAMEWORK}}",
};

// {{NOME_ARQUIVO}}
{{NOME_ARQUIVO}}.JS

O sistema irá fazer todas as perguntas configuradas e substituir os placeholders automaticamente!

Testar localmente antes de publicar

# Criar um link simbólico global
npm link

# Testar em outra pasta
cd /tmp
npx wcm-react-artefato teste-projeto

# Se funcionar, desinstalar o link
npm unlink -g wcm-react-artefato

Opção 1: Passo a passo rápido

# 1. Incrementar a versão (escolha um dos comandos)
npm version patch --no-git-tag-version    # Para correções de bugs (1.0.1 -> 1.0.2)
npm version minor --no-git-tag-version    # Para novas funcionalidades (1.0.1 -> 1.1.0)
npm version major --no-git-tag-version    # Para mudanças incompatíveis (1.0.1 -> 2.0.0)

# 2. Publicar no NPM
npm publish

Tipos de versão (Semantic Versioning)

| Comando | De | Para | Quando usar | | ------------------- | ----- | ----- | ----------------------------------------- | | npm version patch | 1.0.1 | 1.0.2 | Correções de bugs | | npm version minor | 1.0.1 | 1.1.0 | Novas funcionalidades (compatível) | | npm version major | 1.0.1 | 2.0.0 | Mudanças incompatíveis (breaking changes) |

🔍 Verificar a publicação

Após publicar, verifique em:

• NPM: https://www.npmjs.com/package/wcm-react-artefato
• Testar: npx wcm-react-artefato@latest teste-projeto

📋 Checklist antes de publicar

• [ ] Testou as mudanças localmente com node bin/index.js
• [ ] Atualizou o README se necessário
• [ ] Incrementou a versão no package.json
• [ ] Commitou as mudanças no Git
• [ ] Verificou que não há erros no código

💡 Dicas Importantes

• Versão semântica: Sempre siga o padrão MAJOR.MINOR.PATCH
• Teste antes: Use npm link para testar localmente antes de publicar
• README atualizado: Mantenha a documentação sempre sincronizada
• Changelog: Considere manter um arquivo CHANGELOG.md com as mudanças
• Licença: Garanta que a licença está correta no package.json

🔗 Links Úteis

• Documentação do projeto
• Reportar problemas

📄 Licença

MIT