A SOLUÇÃO ESTÁ NA TERCEIRA PARTE JUNTO COM OS ARQUIVOS.
Consigo faze-lo para arquivos .htlm e .css mas não .less.
Aqui o Gruntfile completo. Abaixo, um trecho da parte que acho que interessa mais:
watch: { all: { files: ['**/*.html','**/*.less'], options: { livereload: true } } },
O CSS contido no .less só é atualizado quando recarrego a página manualmente. Adicionei '**/*.less'
e imaginei que teria o mesmo efeito para esta extensão. Alguém sabe o que pode estar errado? Sei que existe target less, mas queria entender porque o que fiz não funciona.
============
Adicionei a task less
e utilizei npm install grunt-contrib-less --save-dev
para instalar o plugin, mas ainda estou tendo problemas. Ao alterar o arquivo .less: o terminal atesta a alteração, mas surgem problemas de NameError
e @import
na pastas /grunt-contrib-less/node_modules/less/test/less
, que impedem a compilação -- aparentemente justificados, por se tratar de uma pasta de testes. Obrigado pela ajuda. Alguma outra luz @luciorubeens?
============
Consegui. Apenas deletei a pasta /grunt-contrib-less/node_modules/less/test
e os erros pararam de ser atestados.
Na task less
o caminho dos arquivos .less
não estava bem especificado. Ficou assim:
less: { development: { options: { compress: true }, files: { 'saida.css': '/pastaOndeEstãoOsArquivos/*.less' } } },
Abaixo os arquivos atualizados - com algumas outras funcionalidades úteis:
Gruntfile: https://gist.github.com/feliupe/309cc7adf28adefb682c
package: https://gist.github.com/feliupe/91010be2a1d085af64ca