Using Prismic Helper "asImageSrc" in Nuxt2 Vue2

I wan't to disable the compression of the Prismic Images in my Vue Component.
So I found in the Prismic documentation that :

prismicH.asImageSrc(, { auto: undefined })

So I did :

        'url(' +
        prismicH.asImageSrc(slice.primary.imagefond.url, { auto: undefined }) +
    <div class="text-center">

import * as prismicH from '@prismicio/helpers'

export default {
  name: 'HomeBlocASlice',

And I have this error :

Cannot read properties of undefined (reading 'asImageSrc')

Can anyone help me ?

Hello @ricou

Thanks for reaching out to us.

The asImageSrc helper is meant to extract the src value of a Prismic image field, and, optionally, to apply transformations to it by leveraging features from imgix CDN.
So it should be without url. Are you able to access prismicH inside backgroundImage. Did you print console?


Thank you @Priyanka
I hadn't paid attention
The easyest way is to replace the string in the url like that

imageNonCompressee(url) {
  return url.replace('?auto=compress,format', '')
1 Like