Rodando o projeto localmente
🔍 Preview
Neste passo você vai clonar o projeto Store Theme a partir do GitLab da Uappi, configurar a versão correta do Node.js e subir o ambiente local de desenvolvimento.
Todos os projetos da Uappi são entregues via repositório GitLab da própria plataforma.
O desenvolvimento local sempre parte desse repositório.
📥 Clonando o repositório
Você pode clonar o projeto usando HTTPS ou SSH. Escolha o método que você já utiliza no dia a dia.
Os caminhos de repositório abaixo são apenas exemplos.
O repositório real é provisionado pela Uappi e informado no onboarding do projeto.
🔗 Clone via HTTPS
1git clone https://gitlab.com/uappi/store/clientes/{nome-do-cliente}/frontend/{nome-do-projeto}.git🔐 Clone via SSH
1git@gitlab.com:agenciawebart/wapstore/clientes/{nome-do-cliente}/frontend/{nome-do-projeto}.gitApós o clone, entre na pasta do projeto:
1cd nome-do-projeto🟢 Verificando a versão do Node.js
Antes de instalar as dependências, confirme a versão do Node.js ativa:1node -vSe a versão não estiver compatível, utilize o NVM para ajustar.
📋 Listar versões instaladas
1nvm ls▶️ Para usar uma versão específica
1nvm use [version]📦 Instalar a versão LTS mais recente
1nvm install lts
✅ Garanta que o Node.js ativo esteja dentro das versões suportadas pelo Vue.js 3.
Node.js ^20.19.0 || >= 22.12.0
📦 Instalando as dependências
Com o Node.js correto ativo, instale as dependências do projeto:
1npm install🚀 Subindo o ambiente de desenvolvimento
Para rodar o projeto localmente em modo desenvolvimento:
1npm run devApós isso, o terminal exibirá a URL local onde o Store Theme estará disponível.
🧪 Comandos adicionais úteis
Durante o desenvolvimento, você pode utilizar os comandos abaixo:🔍 Build + verificação de tipagem
1npm run build- Gera o build do projeto
- Valida tipagens TypeScript
- Identifica possíveis erros antes do deploy
- Aplica correções automáticas
- Verifica padrões de código e boas práticas
🧹 Lint e padronização de código
1npm run lint🏁 Próximo passo
Com o projeto rodando, agora é hora de entender a estrutura do projeto.
Estrutura do projeto: como é organizado as pastas e arquivos