.woff2 references inside css not renaming correctly

[simondib]

gulp task:

`gulp.task('rev-update-references', function(){
const manifest = gulp.src(getBuildRoot() + '/' + config.tasks.production.manifest)

return gulp.src(path.join(getBuildRoot() + '//.{css,js,json}'))
.pipe(revReplace({manifest: manifest}))
.pipe(gulp.dest(getBuildRoot()))
})`

scss:

`@font-face {
font-family: "Source Sans Pro";
font-style: normal;
font-weight: 400;
src: url(sourcesanspro-regular-webfont.woff) format("woff"),
url(sourcesanspro-regular-webfont.woff2) format("woff2")
}

body {
font-family: "Source Sans Pro";
}`

resulting css:

`@font-face {
font-family: Source Sans Pro;
font-style: normal;
font-weight: 400;
src: url(sourcesanspro-regular-webfont.woff?v=5a29a8b022) format("woff"),
url(sourcesanspro-regular-webfont.woff?v=5a29a8b0222?v=84061ed321) format("woff2")
}

body {
font-family: Source Sans Pro
}`

Problem: inside the compiled CSS the .woff2 filename is truncating the "2" in the extension, plus appending an extra (unknown) hash.

Has anyone faced a similar issue? Or can anyone confirm if woff2 is being rev'd correctly inside their referenced CSS?

[TheDancingCode]

I tried to reproduce your issue, but woff2 files are being correctly rev'd in my case. Are you using gulp-rev to create the rev'd assets? Could you check if the rev-manifest.json already contains the mistake? Because in that case the problem is with gulp-rev.

[simondib]

Hi @TheDancingCode, sorry for the terribly late replay - still not having any luck here. The manifest.json appears correct, so somewhere in the renaming task it's going bad.

Do you have both .woff and .woff2 files referenced in your css and are you appending to the file extension during the rename like my example? I suspect the regex or whatever is being used to rename the extensions is getting confused between the two strings.

[TheDancingCode]

Could you share the rev-manifest entries for the .woff and .woff2 files, or set up a small repo that reproduces the problem?

[simondib]

@TheDancingCode sure, thanks for the offer: https://github.com/simondib/gulp-rev-test

Note the fonts inside static-resources/responsive/css/global.css prior to revisioning.

Then after:

npm i
and
gulp rev

.. note now inside the CSS the double appended revision hash to the woff2 reference (as well as truncating the file extension from .woff2 -> .woff)

[TheDancingCode]

Alright. This is another instance of #47.

I'm working on a solution.