Você já usou Parcel?

O Parcel é um bundler de JavaScript que simplifica o processo de construção web. Ele é conhecido por sua configuração zero e sua capacidade de lidar automaticamente com grande parte das tarefas de desenvolvimento, como transpilação de código, minificação de arquivos, otimização de imagens e muito mais. Aqui estão alguns detalhes sobre o funcionamento e configurações do Parcel:

Configuração Zero: Uma das características mais marcantes do Parcel é sua configuração zero. Isso significa que você não precisa configurar manualmente arquivos de configuração, como webpack.config.js ou parcel.config.js. O Parcel detecta automaticamente os arquivos em seu projeto e configura o ambiente de construção com base nas necessidades do seu aplicativo.

Empacotamento Automático de Módulos: O Parcel reconhece e empacota automaticamente módulos JavaScript, CSS, HTML, imagens e muitos outros tipos de arquivos. Ele usa uma abordagem baseada em AST (Abstract Syntax Tree) para analisar as dependências do seu projeto e construir um grafo de dependências, o que permite que ele saiba quais arquivos precisam ser incluídos no pacote final.

Suporte para uma Variedade de Recursos: Além de JavaScript, o Parcel suporta uma variedade de recursos, incluindo CSS, SCSS, Less, HTML, SVG, imagens, fontes e muito mais. Ele permite importar esses recursos diretamente em seus arquivos JavaScript ou HTML, e o Parcel cuida da inclusão correta desses recursos no pacote final.

Recursos de Desenvolvimento: Durante o desenvolvimento, o Parcel oferece recursos como live reloading, que atualiza automaticamente o navegador quando você faz alterações no código-fonte. Ele também suporta o Hot Module Replacement (HMR), o que significa que as alterações no código são refletidas instantaneamente no navegador sem a necessidade de recarregar a página.

Otimização para Produção: Quando você está pronto para implantar seu aplicativo em produção, o Parcel pode otimizar automaticamente o pacote final. Ele faz isso minimizando arquivos JavaScript, CSS e HTML, otimizando imagens, removendo código morto e realizando outras transformações para garantir que seu aplicativo tenha o menor tamanho possível e seja carregado o mais rápido possível.

Plugins e Extensões: O Parcel suporta plugins e extensões que permitem estender suas funcionalidades. Isso significa que você pode adicionar funcionalidades adicionais ao seu processo de construção, como suporte a TypeScript, Babel presets, processamento de arquivos específicos e muito mais.

Para instalação:

npm install --save-dev parcel