Espresso Labs ionic-module

Esquema para novos módulos ionic internos da Espresso Labs

Compartilhar código entre equipes é sempre complexo. Garantir que isso seja feito de forma eficiente e fácil é de extrema importância para o crescimento do time como um todo.

Este projeto tem como objetivo fornecer as linhas gerais para publicação de novos módulos que possam se acoplar a projetos Ionic dentro da Espresso Labs

Instalação

npm i @espressolabs/ionic-module

E então faça a importaçao no seu app.module.ts

Usando

Para usar o projeto como base, você deve ter um outro repositório já criado.

Alterando git origin

Primeiro clone o projeto executando o seguinte comando:

git clone https://[email protected]/_espresso/ionic-module.git

Após isso o projeto continuára configurado para enviar alterações ao repositório original. Para mudar o destino execute o seguinte comando:

git remote set-url origin [URL DO SEU REPOSITÓRIO]

Agora todas as suas edições serão enviadas para o novo repositório.

Criando novo código

Depois dos passos anteriores você pode inserir em src/components o código do seu componente, ou src/providers o código do seu provider/service, com atenção nas importações e em excluir os arquivos de exemplo.

Também é possível renomear arquivos ou inserir pastas adicionanis a partir do utils.js localizado na pasta util.

Testes

Os testes unitários são feitos com base no Karma, a biblioteca recomendada para testes em componentes Angular/Ionic. Para executá-los use o comando:

npm run test

Você deve nomear seus arquivos de teste com a extensão .spec.ts para que os mesmos sejam executados

O seu módulo será compilado e executado em uma janela do Chrome. Após a finalização você pode ver os resultados no console.

Todas as funções devem ser testadas, com code coverage de 100%

Publicando

Após garantir que todos os testes passam, caso o seu módulo esteja pronto para publicação inicie substituindo no package.json as entradas:

{
	"name": "*nome do seu módule*",
	"version": "*código de versão*",
	"description": "*Descrição geral*",
	"repository": {
		"type": "git",
		"url": "*endereço do repositório*"
	},
	"author": "*nome do autor/time*",
	"homepage": "*endereço web para mais informações*",
}

Em seguida, execute o comando:

npm publish

Se você nunca publicou um módulo, será necessário criar uma conta no NPM e fazer login.

Pronto, seu novo módulo foi publicado e pode ser usado por todos.

Contribuindo

Para realizar mudanças, basta clonar o repositório, criar uma nova branch com suas mudanças e realizar um pull-request.

Utilitários

A pasta util do repositório contêm um script utilitário com alguns comandos para te ajudar a fazer a customização do seu novo módulo. Os comando tem sempre a seguinte forma:

node util.js (command) [args]

Rename

Você pode facilmente renomear qualquer elemento do seu módulo com o comando rename:

node util.js rename currentName [NOVO NOME]

Para renomear apenas partes especifícas, basta adicionar o prefixo após os nomes, deste moddo:

node util.js rename [NOME ATUAL DO COMPONENTE] [NOVO NOME DO COMPONENTE] # renomeia um componente
node util.js rename [NOME ATUAL DO PROVIDER] [NOVO NOME DO PROVIDER] # renomeia um provider
node util.js rename [NOME DO MÓDULOE] [NOVO NOME DO MÓDULO] # renomeia apenas as entradas do módulo

Todos os nomes devem ser usados em camel case para um reconhecimento eficaz

Component

Com o comando component é possível adicionar novos compoenentes ao projeto:

node util.js component name

Assim, um novo componente com toda a estrutura necessária foi adicionado a pasta components.

Provider

Com o comando provider é possível adicionar novos providers ao projeto:

node util.js provider name

Assim, um novo provider com toda a estrutura necessária foi adicionado a pasta providers.

Links

Este projeto foi baseado no https://github.com/trekhleb/angular-library-seed

Referências durante o desenvolvimento

https://devdactic.com/custom-ionic-module-npm/
https://www.joshmorony.com/an-in-depth-explanation-of-providers-in-ionic-2/
https://ionicframework.com/docs/v3/api/IonicModule/
https://medium.com/@manivel45/angular-7-unit-testing-code-coverage-5c7a238315b6

Licença

Este projeto só pode ser compartilhado entre projetos da Espresso Labs, de acordo com o código de conduta.

Espresso Labs 2019