BT

Início Notícias Pika: Empacotamento e publicação de pacotes NPM com configuração zero

Pika: Empacotamento e publicação de pacotes NPM com configuração zero

Favoritos

O Pika oferece uma interface online para pacotes NPM baseados em módulos ES (ex: pacotes com um módulo de entrada em seu package.json). Desenvolvedores podem buscar tais pacotes por nome. Alternativamente, é possível restringir as buscas pelos pacotes mais populares.

O @pika/pack apresenta a si mesmo como "Construção de pacotes npm, reimaginados". O módulo de empacotamento expõe uma interface de linha de comando(CLI) que controla a operações de build comuns, empacotamento e publicação, através de uma sequência de plugins pré-configurados. A documentação do módulo diz:

Os plugins encapsulam ferramentas populares como Babel e o Rollup, com opções de configurações otimizadas para o npm, removendo a necessidade de perder muito tempo (se perder) com uma configuração manual. O desenvolvedor até obtêm um package.json configurado automaticamente.

O @pika/pack utiliza o arquivo src/index.js do diretório source que ele está utilizando como ponto de entrada. A execução deve ser configurada no package.json:

{
  "name": "simple-package",
  "version": "1.0.0",
  "@pika/pack": {
    "pipeline": [
      ["@pika/plugin-standard-pkg", {"exclude": ["__tests__/**/*"]}],
      ["@pika/plugin-build-node"],
      ["@pika/plugin-build-web"],
      ["@pika/plugin-build-types"]
    ]
  }
}

O plugin @pika/plugin-standard-pkg atualmente irá construir as distribuições utilizando o ES2018. O plugin é atualizado anualmente com a última especificação do ECMAScript.

O plugin @pika/plugin-build-node irá adicionar uma distribuição Node.js em um pacote construído pelo Pika. Essa distribuição segue a sintaxe de módulos do CommonJS (CJS) e é transpilado para executar no Node.js LTS. O plugin adiciona uma entrada main no package.json gerado pelo Pika. Por convenção, a entrada main é utilizada para indicar o ponto de entrada das distribuições CommonJS.

O plugin @pika/plugin-build-web adiciona uma distribuição ESM em um pacote, que é construído e otimizado para rodar em navegadores modernos e é suportado pela maioria dos empacotadores. O módulo adiciona uma distribuição web ao pacote construído pelo Pika e um módulo de entrada ao package-json.

O plugin @pika/plugin-build-types adiciona definições de tipos do Typescript a um pacote.

No total, mais de 10 plugins complementam os plugins apresentados aqui e endereçam casos de uso variados, como a construção de pacotes Deno.js e Web Assembly(WASM). O Deno.js é um runtime Typescript V8 seguro, do mesmo criador do Node.js. O Web Assembly é uma nova linguagem assembly que pode ser compilada a partir de uma variedade de outras linguagens, como C++, Java, C# e Rust.

Os Builds são obtidos através do pack build. Os plugins pack configurados criam diretórios contendo a distribuição gerada e atualizam o package.json gerado pelo Pika. O exemplo anterior pode, por exemplo, gerar o seguinte package.json:

// After: your built "pkg/" package.json manifest:
{
  "name": "simple-package",
  "version": "1.0.0",
  // Multiple distributions, built & configured automatically:
  "esnext": "dist-src/index.js",
  "main": "dist-node/index.js",
  "module": "dist-web/index.js",
  "types": "dist-types/index.d.ts",
  // With sensible package defaults:
  "sideEffects": false,
  "files": ["dist-*/", "assets/", "bin/"]
}

Desenvolvedores podem publicar seus pacotes através do pack publish. Este comando apresenta uma interface interativa que guia o desenvolvedor pelo processo de publicação. O processo de publicação inclui incremento de versão, tag de versão, geração do build e a publicação do pacote.

Atualmente, o @pika/pack suporta aplicações escritas em JavaScript, BuckleScript (compiladores OCaml e ReasonML) ou TypeScript. A compilação pode ser feita para JavaScript ou Web Assembly(WASM). Exemplos de utilização estão disponíveis em um repositório dedicado.

O time Pika defende que o Pika é uma boa escolha para sites pequenos a médios:

A partir de um certo tamanho, você provavelmente vai querer otimizar seu site para produção, empacotando o seu código fonte. Mas o que descobrimos foi que o caching + a redução de complexidade mais do que compensam a falta de empacotamento em sites pequenos até médios.

Alguns desenvolvedores entusiasticamente veneram as capacidades do Pika. Domantas explica:

Ao invés de tentar conectar tudo por conta própria, desta vez apenas utilizei o @pikapkg para construir e publicar meu novo pacote. Se você está procurando por algo que simplesmente funciona, eu recomendo muito testá-lo também.

Entretanto, o Pika ainda é uma ferramenta nova, ainda em fase inicial, bugs ainda estão sendo resolvidos e seu primeiro grande release ainda está pendente.

A grande maioria do pacotes npm são publicados exclusivamente seguindo a especificação CommonJS, que incluem as sintaxes require() do Node.js e module.exports. Empacotadores, como o Webpack e o Rollup, encontram uma grande dificuldade em aplicar otimizações avançadas, como o tree-shaking, em pacotes CommonJS. Isto pode levar a arquivos maiores, resultando em métricas maiores de Tempo para Interação da Página. O ESM permite então uma otimização que resulta em melhores experiências do usuário. O ESM é suportado por todos os navegadores modernos.

Em 28 de fevereiro de 2018, aproximadamente 50.000 (6%) dos pacotes npm são baseados em módulos ES. O Rollup iniciou o movimento da adoção de módulos ES sendo pioneiro no uso de ponto de entrada de módulo em seu empacotador em agosto de 2016.

Os pacotes do Pika estão disponíveis sob a licença open source MIT. Contribuições são bem vindas através dos respectivos pacotes do GitHub e devem seguir as respectivas diretrizes de contribuição e o código de conduta.

Avalie esse artigo

Relevância
Estilo/Redação

Olá visitante

Você precisa cadastrar-se no InfoQ Brasil ou para enviar comentários. Há muitas vantagens em se cadastrar.

Obtenha o máximo da experiência do InfoQ Brasil.

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

Comentários da comunidade

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

BT

Seu cadastro no InfoQ está atualizado? Poderia rever suas informações?

Nota: se você alterar seu email, receberá uma mensagem de confirmação

Nome da empresa:
Cargo/papel na empresa:
Tamanho da empresa:
País:
Estado:
Você vai receber um email para validação do novo endereço. Esta janela pop-up fechará em instantes.