Mateus Souza

Conversas sobre desenvolvimento web

Categorias »

Tuild – Um Construtor / Compressor de Peso!

6

Depois de muito tempo sem postar nada no blog, hoje venho trazer uma ferramenta que criei usando NodeJS. Nada mais, nada menos do que o “Tuild” – uma junção das palavras “this & build”.

O Tuild é um construtor/compressor (em inglês: build/minifier) para CSS, HTML e JS. Se ainda não caiu a ficha, o Tuild é uma alternativa – elegante – para:

Enfim, o Tuild é um “tudo em um”, com mais opções (suporte a HTML por exemplo). O motivo da criação do Tuild é exatamente esta: ter um construtor e compressor simples, porém avançado e central, atendendo as principais necessidades de qualquer projeto web.

Sendo um pouco mais descritivo, o Tuild tem as seguintes caracteristicas:

  • Junta vários arquivos em um só – dev.
  • Comprime CSS, HTML e JS – minified.
  • Suporta múltiplos arquivos ou pasta de arquivos.
  • Remove comentários não considerados importantes.
  • Mantém comentários importantes (sempre começa com /*!, como faz o YUI Compressor).
  • Mantém comentários HTML de alvo para o IE.
  • Testa códigos JS usando JSHint.
  • Comprime JS usando UglifyJS – o mesmo usado no jQuery.
  • “Assiste” a arquivos em busca de alterações para atualizar automaticamente o arquivo alvo.
  • Possui suporte para apenas retornar o código criado – comumente é criado/alterado um arquivo.
  • Pode ser escrito com NodeJS ou via linha de comando.
  • Extensível – é possível criar novos módulos para o Tuild.
  • Muito leve, em comparação com os demais compressores.
  • Disponível nos pacotes do NPM.
  • Ótima licensa de uso – sinta-se livre para alterá-lo…

Instalando o Tuild

Para rodar o Tuild como já disse, é necessário ter o NodeJS em sua máquina de desenvolvimento – apenas nesta. Se voce usa o Mac OSX, segue um script simples para instalar tudinho bem rápido:

#Instala o nodeJS
sudo port install nodejs

#Instala NPM
curl http://npmjs.org/install.sh | sudo sh

Para os demais Sistemas Operacionais, segue um link com as instruções: https://github.com/joyent/node/wiki/Installation.

Depois de instalado o NodeJS e o NPM é só executar no terminal:

npm install -g tuild

Usando o Tuild

Fiz um screencast mostrando como trabalhar com ele usando a linha de comando – sim, também funciona via linha de comando! Assim é mais facil para você entender:

Códigos usados no screencast:

$ tuild css css/ estilos.min.css
$ tuild js js/plugins.js+js/scripts.js javascript.min.js
$ tuild html arquivo.html > index.html

Agora você só precisa aprender mais sobre ele escrevendo no terminal:

$ tuild --help

Bônus: Assistindo arquivos

Não mostrei no vídeo como trabalhar assistindo os arquivos, mas vou explicar bem rapidinho aqui…. O sistema começará a monitorar o arquivo, checando de tempo em tempo se houve alterações no arquivo, se houver, ele meio que faz o que o vídeo fez, mas sozinho – automaticamente -, a sintax é esta:

$ tuild <modulo> --watch <arquivo-assitido.ext> <arquivo-alvo.ext>

E alguns exemplos:

# Monitora todos os arquivos js da pasta "lib" e cria o código minified no arquivo "scripts.js"
$ tuild js --watch lib/ scripts.js

# Monitora o arquivo "estilos.css" e cria o código minified no arquivo "estilos.min.css"
$ tuild css --watch estilos.css estilos.min.css

Se você precisar de qualquer outra ajuda, digite no terminal “tuild -h” e seja feliz! Recomendo também dar uma lida no código fonte, para entender bem como funciona…

Quem quiser saber de mais detalhes sobre o projeto, esta é a página do projeto: https://github.com/mateus007/tuild

Percebeu o leque de possibilidades que o Tuild pode te trazer? Agora é só usar 😛

Até a próxima.

6 Comentários

  1. Suissa disse:
    1 de abril de 2011 às 15:48

    Show de bola!!!!

  2. Emerson Vinicius disse:
    2 de abril de 2011 às 04:32

    Bom post, mas é serio que voce usa o macports? nossa!!

    1. Mateus Souza disse:
      2 de abril de 2011 às 08:35

      Sim… qual é o problema? rs

  3. Jackson disse:
    2 de abril de 2011 às 14:37

    Caramba, parece o Selton Mello falando…rs

    Muito bacana a ferramenta, parabéns!

    Abraço

  4. Mateus Leon disse:
    5 de setembro de 2013 às 11:59

    Fala mano, tudo certo?

    Estou aprendendo um pouco sobre Node.js e achei teu programa bem legal! Só não consegui ver o screencast. Você pode disponibilizá-lo em outro lugar ou ver o que aconteceu com esse?

    Abs!

    1. mateussouzaweb disse:
      5 de setembro de 2013 às 12:17

      Olá Chará, você pode ver o vídeo neste link alternativo (se funcionar, rs)
      http://j19.video2.blip.tv/10540008170846/Mateus007-UsandoOTuildUmConstrutorcompressorDePeso407.mov?ir=43010&sr=4432

      O host de vídeo mudou a interface e deve ter quebrado algumas coisas por lá…

      Está meio antiga a library, precisa de uma renovação. Se você quiser incrementar o Tuild, só dar o fork no Github: https://github.com/mateus007/tuild 😉

      Abraço!

Faça um Comentário

Todas as Categorias