Solucionado (ver solução)
Solucionado
(ver solução)
11
respostas

Tarefa Gulp para colocar comentários no cabeçalho do CSS e JS do projeto

Bom dia pessoal,

Uma ajuda!!! Tenho um variável no gulpfile hoje para controle de número de versão. E conforme atualiza, renomeia automático o arquivo minificado com o número atualizado. Estou precisando colocar um tarefa gulp que ao invés de renomear o arquivo para controle de versão no nome dele, seja inserido um comentário automático no cabeçalho do arquivo css e js , saberiam me informar algum plugin gulp para isso? Pesquisei de diversas formas na internet, mas não encontrei nada. Vejo alguns templates assim, quando compro ou baixo temas, então acredito que seja possível fazer, mas não to sabendo como pesquisar sobre. Outra dúvida... No meu trabalho meu chefe perguntou se existe alguma forma do gulp trabalhar automaticamente sem dar nenhum comando, no Visual Studio Code, sei que existe uma extensão, embora não saiba usá-la. Existe alguma outra forma? Acho que não né!

11 respostas

Priscila, você já tentou esse aqui?

https://www.npmjs.com/package/gulp-html-replace

Sobre usar o gulp sem executar nenhum comendo, talvez tenha algum plugin lá no market place do Visual Studio Code.

Vamos ver se alguém já passou por isso e queira compartilhar conosco a solução.

Olá professor, o html-replace não é apenas para html?

Gostaria de inserir comentário no header do arquivo css e do arquivo js gerado após a concatenação e a minificação!!! Ou com a tag build consigo fazer isso independente do tipo de arquivo?

Obrigada desde já!

Isso mesmo, só funciona para HTML.

Eu ainda não precisei adicionar comentário depois do build em arquivos CSS ou JS gerados, até porque, depois do build não queremos que o arquivo minificado tenha qualquer comentário. Aliás, eles são removidos (dependendo de como você configurou o seu build ele pode deixar um apenas, do minificador).

Tenho dúvidas se há plugins nesse sentido.

Pesquisei rapidamente e o plugin que vi mais próximo do que você quer é esse:

https://www.npmjs.com/package/gulp-inject (hum.. mas é só HTML também...acabei de verificar).

Mas é um plugin com poucos mantenedores.

Obrigada professor, se achar algo a mais nesse sentido compartilho por aqui!!!

Professor, uma pergunta... Eu tentei colocar um comentário antes da chamada dos arquivos que estou minificando e colocando no html pelo html-replace, porém não consegui, não estou conseguindo fazer isso pelo gulp. Queria criar uma váriavel no início do gulpfile, com o número da versão que poderá ser alterado por ali e automaticamente quando atualizar os arquivos com npm run gulp, já incluí esse comentário antes dos arquivos minificados de css e js! Sabe me dizer se é possível inserir comentários pelo gulp? Tentei com o plugin gulp-inject também, mas acho que não estou sabendo fazer!

solução!

Eu não conheço nenhum. Porém pesquisando achei esse:

https://www.npmjs.com/package/gulp-replace

É genérico. Você passa o arquivo e ele troca uma string por outra. No seu CSS original você adiciona um texto identificador como /*version*/ (você que define) e indica o valor que entrará em seu lugar.

Ainda não usei, mas parece ser o que você quer. Dá uma conferida.

Muito obrigada!!! Deu certo!!! Abraço!!!

Que boa notícia! Sucesso e bom estudo!

Compartilhando conhecimento, descobri o gulp-header, com ele é possível inserir comentários não só no html como também no css e js. Tem opção para comentários em arquivo .json também. Abraço!

Obrigado por compartilhar mais uma vez!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software