6
respostas

revreplace não está renomeando nenhum arquivo

Boa tarde! Executei o comando gulp revreplace para fazer o controle de versão dos arquivos, mas nenhum arquivo foi alterado.

Na verdade, os arquivos css ficaram com data de modificação do momento em que fiz o revreplace, mas nenhum deles foi renomeado.

Os arquivos de imagem e js nem foram afetados.

Segue abaixo como está meu gulpfile.js:

var gulp = require('gulp');
var $ = require('gulp-load-plugins')({rename: {'gulp-rev-delete-original':'revdel', 'gulp-if': 'if'}});


/* Tasks base */
gulp.task('copy', function() {
    return gulp.src(['site/assets/{img,font}/**/*', 'site/app.yaml'], {base: 'site'})
        .pipe(gulp.dest('dist'));
});

gulp.task('clean', function() {
    return gulp.src('dist/', {read: false})
        .pipe($.clean());
});



/* Minificação */
gulp.task('minify-js', function() {
  return gulp.src('site/**/*.js')
    .pipe($.uglify())
    .pipe(gulp.dest('dist/'))
});

gulp.task('minify-css', function() {
  return gulp.src('site/**/*.css')
    .pipe($.cssnano({safe: true}))
    .pipe(gulp.dest('dist/'))
});

gulp.task('minify-html', function() {
  return gulp.src('site/**/*.html')
    .pipe($.htmlmin({collapseWhitespace: true}))
    .pipe(gulp.dest('dist/'))
});



/* Concatenação */
gulp.task('useref', function () {
    return gulp.src('site/index.html')
        .pipe($.useref())
        .pipe($.if('*.html', $.inlineSource()))
        .pipe($.if('*.html', $.htmlmin({collapseWhitespace: true})))
        .pipe($.if('*.js', $.uglify()))
        .pipe($.if('*.css', $.cssnano({safe: true})))
        .pipe(gulp.dest('dist'));
});



/* Imagens */
gulp.task('imagemin', function() {
    return gulp.src('site/assets/img/*')
        .pipe($.imagemin({
            progressive: true,
            svgoPlugins: [
                {removeViewBox: false},
                {cleanupIDs: false}
            ]
        }))
        .pipe(gulp.dest('dist/assets/img'));
});



/* Revisão de arquivos */
gulp.task('rev', function(){
  return gulp.src(['dist/**/*.{css,js,jpg,jpeg,png,svg}'])
    .pipe($.rev())
    .pipe($.revdel())
    .pipe(gulp.dest('dist/'))
    .pipe($.rev.manifest())
    .pipe(gulp.dest('dist/'))
})

gulp.task('revreplace', function(){
  return gulp.src(['dist/index.html', 'dist/app.yaml', 'dist/**/*.css'])
    .pipe($.revReplace({
        manifest: gulp.src('dist/rev-manifest.json', {
            allowEmpty : true
        }),
        replaceInExtensions: ['.html', '.yaml', '.js', '.css']
    }))
    .pipe(gulp.dest('dist/'));
});



/* Alias */
gulp.task('minify', gulp.parallel('minify-js', 'minify-css', 'minify-html'));
gulp.task('build', $.sequence(['minify-js', 'minify-css', 'imagemin'], 'useref', 'revreplace'));
gulp.task('default', $.sequence('clean', 'copy', 'build'));
6 respostas

Fala ai Cintia, tudo bem? Como eu fiz o curso ja faz um bom tempo, poderia me dizer o que precisa fazer? Talvez tenha um jeito novo de se fazer o que precisa.

Fico no aguardo.

Tudo bem, Matheus, e você? Então, estou na aula 08 - Cache HTTP. A ideia seria o gulp renomear meus arquivos, se não me engano usando um hash do conteúdo. Eu poderia configurar um cache alto no servidor com tranquilidade porque as URLs mudariam quando eu fizesse alguma alteração no site.

