Expo Config Plugin (Custom Dev Client)

[hirbod]

If anybody want to use this package with an expo custom dev client and eas:

// create a file like plugins/withAnimatedWebPSupport.js

const {
    createRunOncePlugin,
    withGradleProperties
} = require('@expo/config-plugins');

const withAnimatedWebPSupport = (config) => {

    const propertyToModify = {
        type: 'property',
        key: 'expo.webp.animated',
        value: true,
    };

    return withGradleProperties(config, (config) => {
        config.modResults = config.modResults.filter(
            (item) => !(item.type === propertyToModify.type && item.key === propertyToModify.key)
        );

        config.modResults.push(propertyToModify);

        return config;
    });
};

module.exports = createRunOncePlugin(withAnimatedWebPSupport, 'animated-webp-support', '1.0.0');

And import like that in your app.json / app.config.js (expo.plugins)

    ['./plugins/withAnimatedWebPSupport'],

iOS will work OOTB after installing the pod. I also have a FastImage Implementation if anyone is interested.

[ggepenyan]

@hirbod can you please provider fastimage implementation? I use Expo and really miss that. Also is there any way to do it without custom client? I just need to add webp image support for the ios 12-13. <Image /> has webp support for all devices instead ios 12-13. Thanks in advance.

[hirbod]

@ggepenyan sure, here is my implementation: https://gist.github.com/hirbod/07c6641970c9406ff35a7271dda1f01c

You can't do it without a custom dev client though, it is mandatory (and I really recommend to free you from limitations of Expo Go. I love Expo but I also need that little extra freedom, specially for such cases)

[hasanfd]

Hello @hirbod, thanks for the fantastic work! I managed to run animated webps with Expo finally.

[hirbod]

I am using it with FastImage, but you're right, they play faster as the actually are. Haven't digged into that