Empacotador de aplicações web ultra-rápido, sem configuração

Iniciar GitHub

🚀 Empacotamento ultra-rápido

Parcel utiliza processos que habilitam a compilação multicore e faz cache do sistema de arquivos para reconstruir mesmo após um reinício.

📦 Empacota todos os seus recursos

Parcel tem suporte de fábrica para JS, CSS, HTML, arquivos, e mais - sem a necessidade de plugins.

🐠 Conversões automáticas

O código é automaticamente convertido utilizando Babel, PostCSS, e PostHTML quando necessário - até mesmo o diretório node_modules.

✂️ Separação do código sem configuração

Usando a sintaxe dinâmica import(), o Parcel separa seus arquivos de saída para que você possa carregar apenas o que é necessário no carregamento inicial.

🔥 Hot Module Replacement

Parcel atualiza os módulos automaticamente no navegador à medida que você realiza alterações durante o desenvolvimento, sem configuração.

🚨 Exibição de erros amigáveis

Parcel exibe trechos do código quando ele encontra erros para ajudá-lo a identificar o problema.

Olá, Mundo!

Inicie sua aplicação com um arquivo HTML. Parcel seguirá as dependências a partir daí e construirá toda a aplicação.

✏️ index.html

<html>
<body>
  <script src="./index.js"></script>
</body>
</html>

🛠 index.js

// importar outro componente
import main from './main';

main();

🛠 main.js

// importar um CSS
import classes from './main.css';

export default () => {
  console.log(classes.main);
};

💅 main.css

.main {
  /* referenciar uma imagem */
  background: url('./images/background.png');
  color: red;
}

Apenas execute parcel index.html para iniciar o servidor de desenvolvimento. A importação de JavaScript, CSS, imagens, etc., simplesmente funciona! 👌

Comparativos

Empacotador Tempo
browserify 22,98s
webpack 20,71s
parcel 9,98s
parcel - com cache 2,64s

Baseado em um aplicativo razoalvemente grande, contendo 1.726 módulos, 6,5M de arquivos não-comprimidos. Realizado em um MacBook Pro 2016 com 4 processadores físicos.