O problema é que eu executei o comando rev replace, mas o gulp "nem tocou" nos arquivos .js nem nas imagens. Quanto aos .css, eles aparecem com data de modificação, mas aparentemente não teve nenhuma alteração, pelo menos não renomeou igual ao que aconteceu com os arquivos do instrutor.

Entendi, consegue compartilhar o seu projeto comigo? Assim eu consigo simular o problema por aqui e analisar com mais calma.

Pode compartilhar através do Github e Google Drive (zipado).

Fico no aguardo e desculpa, devia ter pedido o projeto junto com a resposta anterior, acabei esquecendo desse detalhe.

Realizei o teste aqui Cintia, o comando está funcionando corretamente, ele está renomeando os assets, na verdade, ele está duplicando o hash.

A primeira vez que gerou o dist, os arquivos .css se chamavam:

reset-6b8776077a.css
base-181543cb23.css
block-buttons-2ecc7d7045.css
block-categoriaCard-4bad1c4cb2.css
block-conteudo-9be6e80ca1.css
block-cursoCard-6cef42515e.css
block-depoimentos-25ad1aa394.css
block-elasticMedia-fedac88285.css
block-footer-7fb9711061.css
block-footer-listaCursos-a6494ebc20.css
block-form-erro-d8e82ebd89.css
block-grupoCaelum-307a6f0779.css
block-header-988b537877.css
block-header-busca-0787c12a7d.css
block-highlighted-d471066ffd.css
block-painelPlanos-b4f45d3e29.css
block-titulo-destaque-d4da51ed1b.css
block-titulos-edfeab9c31.css
colors-ea5369db7e.css
estilos-82564b0e5e.css
font-e5dbf30eae.css
home-aprenda-a1fe6ac7f9.css
home-cad4a5c033.css
home-diferenciais-84750480a5.css
home-fundo-fbd5ac06e7.css

Após rodar o revreplace, mudaram para:

block-conteudo-9be6e80ca1-9be6e80ca1.css
base-181543cb23-181543cb23.css
block-buttons-2ecc7d7045-2ecc7d7045.css
block-categoriaCard-4bad1c4cb2-4bad1c4cb2.css
block-cursoCard-6cef42515e-6cef42515e.css
block-depoimentos-25ad1aa394-25ad1aa394.css
block-elasticMedia-fedac88285-fedac88285.css
block-footer-7fb9711061-7fb9711061.css
block-footer-listaCursos-a6494ebc20-a6494ebc20.css
block-form-erro-d8e82ebd89-d8e82ebd89.css
block-grupoCaelum-307a6f0779-307a6f0779.css
block-header-988b537877-988b537877.css
block-header-busca-0787c12a7d-0787c12a7d.css
block-highlighted-d471066ffd-d471066ffd.css
block-painelPlanos-b4f45d3e29-b4f45d3e29.css
block-titulo-destaque-d4da51ed1b-d4da51ed1b.css
block-titulos-edfeab9c31-edfeab9c31.css
colors-ea5369db7e-ea5369db7e.css
estilos-82564b0e5e-92aaea8e87.css
font-e5dbf30eae-e5dbf30eae.css
home-aprenda-a1fe6ac7f9-a1fe6ac7f9.css
home-cad4a5c033-cad4a5c033.css
home-diferenciais-84750480a5-1ac8f94347.css
home-fundo-fbd5ac06e7-0816cee267.css
reset-6b8776077a-6b8776077a.css

Veja que foi adicionado o mesmo hash no final de cada arquivo.

Espero ter ajudado.

Mas isso não acontece quando eu executo o comando. Quando o dist foi gerado, os arquivos tinham nomes sem hash e depois do revreplace continuaram do mesmo jeito.

Me perdoe! Eu não te avisei que o meu projeto está na branch work. Você fez o teste com os arquivos do instrutor. Perdão.

Poderia verificar de novo? https://github.com/Cintia-Teixeira/performance-web/tree/work/dist/assets

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