Pacotes privados com Yarn Workspaces e Angular CLI

Desenvolvedor Angular & Go, criador do Material Community Components, mantenedor do NGX-Translate e contribuidor do pREST.

Às vezes, queremos criar pacotes privados para compartilhar entre nossos projetos, mas sem toda aquela entropia de, a cada atualização, ter que fazer todo o processo de publicação de um pacote no NPM. Na minha opinião, a melhor forma de se fazer isso é utilizando Yarn Workspaces e git submodule.

Neste artigo, vou mostrar como podemos fazer isso utilizando um projeto criado com Angular CLI. Imagine que o seguinte módulo será compartilhado entre vários projetos.

Uma das partes mais importantes do módulo que vamos compartilhar são as informações no `package.json`. Aqui, nós devemos declarar no mínimo o campo **name** e **version** do pacote.

Nesse arquivo também devemos declarar as dependências do nosso módulo, caso ele tenha alguma. As dependências do módulo podem ser do tipo *peerDependencies*, *dependencies* e *devDependencies*.

  • dependencies: são dependências em que o pacote precisa para funcionar corretamente.
  • devDependencies: são dependências que só serão utilizadas em ambiente de desenvolvimento.
  • peerDependencies: são um tipo especial de dependência. Quando declaramos uma dependência desse tipo, estamos dizendo que a aplicação na qual nosso pacote for instalado deverá ter esses pacotes já instalados. Como no exemplo acima, no qual declaramos que a aplicação deverá ter o @angular/core já instalado.

Feito isso e atualizado nosso repositório git, vamos para nossa aplicação adicionar o pacote como submódulo. Para fazer isso, vamos executar o seguinte comando no root do nosso projeto.

   git submodule add https://link-para-seu-repositor.io/shared-module

Agora que já temos nosso submódulo instalado, precisamos habilitar o yarn workspaces e adicionar o shared-module. Para habilitar o yarn workspaces precisamos adicionar os atributos private e workspaces no package.json da aplicação. Já para a importação do shared-module, devemos colocar exatamente o name e version que configuramos no pacote.

Por último, temos que dizer ao Typescript (*tsconfig.json*) que existe código fora do *src* que deverá ser compilado. Para isso, vamos adicionar o parâmetro “include”.

Como estamos mudando o comportamento default, também precisamos adicionar a pasta *src* nesse array de pastas.

Abraço e até a próxima!


BrazilJS é uma iniciativa NASC