Why vue.js renders base64 image for small images

Question

I tried to set image but vuejs automatically convert it to base64 if the image is too small, If I resize the image, it works. Is there any explanation?

Answer 1

Late reply but answering for people stumbling upon this.

The url-loader webpack plugin does this and is included by default. To disable it, simply add this to your vue.config.js:

module.exports = {
    // ...
    chainWebpack: config => {
        config.module
            .rule('images')
            .use('url-loader')
            .loader('url-loader')
            .tap(options => {
                // Do not base64 encode images URLs
                options.limit = -1;
                return options;
            })
    }
}

See original answer on another question.