Video frames from WEBP and GIF originals are stripped off

[richardneililagan]

When using a .webp or .gif file that has video / animation frames as an input to the plugin, the output files seem to have stripped those out, and all we're left with are still images.

In my case, my pipeline is something akin to this --- nothing special I think? :

const image = require('@11ty/eleventy-img')

// ...

const imagedata = await image(IMAGE_PATH, {
  widths: [624],
  outputDir: './_site/i/',
  urlPath: '/i/',
})

// `imagedata` is then parsed to the corresponding `picture > source + img` markup.

[AleksandrHovhannisyan]

I ran into this issue myself and ended up removing animated GIFs from my site for that reason. Curious to see if there's a way to process them while retaining the frames. I know Google provides a gif2webp command-line utility (similar to cwebp) that can be used to convert animated GIFs to animated WebPs. As a temporary workaround, you might be able to process those manually and passthrough-copy them to a dedicated folder for GIFs. Not ideal, though.

[zachleat]

sharp added support in 0.30.0 which will ship with Eleventy Image v1.1.0.

Tested here

eleventy-img/test/test.js

Line 904 in ca70384

test("Animated gif", async t => {

You will need to pass in the animated prop to sharpOptions