gulp-rev-replace icon indicating copy to clipboard operation
gulp-rev-replace copied to clipboard

.woff2 references inside css not renaming correctly

Open simondib opened this issue 7 years ago • 5 comments

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?

simondib avatar Jan 09 '18 06:01 simondib

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.

TheDancingCode avatar Feb 03 '18 09:02 TheDancingCode

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.

simondib avatar Apr 26 '18 21:04 simondib

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

TheDancingCode avatar Apr 27 '18 09:04 TheDancingCode

@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)

simondib avatar Apr 28 '18 00:04 simondib

Alright. This is another instance of #47.

I'm working on a solution.

TheDancingCode avatar Apr 28 '18 08:04 TheDancingCode