Gatsby: How to polyfill picture in gatsbyjs

[TylerBarnes]

Hey there,
I've been trying to polyfill the picture tag using picturefill.
I've tried all 3 of the following with no luck; I still get "the picture tag is unrecognized in this browser" in IE11.

exports.onClientEntry = async () => {
  await import("picturefill/dist/plugins/mutation/pf.mutation");
  const picturefill = await import("picturefill");
  picturefill.default();
};

require("picturefill/dist/plugins/mutation/pf.mutation");
const picturefill = require("picturefill");

exports.onClientEntry = () => picturefill();

const picturefill = require("picturefill");

exports.onClientEntry = () => picturefill();

exports.onRouteUpdate = () => picturefill();

https://pfmutations-test.netlify.com/
https://github.com/TylerBarnes/pfmutations-test-gatsby

Is there a standard way of polyfilling picture in gatsby? These don't seem to work.

[KyleAMathews]

Polyfilling picture isn't strictly necessary (as you perhaps know) as older browsers will fall back on img.

[DanielRuf]

Well, picturefill also introduces support for responsive images in IE11. Most clients and websites do not want the img fallback - so we use picturefill.

Generally picturefill and the IE code for the picture element should be loaded before all other scripts afaik.

[DanielRuf]

It seems it worked for others in previous releases, see https://github.com/gatsbyjs/gatsby/issues/7148

[TylerBarnes]

@KyleAMathews that's true but it would be nice to be able to set this up once and keep using it in future gatsby projects. Improvement is improvement :) even for IE users.
@DanielRuf I did see that before I opened this but yes, it doesn't seem to work in the current version. I guess that issue alone doesn't show us if it was actually working for @rtm619 though.
Maybe I'll try adding it to html.js tomorrow if it should load before everything else.

[gatsbot[bot]]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

Thanks for being a part of the Gatsby community! 💪💜

[gatsbot[bot]]

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it.

Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

Thanks again for being part of the Gatsby community!

[mrlubos]

@TylerBarnes @DanielRuf Hey, have you been able to get this to work? Facing the same issue. Thanks!

[TylerBarnes]

@mrlubos unfortunately, no, I never ended up having time to try to get it to work properly