[{"data":1,"prerenderedAt":4903},["Reactive",2],{"navigation":3,"docs-/usage/nuxt-picture":115,"docs-/usage/nuxt-picture-surround":546},[4,20,33,105],{"title":5,"_path":6,"children":7},"Get Started","/get-started",[8,11,14,17],{"title":9,"_path":10},"Installation","/get-started/installation",{"title":12,"_path":13},"Configuration","/get-started/configuration",{"title":15,"_path":16},"Providers","/get-started/providers",{"title":18,"_path":19},"Contributing","/get-started/contributing",{"title":21,"_path":22,"children":23},"Usage","/usage",[24,27,30],{"title":25,"_path":26},"\u003CNuxtImg>","/usage/nuxt-img",{"title":28,"_path":29},"\u003CNuxtPicture>","/usage/nuxt-picture",{"title":31,"_path":32},"useImage()","/usage/use-image",{"title":15,"_path":34,"children":35},"/providers",[36,39,42,45,48,51,54,57,60,63,66,69,72,75,78,81,84,87,90,93,96,99,102],{"title":37,"_path":38},"Cloudflare","/providers/cloudflare",{"title":40,"_path":41},"Cloudimage","/providers/cloudimage",{"title":43,"_path":44},"Cloudinary","/providers/cloudinary",{"title":46,"_path":47},"Contentful","/providers/contentful",{"title":49,"_path":50},"Directus","/providers/directus",{"title":52,"_path":53},"Edgio","/providers/edgio",{"title":55,"_path":56},"Fastly","/providers/fastly",{"title":58,"_path":59},"Glide","/providers/glide",{"title":61,"_path":62},"Gumlet","/providers/gumlet",{"title":64,"_path":65},"ImageEngine","/providers/imageengine",{"title":67,"_path":68},"ImageKit","/providers/imagekit",{"title":70,"_path":71},"Imgix","/providers/imgix",{"title":73,"_path":74},"IPX","/providers/ipx",{"title":76,"_path":77},"Netlify","/providers/netlify",{"title":79,"_path":80},"Prepr","/providers/prepr",{"title":82,"_path":83},"Prismic","/providers/prismic",{"title":85,"_path":86},"Sanity","/providers/sanity",{"title":88,"_path":89},"Storyblok","/providers/storyblok",{"title":91,"_path":92},"Strapi","/providers/strapi",{"title":94,"_path":95},"Twicpics","/providers/twicpics",{"title":97,"_path":98},"Unsplash","/providers/unsplash",{"title":100,"_path":101},"Uploadcare","/providers/uploadcare",{"title":103,"_path":104},"Vercel","/providers/vercel",{"title":106,"_path":107,"children":108},"Advanced","/advanced",[109,112],{"title":110,"_path":111},"Custom Provider","/advanced/custom-provider",{"title":113,"_path":114},"Static Images","/advanced/static-images",{"_path":29,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":28,"description":119,"links":120,"body":126,"_type":541,"_id":542,"_source":543,"_file":544,"_extension":545},"usage",false,"","Discover how to use and configure the Nuxt Picture component.",[121],{"label":122,"icon":123,"to":124,"size":125},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-picture.ts","xs",{"type":127,"children":128,"toc":534},"root",[129,149,178,197,204,221,230,235,321,364,373,378,420,429,441,450,528],{"type":130,"tag":131,"props":132,"children":133},"element","p",{},[134,140,142,147],{"type":130,"tag":135,"props":136,"children":137},"code",{"className":118},[138],{"type":139,"value":28},"text",{"type":139,"value":141}," is a drop-in replacement for the native ",{"type":130,"tag":135,"props":143,"children":144},{"className":118},[145],{"type":139,"value":146},"\u003Cpicture>",{"type":139,"value":148}," tag.",{"type":130,"tag":131,"props":150,"children":151},{},[152,154,158,160,169,171,176],{"type":139,"value":153},"Usage of ",{"type":130,"tag":135,"props":155,"children":156},{"className":118},[157],{"type":139,"value":28},{"type":139,"value":159}," is almost identical to ",{"type":130,"tag":161,"props":162,"children":164},"a",{"href":163},"nuxt-img",[165],{"type":130,"tag":135,"props":166,"children":167},{"className":118},[168],{"type":139,"value":25},{"type":139,"value":170}," but also allows serving modern formats like ",{"type":130,"tag":135,"props":172,"children":173},{"className":118},[174],{"type":139,"value":175},"webp",{"type":139,"value":177}," when possible.",{"type":130,"tag":131,"props":179,"children":180},{},[181,183,195],{"type":139,"value":182},"Learn more about the ",{"type":130,"tag":161,"props":184,"children":188},{"href":185,"rel":186},"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture",[187],"nofollow",[189,193],{"type":130,"tag":135,"props":190,"children":191},{"className":118},[192],{"type":139,"value":146},{"type":139,"value":194}," tag on MDN",{"type":139,"value":196},".",{"type":130,"tag":198,"props":199,"children":201},"h2",{"id":200},"props",[202],{"type":139,"value":203},"Props",{"type":130,"tag":205,"props":206,"children":207},"callout",{},[208],{"type":130,"tag":131,"props":209,"children":210},{},[211,213],{"type":139,"value":212},"See props supported by",{"type":130,"tag":161,"props":214,"children":216},{"href":215},"/usage/nuxt-img#props",[217],{"type":130,"tag":135,"props":218,"children":219},{"className":118},[220],{"type":139,"value":25},{"type":130,"tag":222,"props":223,"children":225},"h3",{"id":224},"format",[226],{"type":130,"tag":135,"props":227,"children":228},{"className":118},[229],{"type":139,"value":224},{"type":130,"tag":131,"props":231,"children":232},{},[233],{"type":139,"value":234},"Format on pictures can be used to serve images in multiple formats. A legacy format will be generated automatically. So in the example below avif, webp and png would be generated. They will be added in the same order they are added to the format attribute.",{"type":130,"tag":236,"props":237,"children":241},"pre",{"className":238,"code":239,"language":240,"meta":118,"style":118},"language-html shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","\u003CNuxtPicture format=\"avif,webp\" src=\"/nuxt-icon.png\" ... />\n","html",[242],{"type":130,"tag":135,"props":243,"children":244},{"__ignoreMap":118},[245],{"type":130,"tag":246,"props":247,"children":250},"span",{"class":248,"line":249},"line",1,[251,257,263,269,274,279,285,289,294,298,302,307,311,316],{"type":130,"tag":246,"props":252,"children":254},{"style":253},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5",[255],{"type":139,"value":256},"\u003C",{"type":130,"tag":246,"props":258,"children":260},{"style":259},"color:#F07178;--shiki-dark:#F07178;--shiki-light:#E53935",[261],{"type":139,"value":262},"NuxtPicture",{"type":130,"tag":246,"props":264,"children":266},{"style":265},"color:#C792EA;--shiki-dark:#C792EA;--shiki-light:#9C3EDA",[267],{"type":139,"value":268}," format",{"type":130,"tag":246,"props":270,"children":271},{"style":253},[272],{"type":139,"value":273},"=",{"type":130,"tag":246,"props":275,"children":276},{"style":253},[277],{"type":139,"value":278},"\"",{"type":130,"tag":246,"props":280,"children":282},{"style":281},"color:#C3E88D;--shiki-dark:#C3E88D;--shiki-light:#91B859",[283],{"type":139,"value":284},"avif,webp",{"type":130,"tag":246,"props":286,"children":287},{"style":253},[288],{"type":139,"value":278},{"type":130,"tag":246,"props":290,"children":291},{"style":265},[292],{"type":139,"value":293}," src",{"type":130,"tag":246,"props":295,"children":296},{"style":253},[297],{"type":139,"value":273},{"type":130,"tag":246,"props":299,"children":300},{"style":253},[301],{"type":139,"value":278},{"type":130,"tag":246,"props":303,"children":304},{"style":281},[305],{"type":139,"value":306},"/nuxt-icon.png",{"type":130,"tag":246,"props":308,"children":309},{"style":253},[310],{"type":139,"value":278},{"type":130,"tag":246,"props":312,"children":313},{"style":265},[314],{"type":139,"value":315}," ...",{"type":130,"tag":246,"props":317,"children":318},{"style":253},[319],{"type":139,"value":320}," />",{"type":130,"tag":131,"props":322,"children":323},{},[324,326,330,332,337,338,343,344,349,350,355,357,362],{"type":139,"value":325},"Available formats are ",{"type":130,"tag":135,"props":327,"children":328},{"className":118},[329],{"type":139,"value":175},{"type":139,"value":331},", ",{"type":130,"tag":135,"props":333,"children":334},{"className":118},[335],{"type":139,"value":336},"avif",{"type":139,"value":331},{"type":130,"tag":135,"props":339,"children":340},{"className":118},[341],{"type":139,"value":342},"jpeg",{"type":139,"value":331},{"type":130,"tag":135,"props":345,"children":346},{"className":118},[347],{"type":139,"value":348},"jpg",{"type":139,"value":331},{"type":130,"tag":135,"props":351,"children":352},{"className":118},[353],{"type":139,"value":354},"png",{"type":139,"value":356}," and ",{"type":130,"tag":135,"props":358,"children":359},{"className":118},[360],{"type":139,"value":361},"gif",{"type":139,"value":363},". If the format is not specified, it will respect the default image format.",{"type":130,"tag":222,"props":365,"children":367},{"id":366},"legacyformat",[368],{"type":130,"tag":135,"props":369,"children":370},{"className":118},[371],{"type":139,"value":372},"legacyFormat",{"type":130,"tag":131,"props":374,"children":375},{},[376],{"type":139,"value":377},"Format used for fallback. Default is conditional:",{"type":130,"tag":379,"props":380,"children":381},"ul",{},[382,410],{"type":130,"tag":383,"props":384,"children":385},"li",{},[386,388,392,393,397,398,402,404,408],{"type":139,"value":387},"If original format supports transparency (",{"type":130,"tag":135,"props":389,"children":390},{"className":118},[391],{"type":139,"value":354},{"type":139,"value":331},{"type":130,"tag":135,"props":394,"children":395},{"className":118},[396],{"type":139,"value":175},{"type":139,"value":356},{"type":130,"tag":135,"props":399,"children":400},{"className":118},[401],{"type":139,"value":361},{"type":139,"value":403},"), ",{"type":130,"tag":135,"props":405,"children":406},{"className":118},[407],{"type":139,"value":354},{"type":139,"value":409}," is used for fallback",{"type":130,"tag":383,"props":411,"children":412},{},[413,415,419],{"type":139,"value":414},"Otherwise ",{"type":130,"tag":135,"props":416,"children":417},{"className":118},[418],{"type":139,"value":342},{"type":139,"value":409},{"type":130,"tag":222,"props":421,"children":423},{"id":422},"imgattrs",[424],{"type":130,"tag":135,"props":425,"children":426},{"className":118},[427],{"type":139,"value":428},"imgAttrs",{"type":130,"tag":131,"props":430,"children":431},{},[432,434,439],{"type":139,"value":433},"Allows you to set additional HTML-attributes on the ",{"type":130,"tag":135,"props":435,"children":436},{"className":118},[437],{"type":139,"value":438},"img",{"type":139,"value":440}," element.",{"type":130,"tag":131,"props":442,"children":443},{},[444],{"type":130,"tag":445,"props":446,"children":447},"strong",{},[448],{"type":139,"value":449},"Example:",{"type":130,"tag":236,"props":451,"children":453},{"className":238,"code":452,"language":240,"meta":118,"style":118},"\u003CNuxtPicture\n  src=\"/nuxt-icon.png\"\n  :imgAttrs=\"{id:'my-id', class:'my-class', style:'display:block', 'data-my-data': 'my-value'}\"\n/>\n",[454],{"type":130,"tag":135,"props":455,"children":456},{"__ignoreMap":118},[457,468,493,519],{"type":130,"tag":246,"props":458,"children":459},{"class":248,"line":249},[460,464],{"type":130,"tag":246,"props":461,"children":462},{"style":253},[463],{"type":139,"value":256},{"type":130,"tag":246,"props":465,"children":466},{"style":259},[467],{"type":139,"value":262},{"type":130,"tag":246,"props":469,"children":471},{"class":248,"line":470},2,[472,477,481,485,489],{"type":130,"tag":246,"props":473,"children":474},{"style":265},[475],{"type":139,"value":476},"  src",{"type":130,"tag":246,"props":478,"children":479},{"style":253},[480],{"type":139,"value":273},{"type":130,"tag":246,"props":482,"children":483},{"style":253},[484],{"type":139,"value":278},{"type":130,"tag":246,"props":486,"children":487},{"style":281},[488],{"type":139,"value":306},{"type":130,"tag":246,"props":490,"children":491},{"style":253},[492],{"type":139,"value":278},{"type":130,"tag":246,"props":494,"children":496},{"class":248,"line":495},3,[497,502,506,510,515],{"type":130,"tag":246,"props":498,"children":499},{"style":265},[500],{"type":139,"value":501},"  :imgAttrs",{"type":130,"tag":246,"props":503,"children":504},{"style":253},[505],{"type":139,"value":273},{"type":130,"tag":246,"props":507,"children":508},{"style":253},[509],{"type":139,"value":278},{"type":130,"tag":246,"props":511,"children":512},{"style":281},[513],{"type":139,"value":514},"{id:'my-id', class:'my-class', style:'display:block', 'data-my-data': 'my-value'}",{"type":130,"tag":246,"props":516,"children":517},{"style":253},[518],{"type":139,"value":278},{"type":130,"tag":246,"props":520,"children":522},{"class":248,"line":521},4,[523],{"type":130,"tag":246,"props":524,"children":525},{"style":253},[526],{"type":139,"value":527},"/>",{"type":130,"tag":529,"props":530,"children":531},"style",{},[532],{"type":139,"value":533},"html.dark .shiki span {color: var(--shiki-dark) !important;background: var(--shiki-dark-bg) !important;font-style: var(--shiki-dark-font-style) !important;font-weight: var(--shiki-dark-font-weight) !important;text-decoration: var(--shiki-dark-text-decoration) !important;}html.light .shiki span {color: var(--shiki-light) !important;background: var(--shiki-light-bg) !important;font-style: var(--shiki-light-font-style) !important;font-weight: var(--shiki-light-font-weight) !important;text-decoration: var(--shiki-light-text-decoration) !important;}",{"title":118,"searchDepth":470,"depth":470,"links":535},[536],{"id":200,"depth":470,"text":203,"children":537},[538,539,540],{"id":224,"depth":495,"text":224},{"id":366,"depth":495,"text":372},{"id":422,"depth":495,"text":428},"markdown","content:2.usage:2.nuxt-picture.md","content","2.usage/2.nuxt-picture.md","md",[547,3633],{"_path":26,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":25,"description":548,"links":549,"body":552,"_type":541,"_id":3631,"_source":543,"_file":3632,"_extension":545},"Discover how to use and configure the Nuxt Image component.",[550],{"label":122,"icon":123,"to":551,"size":125},"https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-img.ts",{"type":127,"children":553,"toc":3610},[554,568,627,631,652,695,700,742,770,774,781,786,808,851,873,887,892,915,922,927,940,953,1000,1007,1081,1089,1094,1101,1254,1262,1267,1272,1599,1613,1781,1789,1807,1814,2108,2116,2121,2141,2470,2477,2482,2548,2588,2596,2601,2710,2718,2729,2781,2884,2892,2900,2905,2916,2923,3067,3075,3087,3134,3142,3165,3177,3241,3249,3275,3437,3443,3465,3485,3606],{"type":130,"tag":131,"props":555,"children":556},{},[557,561,562,567],{"type":130,"tag":135,"props":558,"children":559},{"className":118},[560],{"type":139,"value":25},{"type":139,"value":141},{"type":130,"tag":135,"props":563,"children":564},{"className":118},[565],{"type":139,"value":566},"\u003Cimg>",{"type":139,"value":148},{"type":130,"tag":379,"props":569,"children":570},{},[571,576,588,604,616],{"type":130,"tag":383,"props":572,"children":573},{},[574],{"type":139,"value":575},"Uses built-in provider to optimize local and remote images",{"type":130,"tag":383,"props":577,"children":578},{},[579,581,586],{"type":139,"value":580},"Converts ",{"type":130,"tag":135,"props":582,"children":583},{"className":118},[584],{"type":139,"value":585},"src",{"type":139,"value":587}," to provider optimized URLs",{"type":130,"tag":383,"props":589,"children":590},{},[591,593,598,599],{"type":139,"value":592},"Automatically resizes images based on ",{"type":130,"tag":135,"props":594,"children":595},{"className":118},[596],{"type":139,"value":597},"width",{"type":139,"value":356},{"type":130,"tag":135,"props":600,"children":601},{"className":118},[602],{"type":139,"value":603},"height",{"type":130,"tag":383,"props":605,"children":606},{},[607,609,614],{"type":139,"value":608},"Generates responsive sizes when providing ",{"type":130,"tag":135,"props":610,"children":611},{"className":118},[612],{"type":139,"value":613},"sizes",{"type":139,"value":615}," option",{"type":130,"tag":383,"props":617,"children":618},{},[619,621,625],{"type":139,"value":620},"Supports native lazy loading as well as other ",{"type":130,"tag":135,"props":622,"children":623},{"className":118},[624],{"type":139,"value":566},{"type":139,"value":626}," attributes",{"type":130,"tag":198,"props":628,"children":629},{"id":116},[630],{"type":139,"value":21},{"type":130,"tag":131,"props":632,"children":633},{},[634,638,640,644,646,650],{"type":130,"tag":135,"props":635,"children":636},{"className":118},[637],{"type":139,"value":25},{"type":139,"value":639}," outputs a native ",{"type":130,"tag":135,"props":641,"children":642},{"className":118},[643],{"type":139,"value":438},{"type":139,"value":645}," tag directly (without any wrapper around it). Use it like you would use the ",{"type":130,"tag":135,"props":647,"children":648},{"className":118},[649],{"type":139,"value":566},{"type":139,"value":651}," tag:",{"type":130,"tag":236,"props":653,"children":655},{"className":238,"code":654,"language":240,"meta":118,"style":118},"\u003CNuxtImg src=\"/nuxt-icon.png\" />\n",[656],{"type":130,"tag":135,"props":657,"children":658},{"__ignoreMap":118},[659],{"type":130,"tag":246,"props":660,"children":661},{"class":248,"line":249},[662,666,671,675,679,683,687,691],{"type":130,"tag":246,"props":663,"children":664},{"style":253},[665],{"type":139,"value":256},{"type":130,"tag":246,"props":667,"children":668},{"style":259},[669],{"type":139,"value":670},"NuxtImg",{"type":130,"tag":246,"props":672,"children":673},{"style":265},[674],{"type":139,"value":293},{"type":130,"tag":246,"props":676,"children":677},{"style":253},[678],{"type":139,"value":273},{"type":130,"tag":246,"props":680,"children":681},{"style":253},[682],{"type":139,"value":278},{"type":130,"tag":246,"props":684,"children":685},{"style":281},[686],{"type":139,"value":306},{"type":130,"tag":246,"props":688,"children":689},{"style":253},[690],{"type":139,"value":278},{"type":130,"tag":246,"props":692,"children":693},{"style":253},[694],{"type":139,"value":320},{"type":130,"tag":131,"props":696,"children":697},{},[698],{"type":139,"value":699},"Will result in:",{"type":130,"tag":236,"props":701,"children":703},{"className":238,"code":702,"language":240,"meta":118,"style":118},"\u003Cimg src=\"/nuxt-icon.png\" />\n",[704],{"type":130,"tag":135,"props":705,"children":706},{"__ignoreMap":118},[707],{"type":130,"tag":246,"props":708,"children":709},{"class":248,"line":249},[710,714,718,722,726,730,734,738],{"type":130,"tag":246,"props":711,"children":712},{"style":253},[713],{"type":139,"value":256},{"type":130,"tag":246,"props":715,"children":716},{"style":259},[717],{"type":139,"value":438},{"type":130,"tag":246,"props":719,"children":720},{"style":265},[721],{"type":139,"value":293},{"type":130,"tag":246,"props":723,"children":724},{"style":253},[725],{"type":139,"value":273},{"type":130,"tag":246,"props":727,"children":728},{"style":253},[729],{"type":139,"value":278},{"type":130,"tag":246,"props":731,"children":732},{"style":281},[733],{"type":139,"value":306},{"type":130,"tag":246,"props":735,"children":736},{"style":253},[737],{"type":139,"value":278},{"type":130,"tag":246,"props":739,"children":740},{"style":253},[741],{"type":139,"value":320},{"type":130,"tag":205,"props":743,"children":744},{},[745],{"type":130,"tag":131,"props":746,"children":747},{},[748,750,755,757,761,763,768],{"type":139,"value":749},"With ",{"type":130,"tag":161,"props":751,"children":752},{"href":16},[753],{"type":139,"value":754},"default provider",{"type":139,"value":756},", you should put ",{"type":130,"tag":135,"props":758,"children":759},{"className":118},[760],{"type":139,"value":306},{"type":139,"value":762}," inside ",{"type":130,"tag":135,"props":764,"children":765},{"className":118},[766],{"type":139,"value":767},"public/",{"type":139,"value":769}," directory for Nuxt 3 make the above example work.",{"type":130,"tag":198,"props":771,"children":772},{"id":200},[773],{"type":139,"value":203},{"type":130,"tag":222,"props":775,"children":776},{"id":585},[777],{"type":130,"tag":135,"props":778,"children":779},{"className":118},[780],{"type":139,"value":585},{"type":130,"tag":131,"props":782,"children":783},{},[784],{"type":139,"value":785},"Path to image file",{"type":130,"tag":131,"props":787,"children":788},{},[789,793,795,799,801,806],{"type":130,"tag":135,"props":790,"children":791},{"className":118},[792],{"type":139,"value":585},{"type":139,"value":794}," should be in the form of an absolute path for static images in ",{"type":130,"tag":135,"props":796,"children":797},{"className":118},[798],{"type":139,"value":767},{"type":139,"value":800}," directory.\nOtherwise path that is expected by provider that starts with ",{"type":130,"tag":135,"props":802,"children":803},{"className":118},[804],{"type":139,"value":805},"/",{"type":139,"value":807}," or a URL.",{"type":130,"tag":236,"props":809,"children":811},{"className":238,"code":810,"language":240,"meta":118,"style":118},"\u003CNuxtImg src=\"/nuxt.png\" />\n",[812],{"type":130,"tag":135,"props":813,"children":814},{"__ignoreMap":118},[815],{"type":130,"tag":246,"props":816,"children":817},{"class":248,"line":249},[818,822,826,830,834,838,843,847],{"type":130,"tag":246,"props":819,"children":820},{"style":253},[821],{"type":139,"value":256},{"type":130,"tag":246,"props":823,"children":824},{"style":259},[825],{"type":139,"value":670},{"type":130,"tag":246,"props":827,"children":828},{"style":265},[829],{"type":139,"value":293},{"type":130,"tag":246,"props":831,"children":832},{"style":253},[833],{"type":139,"value":273},{"type":130,"tag":246,"props":835,"children":836},{"style":253},[837],{"type":139,"value":278},{"type":130,"tag":246,"props":839,"children":840},{"style":281},[841],{"type":139,"value":842},"/nuxt.png",{"type":130,"tag":246,"props":844,"children":845},{"style":253},[846],{"type":139,"value":278},{"type":130,"tag":246,"props":848,"children":849},{"style":253},[850],{"type":139,"value":320},{"type":130,"tag":131,"props":852,"children":853},{},[854,856,860,862,871],{"type":139,"value":855},"For image optimization when using external urls in ",{"type":130,"tag":135,"props":857,"children":858},{"className":118},[859],{"type":139,"value":585},{"type":139,"value":861},", we need to whitelist them using ",{"type":130,"tag":161,"props":863,"children":865},{"href":864},"/get-started/configuration#domains",[866],{"type":130,"tag":135,"props":867,"children":868},{"className":118},[869],{"type":139,"value":870},"domains",{"type":139,"value":872}," option.",{"type":130,"tag":222,"props":874,"children":876},{"id":875},"width-height",[877,881,883],{"type":130,"tag":135,"props":878,"children":879},{"className":118},[880],{"type":139,"value":597},{"type":139,"value":882}," / ",{"type":130,"tag":135,"props":884,"children":885},{"className":118},[886],{"type":139,"value":603},{"type":130,"tag":131,"props":888,"children":889},{},[890],{"type":139,"value":891},"Specify width/height of the image.",{"type":130,"tag":379,"props":893,"children":894},{},[895,900],{"type":130,"tag":383,"props":896,"children":897},{},[898],{"type":139,"value":899},"Use desired width/height for static sized images like icons or avatars",{"type":130,"tag":383,"props":901,"children":902},{},[903,905,913],{"type":139,"value":904},"Use original image width/height for responsive images (when using ",{"type":130,"tag":161,"props":906,"children":908},{"href":907},"#sizes",[909],{"type":130,"tag":135,"props":910,"children":911},{"className":118},[912],{"type":139,"value":613},{"type":139,"value":914},")",{"type":130,"tag":222,"props":916,"children":917},{"id":613},[918],{"type":130,"tag":135,"props":919,"children":920},{"className":118},[921],{"type":139,"value":613},{"type":130,"tag":131,"props":923,"children":924},{},[925],{"type":139,"value":926},"Specify responsive sizes.",{"type":130,"tag":131,"props":928,"children":929},{},[930,932,938],{"type":139,"value":931},"This is a space-separated list of screen size/width pairs. You can ",{"type":130,"tag":161,"props":933,"children":935},{"href":934},"/get-started/configuration#screens",[936],{"type":139,"value":937},"see a list of the defined screen sizes here",{"type":139,"value":939},").",{"type":130,"tag":131,"props":941,"children":942},{},[943,945,951],{"type":139,"value":944},"By default Nuxt generates ",{"type":130,"tag":946,"props":947,"children":948},"em",{},[949],{"type":139,"value":950},"responsive-first",{"type":139,"value":952}," sizing.",{"type":130,"tag":379,"props":954,"children":955},{},[956,968],{"type":130,"tag":383,"props":957,"children":958},{},[959,961,966],{"type":139,"value":960},"If you omit a screen size prefix (like ",{"type":130,"tag":135,"props":962,"children":963},{"className":118},[964],{"type":139,"value":965},"sm:",{"type":139,"value":967},") then this size is the 'default' size of the image. Otherwise, Nuxt will pick the smallest size as the default size of the image.",{"type":130,"tag":383,"props":969,"children":970},{},[971,973,978,980,985,987,992,994,998],{"type":139,"value":972},"This default size is used up until the next specified screen width, and so on. Each specified size pair applies ",{"type":130,"tag":946,"props":974,"children":975},{},[976],{"type":139,"value":977},"up",{"type":139,"value":979}," - so ",{"type":130,"tag":135,"props":981,"children":982},{"className":118},[983],{"type":139,"value":984},"md:400px",{"type":139,"value":986}," means that the image will be sized ",{"type":130,"tag":135,"props":988,"children":989},{"className":118},[990],{"type":139,"value":991},"400px",{"type":139,"value":993}," on ",{"type":130,"tag":135,"props":995,"children":996},{"className":118},[997],{"type":139,"value":545},{"type":139,"value":999}," screens and up.",{"type":130,"tag":131,"props":1001,"children":1002},{},[1003],{"type":130,"tag":445,"props":1004,"children":1005},{},[1006],{"type":139,"value":449},{"type":130,"tag":236,"props":1008,"children":1010},{"className":238,"code":1009,"language":240,"meta":118,"style":118},"\u003CNuxtImg\n  src=\"/logos/nuxt.png\"\n  sizes=\"100vw sm:50vw md:400px\"\n/>\n",[1011],{"type":130,"tag":135,"props":1012,"children":1013},{"__ignoreMap":118},[1014,1025,1049,1074],{"type":130,"tag":246,"props":1015,"children":1016},{"class":248,"line":249},[1017,1021],{"type":130,"tag":246,"props":1018,"children":1019},{"style":253},[1020],{"type":139,"value":256},{"type":130,"tag":246,"props":1022,"children":1023},{"style":259},[1024],{"type":139,"value":670},{"type":130,"tag":246,"props":1026,"children":1027},{"class":248,"line":470},[1028,1032,1036,1040,1045],{"type":130,"tag":246,"props":1029,"children":1030},{"style":265},[1031],{"type":139,"value":476},{"type":130,"tag":246,"props":1033,"children":1034},{"style":253},[1035],{"type":139,"value":273},{"type":130,"tag":246,"props":1037,"children":1038},{"style":253},[1039],{"type":139,"value":278},{"type":130,"tag":246,"props":1041,"children":1042},{"style":281},[1043],{"type":139,"value":1044},"/logos/nuxt.png",{"type":130,"tag":246,"props":1046,"children":1047},{"style":253},[1048],{"type":139,"value":278},{"type":130,"tag":246,"props":1050,"children":1051},{"class":248,"line":495},[1052,1057,1061,1065,1070],{"type":130,"tag":246,"props":1053,"children":1054},{"style":265},[1055],{"type":139,"value":1056},"  sizes",{"type":130,"tag":246,"props":1058,"children":1059},{"style":253},[1060],{"type":139,"value":273},{"type":130,"tag":246,"props":1062,"children":1063},{"style":253},[1064],{"type":139,"value":278},{"type":130,"tag":246,"props":1066,"children":1067},{"style":281},[1068],{"type":139,"value":1069},"100vw sm:50vw md:400px",{"type":130,"tag":246,"props":1071,"children":1072},{"style":253},[1073],{"type":139,"value":278},{"type":130,"tag":246,"props":1075,"children":1076},{"class":248,"line":521},[1077],{"type":130,"tag":246,"props":1078,"children":1079},{"style":253},[1080],{"type":139,"value":527},{"type":130,"tag":222,"props":1082,"children":1084},{"id":1083},"densities",[1085],{"type":130,"tag":135,"props":1086,"children":1087},{"className":118},[1088],{"type":139,"value":1083},{"type":130,"tag":131,"props":1090,"children":1091},{},[1092],{"type":139,"value":1093},"To generate special versions of images for screens with increased pixel density.",{"type":130,"tag":131,"props":1095,"children":1096},{},[1097],{"type":130,"tag":445,"props":1098,"children":1099},{},[1100],{"type":139,"value":449},{"type":130,"tag":236,"props":1102,"children":1104},{"className":238,"code":1103,"language":240,"meta":118,"style":118},"\u003CNuxtImg\n  src=\"/logos/nuxt.png\"\n  height=\"50\"\n  densities=\"x1 x2\"\n/>\n\u003C!--\n\u003Cimg\n  src=\"/_ipx/w_50/logos/nuxt.png\" \n  srcset=\"/_ipx/w_100/logos/nuxt.png x2\"\n/>\n-->\n",[1105],{"type":130,"tag":135,"props":1106,"children":1107},{"__ignoreMap":118},[1108,1119,1142,1167,1192,1200,1210,1219,1228,1237,1245],{"type":130,"tag":246,"props":1109,"children":1110},{"class":248,"line":249},[1111,1115],{"type":130,"tag":246,"props":1112,"children":1113},{"style":253},[1114],{"type":139,"value":256},{"type":130,"tag":246,"props":1116,"children":1117},{"style":259},[1118],{"type":139,"value":670},{"type":130,"tag":246,"props":1120,"children":1121},{"class":248,"line":470},[1122,1126,1130,1134,1138],{"type":130,"tag":246,"props":1123,"children":1124},{"style":265},[1125],{"type":139,"value":476},{"type":130,"tag":246,"props":1127,"children":1128},{"style":253},[1129],{"type":139,"value":273},{"type":130,"tag":246,"props":1131,"children":1132},{"style":253},[1133],{"type":139,"value":278},{"type":130,"tag":246,"props":1135,"children":1136},{"style":281},[1137],{"type":139,"value":1044},{"type":130,"tag":246,"props":1139,"children":1140},{"style":253},[1141],{"type":139,"value":278},{"type":130,"tag":246,"props":1143,"children":1144},{"class":248,"line":495},[1145,1150,1154,1158,1163],{"type":130,"tag":246,"props":1146,"children":1147},{"style":265},[1148],{"type":139,"value":1149},"  height",{"type":130,"tag":246,"props":1151,"children":1152},{"style":253},[1153],{"type":139,"value":273},{"type":130,"tag":246,"props":1155,"children":1156},{"style":253},[1157],{"type":139,"value":278},{"type":130,"tag":246,"props":1159,"children":1160},{"style":281},[1161],{"type":139,"value":1162},"50",{"type":130,"tag":246,"props":1164,"children":1165},{"style":253},[1166],{"type":139,"value":278},{"type":130,"tag":246,"props":1168,"children":1169},{"class":248,"line":521},[1170,1175,1179,1183,1188],{"type":130,"tag":246,"props":1171,"children":1172},{"style":265},[1173],{"type":139,"value":1174},"  densities",{"type":130,"tag":246,"props":1176,"children":1177},{"style":253},[1178],{"type":139,"value":273},{"type":130,"tag":246,"props":1180,"children":1181},{"style":253},[1182],{"type":139,"value":278},{"type":130,"tag":246,"props":1184,"children":1185},{"style":281},[1186],{"type":139,"value":1187},"x1 x2",{"type":130,"tag":246,"props":1189,"children":1190},{"style":253},[1191],{"type":139,"value":278},{"type":130,"tag":246,"props":1193,"children":1195},{"class":248,"line":1194},5,[1196],{"type":130,"tag":246,"props":1197,"children":1198},{"style":253},[1199],{"type":139,"value":527},{"type":130,"tag":246,"props":1201,"children":1203},{"class":248,"line":1202},6,[1204],{"type":130,"tag":246,"props":1205,"children":1207},{"style":1206},"color:#546E7A;--shiki-dark:#676E95;--shiki-light:#90A4AE;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[1208],{"type":139,"value":1209},"\u003C!--",{"type":130,"tag":246,"props":1211,"children":1213},{"class":248,"line":1212},7,[1214],{"type":130,"tag":246,"props":1215,"children":1216},{"style":1206},[1217],{"type":139,"value":1218},"\u003Cimg",{"type":130,"tag":246,"props":1220,"children":1222},{"class":248,"line":1221},8,[1223],{"type":130,"tag":246,"props":1224,"children":1225},{"style":1206},[1226],{"type":139,"value":1227},"  src=\"/_ipx/w_50/logos/nuxt.png\" ",{"type":130,"tag":246,"props":1229,"children":1231},{"class":248,"line":1230},9,[1232],{"type":130,"tag":246,"props":1233,"children":1234},{"style":1206},[1235],{"type":139,"value":1236},"  srcset=\"/_ipx/w_100/logos/nuxt.png x2\"",{"type":130,"tag":246,"props":1238,"children":1240},{"class":248,"line":1239},10,[1241],{"type":130,"tag":246,"props":1242,"children":1243},{"style":1206},[1244],{"type":139,"value":527},{"type":130,"tag":246,"props":1246,"children":1248},{"class":248,"line":1247},11,[1249],{"type":130,"tag":246,"props":1250,"children":1251},{"style":1206},[1252],{"type":139,"value":1253},"-->",{"type":130,"tag":222,"props":1255,"children":1257},{"id":1256},"placeholder",[1258],{"type":130,"tag":135,"props":1259,"children":1260},{"className":118},[1261],{"type":139,"value":1256},{"type":130,"tag":131,"props":1263,"children":1264},{},[1265],{"type":139,"value":1266},"Display a placeholder image before the actual image is fully loaded.",{"type":130,"tag":131,"props":1268,"children":1269},{},[1270],{"type":139,"value":1271},"The placeholder prop can be either a string, a boolean, a number, or an array. The usage is shown below for each case.",{"type":130,"tag":236,"props":1273,"children":1275},{"className":238,"code":1274,"language":240,"meta":118,"style":118},"\u003C!-- Automatically generate a placeholder based on the original image -->\n\u003Cnuxt-img src=\"/nuxt.png\" placeholder />\n\n\u003C!-- Set a width, height for the automatically generated placeholder  -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"[50, 25]\" />\n\n\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"[50, 25, 75, 5]\" />\n\n\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"15\" />\n\n\u003C!-- Provide your own image -->\n\u003Cnuxt-img src=\"/nuxt.png\" placeholder=\"./placeholder.png\" />\n",[1276],{"type":130,"tag":135,"props":1277,"children":1278},{"__ignoreMap":118},[1279,1287,1327,1330,1338,1395,1398,1406,1462,1465,1473,1529,1533,1542],{"type":130,"tag":246,"props":1280,"children":1281},{"class":248,"line":249},[1282],{"type":130,"tag":246,"props":1283,"children":1284},{"style":1206},[1285],{"type":139,"value":1286},"\u003C!-- Automatically generate a placeholder based on the original image -->",{"type":130,"tag":246,"props":1288,"children":1289},{"class":248,"line":470},[1290,1294,1298,1302,1306,1310,1314,1318,1323],{"type":130,"tag":246,"props":1291,"children":1292},{"style":253},[1293],{"type":139,"value":256},{"type":130,"tag":246,"props":1295,"children":1296},{"style":259},[1297],{"type":139,"value":163},{"type":130,"tag":246,"props":1299,"children":1300},{"style":265},[1301],{"type":139,"value":293},{"type":130,"tag":246,"props":1303,"children":1304},{"style":253},[1305],{"type":139,"value":273},{"type":130,"tag":246,"props":1307,"children":1308},{"style":253},[1309],{"type":139,"value":278},{"type":130,"tag":246,"props":1311,"children":1312},{"style":281},[1313],{"type":139,"value":842},{"type":130,"tag":246,"props":1315,"children":1316},{"style":253},[1317],{"type":139,"value":278},{"type":130,"tag":246,"props":1319,"children":1320},{"style":265},[1321],{"type":139,"value":1322}," placeholder",{"type":130,"tag":246,"props":1324,"children":1325},{"style":253},[1326],{"type":139,"value":320},{"type":130,"tag":246,"props":1328,"children":1329},{"class":248,"line":495},[],{"type":130,"tag":246,"props":1331,"children":1332},{"class":248,"line":521},[1333],{"type":130,"tag":246,"props":1334,"children":1335},{"style":1206},[1336],{"type":139,"value":1337},"\u003C!-- Set a width, height for the automatically generated placeholder  -->",{"type":130,"tag":246,"props":1339,"children":1340},{"class":248,"line":1194},[1341,1345,1349,1353,1357,1361,1365,1369,1374,1378,1382,1387,1391],{"type":130,"tag":246,"props":1342,"children":1343},{"style":253},[1344],{"type":139,"value":256},{"type":130,"tag":246,"props":1346,"children":1347},{"style":259},[1348],{"type":139,"value":163},{"type":130,"tag":246,"props":1350,"children":1351},{"style":265},[1352],{"type":139,"value":293},{"type":130,"tag":246,"props":1354,"children":1355},{"style":253},[1356],{"type":139,"value":273},{"type":130,"tag":246,"props":1358,"children":1359},{"style":253},[1360],{"type":139,"value":278},{"type":130,"tag":246,"props":1362,"children":1363},{"style":281},[1364],{"type":139,"value":842},{"type":130,"tag":246,"props":1366,"children":1367},{"style":253},[1368],{"type":139,"value":278},{"type":130,"tag":246,"props":1370,"children":1371},{"style":265},[1372],{"type":139,"value":1373}," :placeholder",{"type":130,"tag":246,"props":1375,"children":1376},{"style":253},[1377],{"type":139,"value":273},{"type":130,"tag":246,"props":1379,"children":1380},{"style":253},[1381],{"type":139,"value":278},{"type":130,"tag":246,"props":1383,"children":1384},{"style":281},[1385],{"type":139,"value":1386},"[50, 25]",{"type":130,"tag":246,"props":1388,"children":1389},{"style":253},[1390],{"type":139,"value":278},{"type":130,"tag":246,"props":1392,"children":1393},{"style":253},[1394],{"type":139,"value":320},{"type":130,"tag":246,"props":1396,"children":1397},{"class":248,"line":1202},[],{"type":130,"tag":246,"props":1399,"children":1400},{"class":248,"line":1212},[1401],{"type":130,"tag":246,"props":1402,"children":1403},{"style":1206},[1404],{"type":139,"value":1405},"\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->",{"type":130,"tag":246,"props":1407,"children":1408},{"class":248,"line":1221},[1409,1413,1417,1421,1425,1429,1433,1437,1441,1445,1449,1454,1458],{"type":130,"tag":246,"props":1410,"children":1411},{"style":253},[1412],{"type":139,"value":256},{"type":130,"tag":246,"props":1414,"children":1415},{"style":259},[1416],{"type":139,"value":163},{"type":130,"tag":246,"props":1418,"children":1419},{"style":265},[1420],{"type":139,"value":293},{"type":130,"tag":246,"props":1422,"children":1423},{"style":253},[1424],{"type":139,"value":273},{"type":130,"tag":246,"props":1426,"children":1427},{"style":253},[1428],{"type":139,"value":278},{"type":130,"tag":246,"props":1430,"children":1431},{"style":281},[1432],{"type":139,"value":842},{"type":130,"tag":246,"props":1434,"children":1435},{"style":253},[1436],{"type":139,"value":278},{"type":130,"tag":246,"props":1438,"children":1439},{"style":265},[1440],{"type":139,"value":1373},{"type":130,"tag":246,"props":1442,"children":1443},{"style":253},[1444],{"type":139,"value":273},{"type":130,"tag":246,"props":1446,"children":1447},{"style":253},[1448],{"type":139,"value":278},{"type":130,"tag":246,"props":1450,"children":1451},{"style":281},[1452],{"type":139,"value":1453},"[50, 25, 75, 5]",{"type":130,"tag":246,"props":1455,"children":1456},{"style":253},[1457],{"type":139,"value":278},{"type":130,"tag":246,"props":1459,"children":1460},{"style":253},[1461],{"type":139,"value":320},{"type":130,"tag":246,"props":1463,"children":1464},{"class":248,"line":1230},[],{"type":130,"tag":246,"props":1466,"children":1467},{"class":248,"line":1239},[1468],{"type":130,"tag":246,"props":1469,"children":1470},{"style":1206},[1471],{"type":139,"value":1472},"\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->",{"type":130,"tag":246,"props":1474,"children":1475},{"class":248,"line":1247},[1476,1480,1484,1488,1492,1496,1500,1504,1508,1512,1516,1521,1525],{"type":130,"tag":246,"props":1477,"children":1478},{"style":253},[1479],{"type":139,"value":256},{"type":130,"tag":246,"props":1481,"children":1482},{"style":259},[1483],{"type":139,"value":163},{"type":130,"tag":246,"props":1485,"children":1486},{"style":265},[1487],{"type":139,"value":293},{"type":130,"tag":246,"props":1489,"children":1490},{"style":253},[1491],{"type":139,"value":273},{"type":130,"tag":246,"props":1493,"children":1494},{"style":253},[1495],{"type":139,"value":278},{"type":130,"tag":246,"props":1497,"children":1498},{"style":281},[1499],{"type":139,"value":842},{"type":130,"tag":246,"props":1501,"children":1502},{"style":253},[1503],{"type":139,"value":278},{"type":130,"tag":246,"props":1505,"children":1506},{"style":265},[1507],{"type":139,"value":1373},{"type":130,"tag":246,"props":1509,"children":1510},{"style":253},[1511],{"type":139,"value":273},{"type":130,"tag":246,"props":1513,"children":1514},{"style":253},[1515],{"type":139,"value":278},{"type":130,"tag":246,"props":1517,"children":1518},{"style":281},[1519],{"type":139,"value":1520},"15",{"type":130,"tag":246,"props":1522,"children":1523},{"style":253},[1524],{"type":139,"value":278},{"type":130,"tag":246,"props":1526,"children":1527},{"style":253},[1528],{"type":139,"value":320},{"type":130,"tag":246,"props":1530,"children":1532},{"class":248,"line":1531},12,[],{"type":130,"tag":246,"props":1534,"children":1536},{"class":248,"line":1535},13,[1537],{"type":130,"tag":246,"props":1538,"children":1539},{"style":1206},[1540],{"type":139,"value":1541},"\u003C!-- Provide your own image -->",{"type":130,"tag":246,"props":1543,"children":1545},{"class":248,"line":1544},14,[1546,1550,1554,1558,1562,1566,1570,1574,1578,1582,1586,1591,1595],{"type":130,"tag":246,"props":1547,"children":1548},{"style":253},[1549],{"type":139,"value":256},{"type":130,"tag":246,"props":1551,"children":1552},{"style":259},[1553],{"type":139,"value":163},{"type":130,"tag":246,"props":1555,"children":1556},{"style":265},[1557],{"type":139,"value":293},{"type":130,"tag":246,"props":1559,"children":1560},{"style":253},[1561],{"type":139,"value":273},{"type":130,"tag":246,"props":1563,"children":1564},{"style":253},[1565],{"type":139,"value":278},{"type":130,"tag":246,"props":1567,"children":1568},{"style":281},[1569],{"type":139,"value":842},{"type":130,"tag":246,"props":1571,"children":1572},{"style":253},[1573],{"type":139,"value":278},{"type":130,"tag":246,"props":1575,"children":1576},{"style":265},[1577],{"type":139,"value":1322},{"type":130,"tag":246,"props":1579,"children":1580},{"style":253},[1581],{"type":139,"value":273},{"type":130,"tag":246,"props":1583,"children":1584},{"style":253},[1585],{"type":139,"value":278},{"type":130,"tag":246,"props":1587,"children":1588},{"style":281},[1589],{"type":139,"value":1590},"./placeholder.png",{"type":130,"tag":246,"props":1592,"children":1593},{"style":253},[1594],{"type":139,"value":278},{"type":130,"tag":246,"props":1596,"children":1597},{"style":253},[1598],{"type":139,"value":320},{"type":130,"tag":131,"props":1600,"children":1601},{},[1602,1604,1611],{"type":139,"value":1603},"You can also leverage ",{"type":130,"tag":161,"props":1605,"children":1606},{"href":32},[1607],{"type":130,"tag":135,"props":1608,"children":1609},{"className":118},[1610],{"type":139,"value":31},{"type":139,"value":1612}," to generate a placeholder image based on the original image, can be useful if the source is an SVG or you want better control on the modifiers:",{"type":130,"tag":236,"props":1614,"children":1618},{"className":1615,"code":1616,"language":1617,"meta":118,"style":118},"language-vue shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","\u003Cscript setup>\nconst img = useImage()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CNuxtImg :placeholder=\"img(`/nuxt.svg`, { h: 10, f: 'png', blur: 2, q: 50 })\" src=\"/nuxt.svg`\" />\n\u003C/template>\n","vue",[1619],{"type":130,"tag":135,"props":1620,"children":1621},{"__ignoreMap":118},[1622,1644,1673,1689,1692,1708,1766],{"type":130,"tag":246,"props":1623,"children":1624},{"class":248,"line":249},[1625,1629,1634,1639],{"type":130,"tag":246,"props":1626,"children":1627},{"style":253},[1628],{"type":139,"value":256},{"type":130,"tag":246,"props":1630,"children":1631},{"style":259},[1632],{"type":139,"value":1633},"script",{"type":130,"tag":246,"props":1635,"children":1636},{"style":265},[1637],{"type":139,"value":1638}," setup",{"type":130,"tag":246,"props":1640,"children":1641},{"style":253},[1642],{"type":139,"value":1643},">",{"type":130,"tag":246,"props":1645,"children":1646},{"class":248,"line":470},[1647,1652,1658,1662,1668],{"type":130,"tag":246,"props":1648,"children":1649},{"style":265},[1650],{"type":139,"value":1651},"const",{"type":130,"tag":246,"props":1653,"children":1655},{"style":1654},"color:#EEFFFF;--shiki-dark:#BABED8;--shiki-light:#90A4AE",[1656],{"type":139,"value":1657}," img ",{"type":130,"tag":246,"props":1659,"children":1660},{"style":253},[1661],{"type":139,"value":273},{"type":130,"tag":246,"props":1663,"children":1665},{"style":1664},"color:#82AAFF;--shiki-dark:#82AAFF;--shiki-light:#6182B8",[1666],{"type":139,"value":1667}," useImage",{"type":130,"tag":246,"props":1669,"children":1670},{"style":1654},[1671],{"type":139,"value":1672},"()",{"type":130,"tag":246,"props":1674,"children":1675},{"class":248,"line":495},[1676,1681,1685],{"type":130,"tag":246,"props":1677,"children":1678},{"style":253},[1679],{"type":139,"value":1680},"\u003C/",{"type":130,"tag":246,"props":1682,"children":1683},{"style":259},[1684],{"type":139,"value":1633},{"type":130,"tag":246,"props":1686,"children":1687},{"style":253},[1688],{"type":139,"value":1643},{"type":130,"tag":246,"props":1690,"children":1691},{"class":248,"line":521},[],{"type":130,"tag":246,"props":1693,"children":1694},{"class":248,"line":1194},[1695,1699,1704],{"type":130,"tag":246,"props":1696,"children":1697},{"style":253},[1698],{"type":139,"value":256},{"type":130,"tag":246,"props":1700,"children":1701},{"style":259},[1702],{"type":139,"value":1703},"template",{"type":130,"tag":246,"props":1705,"children":1706},{"style":253},[1707],{"type":139,"value":1643},{"type":130,"tag":246,"props":1709,"children":1710},{"class":248,"line":1202},[1711,1716,1720,1724,1728,1732,1737,1741,1745,1749,1753,1758,1762],{"type":130,"tag":246,"props":1712,"children":1713},{"style":253},[1714],{"type":139,"value":1715},"  \u003C",{"type":130,"tag":246,"props":1717,"children":1718},{"style":259},[1719],{"type":139,"value":670},{"type":130,"tag":246,"props":1721,"children":1722},{"style":265},[1723],{"type":139,"value":1373},{"type":130,"tag":246,"props":1725,"children":1726},{"style":253},[1727],{"type":139,"value":273},{"type":130,"tag":246,"props":1729,"children":1730},{"style":253},[1731],{"type":139,"value":278},{"type":130,"tag":246,"props":1733,"children":1734},{"style":281},[1735],{"type":139,"value":1736},"img(`/nuxt.svg`, { h: 10, f: 'png', blur: 2, q: 50 })",{"type":130,"tag":246,"props":1738,"children":1739},{"style":253},[1740],{"type":139,"value":278},{"type":130,"tag":246,"props":1742,"children":1743},{"style":265},[1744],{"type":139,"value":293},{"type":130,"tag":246,"props":1746,"children":1747},{"style":253},[1748],{"type":139,"value":273},{"type":130,"tag":246,"props":1750,"children":1751},{"style":253},[1752],{"type":139,"value":278},{"type":130,"tag":246,"props":1754,"children":1755},{"style":281},[1756],{"type":139,"value":1757},"/nuxt.svg`",{"type":130,"tag":246,"props":1759,"children":1760},{"style":253},[1761],{"type":139,"value":278},{"type":130,"tag":246,"props":1763,"children":1764},{"style":253},[1765],{"type":139,"value":320},{"type":130,"tag":246,"props":1767,"children":1768},{"class":248,"line":1212},[1769,1773,1777],{"type":130,"tag":246,"props":1770,"children":1771},{"style":253},[1772],{"type":139,"value":1680},{"type":130,"tag":246,"props":1774,"children":1775},{"style":259},[1776],{"type":139,"value":1703},{"type":130,"tag":246,"props":1778,"children":1779},{"style":253},[1780],{"type":139,"value":1643},{"type":130,"tag":222,"props":1782,"children":1784},{"id":1783},"provider",[1785],{"type":130,"tag":135,"props":1786,"children":1787},{"className":118},[1788],{"type":139,"value":1783},{"type":130,"tag":131,"props":1790,"children":1791},{},[1792,1794,1800,1802],{"type":139,"value":1793},"Use other provider instead of default ",{"type":130,"tag":161,"props":1795,"children":1797},{"href":1796},"/get-started/configuration#provider",[1798],{"type":139,"value":1799},"provider option",{"type":139,"value":1801}," specified in ",{"type":130,"tag":135,"props":1803,"children":1804},{"className":118},[1805],{"type":139,"value":1806},"nuxt.config",{"type":130,"tag":131,"props":1808,"children":1809},{},[1810],{"type":130,"tag":445,"props":1811,"children":1812},{},[1813],{"type":139,"value":449},{"type":130,"tag":1815,"props":1816,"children":1817},"code-group",{},[1818,1975],{"type":130,"tag":236,"props":1819,"children":1822},{"className":238,"code":1820,"filename":1821,"language":240,"meta":118,"style":118},"\u003Ctemplate>\n  \u003CNuxtImg\n    provider=\"cloudinary\"\n    src=\"/remote/nuxt-org/blog/going-full-static/main.png\"\n    width=\"300\"\n    height=\"169\"\n  />\n\u003C/template>\n","index.vue",[1823],{"type":130,"tag":135,"props":1824,"children":1825},{"__ignoreMap":118},[1826,1841,1852,1877,1902,1927,1952,1960],{"type":130,"tag":246,"props":1827,"children":1828},{"class":248,"line":249},[1829,1833,1837],{"type":130,"tag":246,"props":1830,"children":1831},{"style":253},[1832],{"type":139,"value":256},{"type":130,"tag":246,"props":1834,"children":1835},{"style":259},[1836],{"type":139,"value":1703},{"type":130,"tag":246,"props":1838,"children":1839},{"style":253},[1840],{"type":139,"value":1643},{"type":130,"tag":246,"props":1842,"children":1843},{"class":248,"line":470},[1844,1848],{"type":130,"tag":246,"props":1845,"children":1846},{"style":253},[1847],{"type":139,"value":1715},{"type":130,"tag":246,"props":1849,"children":1850},{"style":259},[1851],{"type":139,"value":670},{"type":130,"tag":246,"props":1853,"children":1854},{"class":248,"line":495},[1855,1860,1864,1868,1873],{"type":130,"tag":246,"props":1856,"children":1857},{"style":265},[1858],{"type":139,"value":1859},"    provider",{"type":130,"tag":246,"props":1861,"children":1862},{"style":253},[1863],{"type":139,"value":273},{"type":130,"tag":246,"props":1865,"children":1866},{"style":253},[1867],{"type":139,"value":278},{"type":130,"tag":246,"props":1869,"children":1870},{"style":281},[1871],{"type":139,"value":1872},"cloudinary",{"type":130,"tag":246,"props":1874,"children":1875},{"style":253},[1876],{"type":139,"value":278},{"type":130,"tag":246,"props":1878,"children":1879},{"class":248,"line":521},[1880,1885,1889,1893,1898],{"type":130,"tag":246,"props":1881,"children":1882},{"style":265},[1883],{"type":139,"value":1884},"    src",{"type":130,"tag":246,"props":1886,"children":1887},{"style":253},[1888],{"type":139,"value":273},{"type":130,"tag":246,"props":1890,"children":1891},{"style":253},[1892],{"type":139,"value":278},{"type":130,"tag":246,"props":1894,"children":1895},{"style":281},[1896],{"type":139,"value":1897},"/remote/nuxt-org/blog/going-full-static/main.png",{"type":130,"tag":246,"props":1899,"children":1900},{"style":253},[1901],{"type":139,"value":278},{"type":130,"tag":246,"props":1903,"children":1904},{"class":248,"line":1194},[1905,1910,1914,1918,1923],{"type":130,"tag":246,"props":1906,"children":1907},{"style":265},[1908],{"type":139,"value":1909},"    width",{"type":130,"tag":246,"props":1911,"children":1912},{"style":253},[1913],{"type":139,"value":273},{"type":130,"tag":246,"props":1915,"children":1916},{"style":253},[1917],{"type":139,"value":278},{"type":130,"tag":246,"props":1919,"children":1920},{"style":281},[1921],{"type":139,"value":1922},"300",{"type":130,"tag":246,"props":1924,"children":1925},{"style":253},[1926],{"type":139,"value":278},{"type":130,"tag":246,"props":1928,"children":1929},{"class":248,"line":1202},[1930,1935,1939,1943,1948],{"type":130,"tag":246,"props":1931,"children":1932},{"style":265},[1933],{"type":139,"value":1934},"    height",{"type":130,"tag":246,"props":1936,"children":1937},{"style":253},[1938],{"type":139,"value":273},{"type":130,"tag":246,"props":1940,"children":1941},{"style":253},[1942],{"type":139,"value":278},{"type":130,"tag":246,"props":1944,"children":1945},{"style":281},[1946],{"type":139,"value":1947},"169",{"type":130,"tag":246,"props":1949,"children":1950},{"style":253},[1951],{"type":139,"value":278},{"type":130,"tag":246,"props":1953,"children":1954},{"class":248,"line":1212},[1955],{"type":130,"tag":246,"props":1956,"children":1957},{"style":253},[1958],{"type":139,"value":1959},"  />",{"type":130,"tag":246,"props":1961,"children":1962},{"class":248,"line":1221},[1963,1967,1971],{"type":130,"tag":246,"props":1964,"children":1965},{"style":253},[1966],{"type":139,"value":1680},{"type":130,"tag":246,"props":1968,"children":1969},{"style":259},[1970],{"type":139,"value":1703},{"type":130,"tag":246,"props":1972,"children":1973},{"style":253},[1974],{"type":139,"value":1643},{"type":130,"tag":236,"props":1976,"children":1981},{"className":1977,"code":1978,"filename":1979,"language":1980,"meta":118,"style":118},"language-ts shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","export default defineNuxtConfig({\n  image: {\n    cloudinary: {\n      baseURL: 'https://res.cloudinary.com/nuxt/image/upload/',\n    },\n  },\n})\n","nuxt.config.ts","ts",[1982],{"type":130,"tag":135,"props":1983,"children":1984},{"__ignoreMap":118},[1985,2014,2032,2048,2080,2088,2096],{"type":130,"tag":246,"props":1986,"children":1987},{"class":248,"line":249},[1988,1994,1999,2004,2009],{"type":130,"tag":246,"props":1989,"children":1991},{"style":1990},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[1992],{"type":139,"value":1993},"export",{"type":130,"tag":246,"props":1995,"children":1996},{"style":1990},[1997],{"type":139,"value":1998}," default",{"type":130,"tag":246,"props":2000,"children":2001},{"style":1664},[2002],{"type":139,"value":2003}," defineNuxtConfig",{"type":130,"tag":246,"props":2005,"children":2006},{"style":1654},[2007],{"type":139,"value":2008},"(",{"type":130,"tag":246,"props":2010,"children":2011},{"style":253},[2012],{"type":139,"value":2013},"{",{"type":130,"tag":246,"props":2015,"children":2016},{"class":248,"line":470},[2017,2022,2027],{"type":130,"tag":246,"props":2018,"children":2019},{"style":259},[2020],{"type":139,"value":2021},"  image",{"type":130,"tag":246,"props":2023,"children":2024},{"style":253},[2025],{"type":139,"value":2026},":",{"type":130,"tag":246,"props":2028,"children":2029},{"style":253},[2030],{"type":139,"value":2031}," {",{"type":130,"tag":246,"props":2033,"children":2034},{"class":248,"line":495},[2035,2040,2044],{"type":130,"tag":246,"props":2036,"children":2037},{"style":259},[2038],{"type":139,"value":2039},"    cloudinary",{"type":130,"tag":246,"props":2041,"children":2042},{"style":253},[2043],{"type":139,"value":2026},{"type":130,"tag":246,"props":2045,"children":2046},{"style":253},[2047],{"type":139,"value":2031},{"type":130,"tag":246,"props":2049,"children":2050},{"class":248,"line":521},[2051,2056,2060,2065,2070,2075],{"type":130,"tag":246,"props":2052,"children":2053},{"style":259},[2054],{"type":139,"value":2055},"      baseURL",{"type":130,"tag":246,"props":2057,"children":2058},{"style":253},[2059],{"type":139,"value":2026},{"type":130,"tag":246,"props":2061,"children":2062},{"style":253},[2063],{"type":139,"value":2064}," '",{"type":130,"tag":246,"props":2066,"children":2067},{"style":281},[2068],{"type":139,"value":2069},"https://res.cloudinary.com/nuxt/image/upload/",{"type":130,"tag":246,"props":2071,"children":2072},{"style":253},[2073],{"type":139,"value":2074},"'",{"type":130,"tag":246,"props":2076,"children":2077},{"style":253},[2078],{"type":139,"value":2079},",",{"type":130,"tag":246,"props":2081,"children":2082},{"class":248,"line":1194},[2083],{"type":130,"tag":246,"props":2084,"children":2085},{"style":253},[2086],{"type":139,"value":2087},"    },",{"type":130,"tag":246,"props":2089,"children":2090},{"class":248,"line":1202},[2091],{"type":130,"tag":246,"props":2092,"children":2093},{"style":253},[2094],{"type":139,"value":2095},"  },",{"type":130,"tag":246,"props":2097,"children":2098},{"class":248,"line":1212},[2099,2104],{"type":130,"tag":246,"props":2100,"children":2101},{"style":253},[2102],{"type":139,"value":2103},"}",{"type":130,"tag":246,"props":2105,"children":2106},{"style":1654},[2107],{"type":139,"value":914},{"type":130,"tag":222,"props":2109,"children":2111},{"id":2110},"preset",[2112],{"type":130,"tag":135,"props":2113,"children":2114},{"className":118},[2115],{"type":139,"value":2110},{"type":130,"tag":131,"props":2117,"children":2118},{},[2119],{"type":139,"value":2120},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",{"type":130,"tag":205,"props":2122,"children":2123},{},[2124],{"type":130,"tag":131,"props":2125,"children":2126},{},[2127,2129,2135,2137],{"type":139,"value":2128},"We can define presets using ",{"type":130,"tag":161,"props":2130,"children":2132},{"href":2131},"/get-started/configuration#presets",[2133],{"type":139,"value":2134},"presets options",{"type":139,"value":2136}," in ",{"type":130,"tag":135,"props":2138,"children":2139},{"className":118},[2140],{"type":139,"value":1806},{"type":130,"tag":1815,"props":2142,"children":2143},{},[2144,2238],{"type":130,"tag":236,"props":2145,"children":2147},{"className":238,"code":2146,"filename":1821,"language":240,"meta":118,"style":118},"\u003Ctemplate>\n  \u003CNuxtImg preset=\"cover\" src=\"/nuxt-icon.png\" />\n\u003C/template>\n",[2148],{"type":130,"tag":135,"props":2149,"children":2150},{"__ignoreMap":118},[2151,2166,2223],{"type":130,"tag":246,"props":2152,"children":2153},{"class":248,"line":249},[2154,2158,2162],{"type":130,"tag":246,"props":2155,"children":2156},{"style":253},[2157],{"type":139,"value":256},{"type":130,"tag":246,"props":2159,"children":2160},{"style":259},[2161],{"type":139,"value":1703},{"type":130,"tag":246,"props":2163,"children":2164},{"style":253},[2165],{"type":139,"value":1643},{"type":130,"tag":246,"props":2167,"children":2168},{"class":248,"line":470},[2169,2173,2177,2182,2186,2190,2195,2199,2203,2207,2211,2215,2219],{"type":130,"tag":246,"props":2170,"children":2171},{"style":253},[2172],{"type":139,"value":1715},{"type":130,"tag":246,"props":2174,"children":2175},{"style":259},[2176],{"type":139,"value":670},{"type":130,"tag":246,"props":2178,"children":2179},{"style":265},[2180],{"type":139,"value":2181}," preset",{"type":130,"tag":246,"props":2183,"children":2184},{"style":253},[2185],{"type":139,"value":273},{"type":130,"tag":246,"props":2187,"children":2188},{"style":253},[2189],{"type":139,"value":278},{"type":130,"tag":246,"props":2191,"children":2192},{"style":281},[2193],{"type":139,"value":2194},"cover",{"type":130,"tag":246,"props":2196,"children":2197},{"style":253},[2198],{"type":139,"value":278},{"type":130,"tag":246,"props":2200,"children":2201},{"style":265},[2202],{"type":139,"value":293},{"type":130,"tag":246,"props":2204,"children":2205},{"style":253},[2206],{"type":139,"value":273},{"type":130,"tag":246,"props":2208,"children":2209},{"style":253},[2210],{"type":139,"value":278},{"type":130,"tag":246,"props":2212,"children":2213},{"style":281},[2214],{"type":139,"value":306},{"type":130,"tag":246,"props":2216,"children":2217},{"style":253},[2218],{"type":139,"value":278},{"type":130,"tag":246,"props":2220,"children":2221},{"style":253},[2222],{"type":139,"value":320},{"type":130,"tag":246,"props":2224,"children":2225},{"class":248,"line":495},[2226,2230,2234],{"type":130,"tag":246,"props":2227,"children":2228},{"style":253},[2229],{"type":139,"value":1680},{"type":130,"tag":246,"props":2231,"children":2232},{"style":259},[2233],{"type":139,"value":1703},{"type":130,"tag":246,"props":2235,"children":2236},{"style":253},[2237],{"type":139,"value":1643},{"type":130,"tag":236,"props":2239,"children":2241},{"className":1977,"code":2240,"filename":1979,"language":1980,"meta":118,"style":118},"export default defineNuxtConfig({\n  image: {\n    presets: {\n      cover: {\n        modifiers: {\n          fit: 'cover',\n          format: 'jpg',\n          width: 300,\n          height: 300,\n        },\n      },\n    },\n  },\n})\n",[2242],{"type":130,"tag":135,"props":2243,"children":2244},{"__ignoreMap":118},[2245,2268,2283,2299,2315,2331,2359,2387,2409,2429,2437,2445,2452,2459],{"type":130,"tag":246,"props":2246,"children":2247},{"class":248,"line":249},[2248,2252,2256,2260,2264],{"type":130,"tag":246,"props":2249,"children":2250},{"style":1990},[2251],{"type":139,"value":1993},{"type":130,"tag":246,"props":2253,"children":2254},{"style":1990},[2255],{"type":139,"value":1998},{"type":130,"tag":246,"props":2257,"children":2258},{"style":1664},[2259],{"type":139,"value":2003},{"type":130,"tag":246,"props":2261,"children":2262},{"style":1654},[2263],{"type":139,"value":2008},{"type":130,"tag":246,"props":2265,"children":2266},{"style":253},[2267],{"type":139,"value":2013},{"type":130,"tag":246,"props":2269,"children":2270},{"class":248,"line":470},[2271,2275,2279],{"type":130,"tag":246,"props":2272,"children":2273},{"style":259},[2274],{"type":139,"value":2021},{"type":130,"tag":246,"props":2276,"children":2277},{"style":253},[2278],{"type":139,"value":2026},{"type":130,"tag":246,"props":2280,"children":2281},{"style":253},[2282],{"type":139,"value":2031},{"type":130,"tag":246,"props":2284,"children":2285},{"class":248,"line":495},[2286,2291,2295],{"type":130,"tag":246,"props":2287,"children":2288},{"style":259},[2289],{"type":139,"value":2290},"    presets",{"type":130,"tag":246,"props":2292,"children":2293},{"style":253},[2294],{"type":139,"value":2026},{"type":130,"tag":246,"props":2296,"children":2297},{"style":253},[2298],{"type":139,"value":2031},{"type":130,"tag":246,"props":2300,"children":2301},{"class":248,"line":521},[2302,2307,2311],{"type":130,"tag":246,"props":2303,"children":2304},{"style":259},[2305],{"type":139,"value":2306},"      cover",{"type":130,"tag":246,"props":2308,"children":2309},{"style":253},[2310],{"type":139,"value":2026},{"type":130,"tag":246,"props":2312,"children":2313},{"style":253},[2314],{"type":139,"value":2031},{"type":130,"tag":246,"props":2316,"children":2317},{"class":248,"line":1194},[2318,2323,2327],{"type":130,"tag":246,"props":2319,"children":2320},{"style":259},[2321],{"type":139,"value":2322},"        modifiers",{"type":130,"tag":246,"props":2324,"children":2325},{"style":253},[2326],{"type":139,"value":2026},{"type":130,"tag":246,"props":2328,"children":2329},{"style":253},[2330],{"type":139,"value":2031},{"type":130,"tag":246,"props":2332,"children":2333},{"class":248,"line":1202},[2334,2339,2343,2347,2351,2355],{"type":130,"tag":246,"props":2335,"children":2336},{"style":259},[2337],{"type":139,"value":2338},"          fit",{"type":130,"tag":246,"props":2340,"children":2341},{"style":253},[2342],{"type":139,"value":2026},{"type":130,"tag":246,"props":2344,"children":2345},{"style":253},[2346],{"type":139,"value":2064},{"type":130,"tag":246,"props":2348,"children":2349},{"style":281},[2350],{"type":139,"value":2194},{"type":130,"tag":246,"props":2352,"children":2353},{"style":253},[2354],{"type":139,"value":2074},{"type":130,"tag":246,"props":2356,"children":2357},{"style":253},[2358],{"type":139,"value":2079},{"type":130,"tag":246,"props":2360,"children":2361},{"class":248,"line":1212},[2362,2367,2371,2375,2379,2383],{"type":130,"tag":246,"props":2363,"children":2364},{"style":259},[2365],{"type":139,"value":2366},"          format",{"type":130,"tag":246,"props":2368,"children":2369},{"style":253},[2370],{"type":139,"value":2026},{"type":130,"tag":246,"props":2372,"children":2373},{"style":253},[2374],{"type":139,"value":2064},{"type":130,"tag":246,"props":2376,"children":2377},{"style":281},[2378],{"type":139,"value":348},{"type":130,"tag":246,"props":2380,"children":2381},{"style":253},[2382],{"type":139,"value":2074},{"type":130,"tag":246,"props":2384,"children":2385},{"style":253},[2386],{"type":139,"value":2079},{"type":130,"tag":246,"props":2388,"children":2389},{"class":248,"line":1221},[2390,2395,2399,2405],{"type":130,"tag":246,"props":2391,"children":2392},{"style":259},[2393],{"type":139,"value":2394},"          width",{"type":130,"tag":246,"props":2396,"children":2397},{"style":253},[2398],{"type":139,"value":2026},{"type":130,"tag":246,"props":2400,"children":2402},{"style":2401},"color:#F78C6C;--shiki-dark:#F78C6C;--shiki-light:#F76D47",[2403],{"type":139,"value":2404}," 300",{"type":130,"tag":246,"props":2406,"children":2407},{"style":253},[2408],{"type":139,"value":2079},{"type":130,"tag":246,"props":2410,"children":2411},{"class":248,"line":1230},[2412,2417,2421,2425],{"type":130,"tag":246,"props":2413,"children":2414},{"style":259},[2415],{"type":139,"value":2416},"          height",{"type":130,"tag":246,"props":2418,"children":2419},{"style":253},[2420],{"type":139,"value":2026},{"type":130,"tag":246,"props":2422,"children":2423},{"style":2401},[2424],{"type":139,"value":2404},{"type":130,"tag":246,"props":2426,"children":2427},{"style":253},[2428],{"type":139,"value":2079},{"type":130,"tag":246,"props":2430,"children":2431},{"class":248,"line":1239},[2432],{"type":130,"tag":246,"props":2433,"children":2434},{"style":253},[2435],{"type":139,"value":2436},"        },",{"type":130,"tag":246,"props":2438,"children":2439},{"class":248,"line":1247},[2440],{"type":130,"tag":246,"props":2441,"children":2442},{"style":253},[2443],{"type":139,"value":2444},"      },",{"type":130,"tag":246,"props":2446,"children":2447},{"class":248,"line":1531},[2448],{"type":130,"tag":246,"props":2449,"children":2450},{"style":253},[2451],{"type":139,"value":2087},{"type":130,"tag":246,"props":2453,"children":2454},{"class":248,"line":1535},[2455],{"type":130,"tag":246,"props":2456,"children":2457},{"style":253},[2458],{"type":139,"value":2095},{"type":130,"tag":246,"props":2460,"children":2461},{"class":248,"line":1544},[2462,2466],{"type":130,"tag":246,"props":2463,"children":2464},{"style":253},[2465],{"type":139,"value":2103},{"type":130,"tag":246,"props":2467,"children":2468},{"style":1654},[2469],{"type":139,"value":914},{"type":130,"tag":222,"props":2471,"children":2472},{"id":224},[2473],{"type":130,"tag":135,"props":2474,"children":2475},{"className":118},[2476],{"type":139,"value":224},{"type":130,"tag":131,"props":2478,"children":2479},{},[2480],{"type":139,"value":2481},"In case you want to serve images in a specific format, use this prop.",{"type":130,"tag":236,"props":2483,"children":2485},{"className":238,"code":2484,"language":240,"meta":118,"style":118},"\u003CNuxtImg format=\"webp\" src=\"/nuxt-icon.png\" ... />\n",[2486],{"type":130,"tag":135,"props":2487,"children":2488},{"__ignoreMap":118},[2489],{"type":130,"tag":246,"props":2490,"children":2491},{"class":248,"line":249},[2492,2496,2500,2504,2508,2512,2516,2520,2524,2528,2532,2536,2540,2544],{"type":130,"tag":246,"props":2493,"children":2494},{"style":253},[2495],{"type":139,"value":256},{"type":130,"tag":246,"props":2497,"children":2498},{"style":259},[2499],{"type":139,"value":670},{"type":130,"tag":246,"props":2501,"children":2502},{"style":265},[2503],{"type":139,"value":268},{"type":130,"tag":246,"props":2505,"children":2506},{"style":253},[2507],{"type":139,"value":273},{"type":130,"tag":246,"props":2509,"children":2510},{"style":253},[2511],{"type":139,"value":278},{"type":130,"tag":246,"props":2513,"children":2514},{"style":281},[2515],{"type":139,"value":175},{"type":130,"tag":246,"props":2517,"children":2518},{"style":253},[2519],{"type":139,"value":278},{"type":130,"tag":246,"props":2521,"children":2522},{"style":265},[2523],{"type":139,"value":293},{"type":130,"tag":246,"props":2525,"children":2526},{"style":253},[2527],{"type":139,"value":273},{"type":130,"tag":246,"props":2529,"children":2530},{"style":253},[2531],{"type":139,"value":278},{"type":130,"tag":246,"props":2533,"children":2534},{"style":281},[2535],{"type":139,"value":306},{"type":130,"tag":246,"props":2537,"children":2538},{"style":253},[2539],{"type":139,"value":278},{"type":130,"tag":246,"props":2541,"children":2542},{"style":265},[2543],{"type":139,"value":315},{"type":130,"tag":246,"props":2545,"children":2546},{"style":253},[2547],{"type":139,"value":320},{"type":130,"tag":131,"props":2549,"children":2550},{},[2551,2552,2556,2557,2561,2562,2566,2567,2571,2572,2576,2577,2581,2582,2587],{"type":139,"value":325},{"type":130,"tag":135,"props":2553,"children":2554},{"className":118},[2555],{"type":139,"value":175},{"type":139,"value":331},{"type":130,"tag":135,"props":2558,"children":2559},{"className":118},[2560],{"type":139,"value":336},{"type":139,"value":331},{"type":130,"tag":135,"props":2563,"children":2564},{"className":118},[2565],{"type":139,"value":342},{"type":139,"value":331},{"type":130,"tag":135,"props":2568,"children":2569},{"className":118},[2570],{"type":139,"value":348},{"type":139,"value":331},{"type":130,"tag":135,"props":2573,"children":2574},{"className":118},[2575],{"type":139,"value":354},{"type":139,"value":331},{"type":130,"tag":135,"props":2578,"children":2579},{"className":118},[2580],{"type":139,"value":361},{"type":139,"value":356},{"type":130,"tag":135,"props":2583,"children":2584},{"className":118},[2585],{"type":139,"value":2586},"svg",{"type":139,"value":363},{"type":130,"tag":222,"props":2589,"children":2591},{"id":2590},"quality",[2592],{"type":130,"tag":135,"props":2593,"children":2594},{"className":118},[2595],{"type":139,"value":2590},{"type":130,"tag":131,"props":2597,"children":2598},{},[2599],{"type":139,"value":2600},"The quality for the generated image(s).",{"type":130,"tag":236,"props":2602,"children":2604},{"className":238,"code":2603,"language":240,"meta":118,"style":118},"\u003CNuxtImg src=\"/nuxt.jpg\" quality=\"80\" width=\"200\" height=\"100\" />\n",[2605],{"type":130,"tag":135,"props":2606,"children":2607},{"__ignoreMap":118},[2608],{"type":130,"tag":246,"props":2609,"children":2610},{"class":248,"line":249},[2611,2615,2619,2623,2627,2631,2636,2640,2645,2649,2653,2658,2662,2667,2671,2675,2680,2684,2689,2693,2697,2702,2706],{"type":130,"tag":246,"props":2612,"children":2613},{"style":253},[2614],{"type":139,"value":256},{"type":130,"tag":246,"props":2616,"children":2617},{"style":259},[2618],{"type":139,"value":670},{"type":130,"tag":246,"props":2620,"children":2621},{"style":265},[2622],{"type":139,"value":293},{"type":130,"tag":246,"props":2624,"children":2625},{"style":253},[2626],{"type":139,"value":273},{"type":130,"tag":246,"props":2628,"children":2629},{"style":253},[2630],{"type":139,"value":278},{"type":130,"tag":246,"props":2632,"children":2633},{"style":281},[2634],{"type":139,"value":2635},"/nuxt.jpg",{"type":130,"tag":246,"props":2637,"children":2638},{"style":253},[2639],{"type":139,"value":278},{"type":130,"tag":246,"props":2641,"children":2642},{"style":265},[2643],{"type":139,"value":2644}," quality",{"type":130,"tag":246,"props":2646,"children":2647},{"style":253},[2648],{"type":139,"value":273},{"type":130,"tag":246,"props":2650,"children":2651},{"style":253},[2652],{"type":139,"value":278},{"type":130,"tag":246,"props":2654,"children":2655},{"style":281},[2656],{"type":139,"value":2657},"80",{"type":130,"tag":246,"props":2659,"children":2660},{"style":253},[2661],{"type":139,"value":278},{"type":130,"tag":246,"props":2663,"children":2664},{"style":265},[2665],{"type":139,"value":2666}," width",{"type":130,"tag":246,"props":2668,"children":2669},{"style":253},[2670],{"type":139,"value":273},{"type":130,"tag":246,"props":2672,"children":2673},{"style":253},[2674],{"type":139,"value":278},{"type":130,"tag":246,"props":2676,"children":2677},{"style":281},[2678],{"type":139,"value":2679},"200",{"type":130,"tag":246,"props":2681,"children":2682},{"style":253},[2683],{"type":139,"value":278},{"type":130,"tag":246,"props":2685,"children":2686},{"style":265},[2687],{"type":139,"value":2688}," height",{"type":130,"tag":246,"props":2690,"children":2691},{"style":253},[2692],{"type":139,"value":273},{"type":130,"tag":246,"props":2694,"children":2695},{"style":253},[2696],{"type":139,"value":278},{"type":130,"tag":246,"props":2698,"children":2699},{"style":281},[2700],{"type":139,"value":2701},"100",{"type":130,"tag":246,"props":2703,"children":2704},{"style":253},[2705],{"type":139,"value":278},{"type":130,"tag":246,"props":2707,"children":2708},{"style":253},[2709],{"type":139,"value":320},{"type":130,"tag":222,"props":2711,"children":2713},{"id":2712},"fit",[2714],{"type":130,"tag":135,"props":2715,"children":2716},{"className":118},[2717],{"type":139,"value":2712},{"type":130,"tag":131,"props":2719,"children":2720},{},[2721,2723,2727],{"type":139,"value":2722},"The ",{"type":130,"tag":135,"props":2724,"children":2725},{"className":118},[2726],{"type":139,"value":2712},{"type":139,"value":2728}," property specifies the size of the images.\nThere are five standard values you can use with this property.",{"type":130,"tag":379,"props":2730,"children":2731},{},[2732,2741,2751,2761,2771],{"type":130,"tag":383,"props":2733,"children":2734},{},[2735,2739],{"type":130,"tag":135,"props":2736,"children":2737},{"className":118},[2738],{"type":139,"value":2194},{"type":139,"value":2740},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping/clipping to fit",{"type":130,"tag":383,"props":2742,"children":2743},{},[2744,2749],{"type":130,"tag":135,"props":2745,"children":2746},{"className":118},[2747],{"type":139,"value":2748},"contain",{"type":139,"value":2750},": Preserving aspect ratio, contain within both provided dimensions using \"letterboxing\" where necessary.",{"type":130,"tag":383,"props":2752,"children":2753},{},[2754,2759],{"type":130,"tag":135,"props":2755,"children":2756},{"className":118},[2757],{"type":139,"value":2758},"fill",{"type":139,"value":2760},": Ignore the aspect ratio of the input and stretch to both provided dimensions.",{"type":130,"tag":383,"props":2762,"children":2763},{},[2764,2769],{"type":130,"tag":135,"props":2765,"children":2766},{"className":118},[2767],{"type":139,"value":2768},"inside",{"type":139,"value":2770},": Preserving aspect ratio, resize the image to be as large as possible while ensuring its dimensions are less than or equal to both those specified.",{"type":130,"tag":383,"props":2772,"children":2773},{},[2774,2779],{"type":130,"tag":135,"props":2775,"children":2776},{"className":118},[2777],{"type":139,"value":2778},"outside",{"type":139,"value":2780},": Preserving aspect ratio, resize the image to be as small as possible while ensuring its dimensions are greater than or equal to both those specified.",{"type":130,"tag":236,"props":2782,"children":2784},{"className":238,"code":2783,"language":240,"meta":118,"style":118},"\u003CNuxtImg fit=\"cover\" src=\"/nuxt-icon.png\" width=\"200\" height=\"100\" />\n",[2785],{"type":130,"tag":135,"props":2786,"children":2787},{"__ignoreMap":118},[2788],{"type":130,"tag":246,"props":2789,"children":2790},{"class":248,"line":249},[2791,2795,2799,2804,2808,2812,2816,2820,2824,2828,2832,2836,2840,2844,2848,2852,2856,2860,2864,2868,2872,2876,2880],{"type":130,"tag":246,"props":2792,"children":2793},{"style":253},[2794],{"type":139,"value":256},{"type":130,"tag":246,"props":2796,"children":2797},{"style":259},[2798],{"type":139,"value":670},{"type":130,"tag":246,"props":2800,"children":2801},{"style":265},[2802],{"type":139,"value":2803}," fit",{"type":130,"tag":246,"props":2805,"children":2806},{"style":253},[2807],{"type":139,"value":273},{"type":130,"tag":246,"props":2809,"children":2810},{"style":253},[2811],{"type":139,"value":278},{"type":130,"tag":246,"props":2813,"children":2814},{"style":281},[2815],{"type":139,"value":2194},{"type":130,"tag":246,"props":2817,"children":2818},{"style":253},[2819],{"type":139,"value":278},{"type":130,"tag":246,"props":2821,"children":2822},{"style":265},[2823],{"type":139,"value":293},{"type":130,"tag":246,"props":2825,"children":2826},{"style":253},[2827],{"type":139,"value":273},{"type":130,"tag":246,"props":2829,"children":2830},{"style":253},[2831],{"type":139,"value":278},{"type":130,"tag":246,"props":2833,"children":2834},{"style":281},[2835],{"type":139,"value":306},{"type":130,"tag":246,"props":2837,"children":2838},{"style":253},[2839],{"type":139,"value":278},{"type":130,"tag":246,"props":2841,"children":2842},{"style":265},[2843],{"type":139,"value":2666},{"type":130,"tag":246,"props":2845,"children":2846},{"style":253},[2847],{"type":139,"value":273},{"type":130,"tag":246,"props":2849,"children":2850},{"style":253},[2851],{"type":139,"value":278},{"type":130,"tag":246,"props":2853,"children":2854},{"style":281},[2855],{"type":139,"value":2679},{"type":130,"tag":246,"props":2857,"children":2858},{"style":253},[2859],{"type":139,"value":278},{"type":130,"tag":246,"props":2861,"children":2862},{"style":265},[2863],{"type":139,"value":2688},{"type":130,"tag":246,"props":2865,"children":2866},{"style":253},[2867],{"type":139,"value":273},{"type":130,"tag":246,"props":2869,"children":2870},{"style":253},[2871],{"type":139,"value":278},{"type":130,"tag":246,"props":2873,"children":2874},{"style":281},[2875],{"type":139,"value":2701},{"type":130,"tag":246,"props":2877,"children":2878},{"style":253},[2879],{"type":139,"value":278},{"type":130,"tag":246,"props":2881,"children":2882},{"style":253},[2883],{"type":139,"value":320},{"type":130,"tag":205,"props":2885,"children":2886},{},[2887],{"type":130,"tag":131,"props":2888,"children":2889},{},[2890],{"type":139,"value":2891},"Some providers support other values.",{"type":130,"tag":222,"props":2893,"children":2895},{"id":2894},"modifiers",[2896],{"type":130,"tag":135,"props":2897,"children":2898},{"className":118},[2899],{"type":139,"value":2894},{"type":130,"tag":131,"props":2901,"children":2902},{},[2903],{"type":139,"value":2904},"In addition to the standard modifiers, each provider might have its own additional modifiers. Because these modifiers depend on the provider, refer to its documentation to know what can be used.",{"type":130,"tag":131,"props":2906,"children":2907},{},[2908,2910,2914],{"type":139,"value":2909},"Using the ",{"type":130,"tag":135,"props":2911,"children":2912},{"className":118},[2913],{"type":139,"value":2894},{"type":139,"value":2915}," prop lets you use any of these transformations.",{"type":130,"tag":131,"props":2917,"children":2918},{},[2919],{"type":130,"tag":445,"props":2920,"children":2921},{},[2922],{"type":139,"value":449},{"type":130,"tag":236,"props":2924,"children":2926},{"className":238,"code":2925,"language":240,"meta":118,"style":118},"\u003CNuxtImg\n  provider=\"cloudinary\"\n  src=\"/remote/nuxt-org/blog/going-full-static/main.png\"\n  width=\"300\"\n  height=\"169\"\n  :modifiers=\"{ roundCorner: '0:100' }\"\n/>\n",[2927],{"type":130,"tag":135,"props":2928,"children":2929},{"__ignoreMap":118},[2930,2941,2965,2988,3012,3035,3060],{"type":130,"tag":246,"props":2931,"children":2932},{"class":248,"line":249},[2933,2937],{"type":130,"tag":246,"props":2934,"children":2935},{"style":253},[2936],{"type":139,"value":256},{"type":130,"tag":246,"props":2938,"children":2939},{"style":259},[2940],{"type":139,"value":670},{"type":130,"tag":246,"props":2942,"children":2943},{"class":248,"line":470},[2944,2949,2953,2957,2961],{"type":130,"tag":246,"props":2945,"children":2946},{"style":265},[2947],{"type":139,"value":2948},"  provider",{"type":130,"tag":246,"props":2950,"children":2951},{"style":253},[2952],{"type":139,"value":273},{"type":130,"tag":246,"props":2954,"children":2955},{"style":253},[2956],{"type":139,"value":278},{"type":130,"tag":246,"props":2958,"children":2959},{"style":281},[2960],{"type":139,"value":1872},{"type":130,"tag":246,"props":2962,"children":2963},{"style":253},[2964],{"type":139,"value":278},{"type":130,"tag":246,"props":2966,"children":2967},{"class":248,"line":495},[2968,2972,2976,2980,2984],{"type":130,"tag":246,"props":2969,"children":2970},{"style":265},[2971],{"type":139,"value":476},{"type":130,"tag":246,"props":2973,"children":2974},{"style":253},[2975],{"type":139,"value":273},{"type":130,"tag":246,"props":2977,"children":2978},{"style":253},[2979],{"type":139,"value":278},{"type":130,"tag":246,"props":2981,"children":2982},{"style":281},[2983],{"type":139,"value":1897},{"type":130,"tag":246,"props":2985,"children":2986},{"style":253},[2987],{"type":139,"value":278},{"type":130,"tag":246,"props":2989,"children":2990},{"class":248,"line":521},[2991,2996,3000,3004,3008],{"type":130,"tag":246,"props":2992,"children":2993},{"style":265},[2994],{"type":139,"value":2995},"  width",{"type":130,"tag":246,"props":2997,"children":2998},{"style":253},[2999],{"type":139,"value":273},{"type":130,"tag":246,"props":3001,"children":3002},{"style":253},[3003],{"type":139,"value":278},{"type":130,"tag":246,"props":3005,"children":3006},{"style":281},[3007],{"type":139,"value":1922},{"type":130,"tag":246,"props":3009,"children":3010},{"style":253},[3011],{"type":139,"value":278},{"type":130,"tag":246,"props":3013,"children":3014},{"class":248,"line":1194},[3015,3019,3023,3027,3031],{"type":130,"tag":246,"props":3016,"children":3017},{"style":265},[3018],{"type":139,"value":1149},{"type":130,"tag":246,"props":3020,"children":3021},{"style":253},[3022],{"type":139,"value":273},{"type":130,"tag":246,"props":3024,"children":3025},{"style":253},[3026],{"type":139,"value":278},{"type":130,"tag":246,"props":3028,"children":3029},{"style":281},[3030],{"type":139,"value":1947},{"type":130,"tag":246,"props":3032,"children":3033},{"style":253},[3034],{"type":139,"value":278},{"type":130,"tag":246,"props":3036,"children":3037},{"class":248,"line":1202},[3038,3043,3047,3051,3056],{"type":130,"tag":246,"props":3039,"children":3040},{"style":265},[3041],{"type":139,"value":3042},"  :modifiers",{"type":130,"tag":246,"props":3044,"children":3045},{"style":253},[3046],{"type":139,"value":273},{"type":130,"tag":246,"props":3048,"children":3049},{"style":253},[3050],{"type":139,"value":278},{"type":130,"tag":246,"props":3052,"children":3053},{"style":281},[3054],{"type":139,"value":3055},"{ roundCorner: '0:100' }",{"type":130,"tag":246,"props":3057,"children":3058},{"style":253},[3059],{"type":139,"value":278},{"type":130,"tag":246,"props":3061,"children":3062},{"class":248,"line":1212},[3063],{"type":130,"tag":246,"props":3064,"children":3065},{"style":253},[3066],{"type":139,"value":527},{"type":130,"tag":222,"props":3068,"children":3070},{"id":3069},"preload",[3071],{"type":130,"tag":135,"props":3072,"children":3073},{"className":118},[3074],{"type":139,"value":3069},{"type":130,"tag":131,"props":3076,"children":3077},{},[3078,3080,3085],{"type":139,"value":3079},"In case you want to preload the image, use this prop. This will place a corresponding ",{"type":130,"tag":135,"props":3081,"children":3082},{"className":118},[3083],{"type":139,"value":3084},"link",{"type":139,"value":3086}," tag in the page's head.",{"type":130,"tag":236,"props":3088,"children":3090},{"className":238,"code":3089,"language":240,"meta":118,"style":118},"\u003CNuxtImg preload src=\"/nuxt-icon.png\" />\n",[3091],{"type":130,"tag":135,"props":3092,"children":3093},{"__ignoreMap":118},[3094],{"type":130,"tag":246,"props":3095,"children":3096},{"class":248,"line":249},[3097,3101,3105,3110,3114,3118,3122,3126,3130],{"type":130,"tag":246,"props":3098,"children":3099},{"style":253},[3100],{"type":139,"value":256},{"type":130,"tag":246,"props":3102,"children":3103},{"style":259},[3104],{"type":139,"value":670},{"type":130,"tag":246,"props":3106,"children":3107},{"style":265},[3108],{"type":139,"value":3109}," preload",{"type":130,"tag":246,"props":3111,"children":3112},{"style":265},[3113],{"type":139,"value":293},{"type":130,"tag":246,"props":3115,"children":3116},{"style":253},[3117],{"type":139,"value":273},{"type":130,"tag":246,"props":3119,"children":3120},{"style":253},[3121],{"type":139,"value":278},{"type":130,"tag":246,"props":3123,"children":3124},{"style":281},[3125],{"type":139,"value":306},{"type":130,"tag":246,"props":3127,"children":3128},{"style":253},[3129],{"type":139,"value":278},{"type":130,"tag":246,"props":3131,"children":3132},{"style":253},[3133],{"type":139,"value":320},{"type":130,"tag":222,"props":3135,"children":3137},{"id":3136},"loading",[3138],{"type":130,"tag":135,"props":3139,"children":3140},{"className":118},[3141],{"type":139,"value":3136},{"type":130,"tag":131,"props":3143,"children":3144},{},[3145,3147,3154,3156,3163],{"type":139,"value":3146},"This is a ",{"type":130,"tag":161,"props":3148,"children":3151},{"href":3149,"rel":3150},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading",[187],[3152],{"type":139,"value":3153},"native",{"type":139,"value":3155}," attribute that provides a hint\nto the browser on how to handle the loading of an image which is outside the viewport.\nIt is ",{"type":130,"tag":161,"props":3157,"children":3160},{"href":3158,"rel":3159},"https://caniuse.com/loading-lazy-attr",[187],[3161],{"type":139,"value":3162},"supported",{"type":139,"value":3164}," by the latest version of all major browsers since March 2022.",{"type":130,"tag":131,"props":3166,"children":3167},{},[3168,3170,3175],{"type":139,"value":3169},"Set ",{"type":130,"tag":135,"props":3171,"children":3172},{"className":118},[3173],{"type":139,"value":3174},"loading=\"lazy\"",{"type":139,"value":3176}," to defer loading of an image until it appears in the viewport.",{"type":130,"tag":236,"props":3178,"children":3180},{"className":238,"code":3179,"language":240,"meta":118,"style":118},"\u003CNuxtImg src=\"/nuxt-icon.png\" loading=\"lazy\" />\n",[3181],{"type":130,"tag":135,"props":3182,"children":3183},{"__ignoreMap":118},[3184],{"type":130,"tag":246,"props":3185,"children":3186},{"class":248,"line":249},[3187,3191,3195,3199,3203,3207,3211,3215,3220,3224,3228,3233,3237],{"type":130,"tag":246,"props":3188,"children":3189},{"style":253},[3190],{"type":139,"value":256},{"type":130,"tag":246,"props":3192,"children":3193},{"style":259},[3194],{"type":139,"value":670},{"type":130,"tag":246,"props":3196,"children":3197},{"style":265},[3198],{"type":139,"value":293},{"type":130,"tag":246,"props":3200,"children":3201},{"style":253},[3202],{"type":139,"value":273},{"type":130,"tag":246,"props":3204,"children":3205},{"style":253},[3206],{"type":139,"value":278},{"type":130,"tag":246,"props":3208,"children":3209},{"style":281},[3210],{"type":139,"value":306},{"type":130,"tag":246,"props":3212,"children":3213},{"style":253},[3214],{"type":139,"value":278},{"type":130,"tag":246,"props":3216,"children":3217},{"style":265},[3218],{"type":139,"value":3219}," loading",{"type":130,"tag":246,"props":3221,"children":3222},{"style":253},[3223],{"type":139,"value":273},{"type":130,"tag":246,"props":3225,"children":3226},{"style":253},[3227],{"type":139,"value":278},{"type":130,"tag":246,"props":3229,"children":3230},{"style":281},[3231],{"type":139,"value":3232},"lazy",{"type":130,"tag":246,"props":3234,"children":3235},{"style":253},[3236],{"type":139,"value":278},{"type":130,"tag":246,"props":3238,"children":3239},{"style":253},[3240],{"type":139,"value":320},{"type":130,"tag":222,"props":3242,"children":3244},{"id":3243},"nonce",[3245],{"type":130,"tag":135,"props":3246,"children":3247},{"className":118},[3248],{"type":139,"value":3243},{"type":130,"tag":131,"props":3250,"children":3251},{},[3252,3253,3259,3261,3266,3268,3273],{"type":139,"value":3146},{"type":130,"tag":161,"props":3254,"children":3257},{"href":3255,"rel":3256},"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce",[187],[3258],{"type":139,"value":3153},{"type":139,"value":3260}," global attribute that defines a cryptographic nonce (number used once) that can be used by Content Security Policy to determine whether or not a given fetch will be allowed to proceed for a given element.\nProviding a nonce allows you to avoid using the CSP ",{"type":130,"tag":135,"props":3262,"children":3263},{"className":118},[3264],{"type":139,"value":3265},"unsafe-inline",{"type":139,"value":3267}," directive, which would allowlist ",{"type":130,"tag":946,"props":3269,"children":3270},{},[3271],{"type":139,"value":3272},"all",{"type":139,"value":3274}," inline script or styles.",{"type":130,"tag":236,"props":3276,"children":3278},{"className":238,"code":3277,"language":240,"meta":118,"style":118},"\u003CNuxtImg src=\"/nuxt-icon.png\" :nonce=\"nonce\" />\n\n\u003Cscript lang=\"ts\" setup>\n// useNonce is not provided by nuxt/image but might be\n// provided by another module, for example nuxt-security\nconst nonce = useNonce()\n\u003C/script>\n",[3279],{"type":130,"tag":135,"props":3280,"children":3281},{"__ignoreMap":118},[3282,3338,3341,3381,3389,3397,3422],{"type":130,"tag":246,"props":3283,"children":3284},{"class":248,"line":249},[3285,3289,3293,3297,3301,3305,3309,3313,3318,3322,3326,3330,3334],{"type":130,"tag":246,"props":3286,"children":3287},{"style":253},[3288],{"type":139,"value":256},{"type":130,"tag":246,"props":3290,"children":3291},{"style":259},[3292],{"type":139,"value":670},{"type":130,"tag":246,"props":3294,"children":3295},{"style":265},[3296],{"type":139,"value":293},{"type":130,"tag":246,"props":3298,"children":3299},{"style":253},[3300],{"type":139,"value":273},{"type":130,"tag":246,"props":3302,"children":3303},{"style":253},[3304],{"type":139,"value":278},{"type":130,"tag":246,"props":3306,"children":3307},{"style":281},[3308],{"type":139,"value":306},{"type":130,"tag":246,"props":3310,"children":3311},{"style":253},[3312],{"type":139,"value":278},{"type":130,"tag":246,"props":3314,"children":3315},{"style":265},[3316],{"type":139,"value":3317}," :nonce",{"type":130,"tag":246,"props":3319,"children":3320},{"style":253},[3321],{"type":139,"value":273},{"type":130,"tag":246,"props":3323,"children":3324},{"style":253},[3325],{"type":139,"value":278},{"type":130,"tag":246,"props":3327,"children":3328},{"style":281},[3329],{"type":139,"value":3243},{"type":130,"tag":246,"props":3331,"children":3332},{"style":253},[3333],{"type":139,"value":278},{"type":130,"tag":246,"props":3335,"children":3336},{"style":253},[3337],{"type":139,"value":320},{"type":130,"tag":246,"props":3339,"children":3340},{"class":248,"line":470},[],{"type":130,"tag":246,"props":3342,"children":3343},{"class":248,"line":495},[3344,3348,3352,3357,3361,3365,3369,3373,3377],{"type":130,"tag":246,"props":3345,"children":3346},{"style":253},[3347],{"type":139,"value":256},{"type":130,"tag":246,"props":3349,"children":3350},{"style":259},[3351],{"type":139,"value":1633},{"type":130,"tag":246,"props":3353,"children":3354},{"style":265},[3355],{"type":139,"value":3356}," lang",{"type":130,"tag":246,"props":3358,"children":3359},{"style":253},[3360],{"type":139,"value":273},{"type":130,"tag":246,"props":3362,"children":3363},{"style":253},[3364],{"type":139,"value":278},{"type":130,"tag":246,"props":3366,"children":3367},{"style":281},[3368],{"type":139,"value":1980},{"type":130,"tag":246,"props":3370,"children":3371},{"style":253},[3372],{"type":139,"value":278},{"type":130,"tag":246,"props":3374,"children":3375},{"style":265},[3376],{"type":139,"value":1638},{"type":130,"tag":246,"props":3378,"children":3379},{"style":253},[3380],{"type":139,"value":1643},{"type":130,"tag":246,"props":3382,"children":3383},{"class":248,"line":521},[3384],{"type":130,"tag":246,"props":3385,"children":3386},{"style":1206},[3387],{"type":139,"value":3388},"// useNonce is not provided by nuxt/image but might be",{"type":130,"tag":246,"props":3390,"children":3391},{"class":248,"line":1194},[3392],{"type":130,"tag":246,"props":3393,"children":3394},{"style":1206},[3395],{"type":139,"value":3396},"// provided by another module, for example nuxt-security",{"type":130,"tag":246,"props":3398,"children":3399},{"class":248,"line":1202},[3400,3404,3409,3413,3418],{"type":130,"tag":246,"props":3401,"children":3402},{"style":265},[3403],{"type":139,"value":1651},{"type":130,"tag":246,"props":3405,"children":3406},{"style":1654},[3407],{"type":139,"value":3408}," nonce ",{"type":130,"tag":246,"props":3410,"children":3411},{"style":253},[3412],{"type":139,"value":273},{"type":130,"tag":246,"props":3414,"children":3415},{"style":1664},[3416],{"type":139,"value":3417}," useNonce",{"type":130,"tag":246,"props":3419,"children":3420},{"style":1654},[3421],{"type":139,"value":1672},{"type":130,"tag":246,"props":3423,"children":3424},{"class":248,"line":1212},[3425,3429,3433],{"type":130,"tag":246,"props":3426,"children":3427},{"style":253},[3428],{"type":139,"value":1680},{"type":130,"tag":246,"props":3430,"children":3431},{"style":259},[3432],{"type":139,"value":1633},{"type":130,"tag":246,"props":3434,"children":3435},{"style":253},[3436],{"type":139,"value":1643},{"type":130,"tag":198,"props":3438,"children":3440},{"id":3439},"events",[3441],{"type":139,"value":3442},"Events",{"type":130,"tag":131,"props":3444,"children":3445},{},[3446,3448,3452,3454,3458,3459,3463],{"type":139,"value":3447},"Native events emitted by the ",{"type":130,"tag":135,"props":3449,"children":3450},{"className":118},[3451],{"type":139,"value":566},{"type":139,"value":3453}," element contained by ",{"type":130,"tag":135,"props":3455,"children":3456},{"className":118},[3457],{"type":139,"value":25},{"type":139,"value":356},{"type":130,"tag":135,"props":3460,"children":3461},{"className":118},[3462],{"type":139,"value":28},{"type":139,"value":3464}," components are re-emitted and can be listened to.",{"type":130,"tag":131,"props":3466,"children":3467},{},[3468,3472,3474,3479,3481],{"type":130,"tag":445,"props":3469,"children":3470},{},[3471],{"type":139,"value":449},{"type":139,"value":3473}," Listen to the native ",{"type":130,"tag":135,"props":3475,"children":3476},{"className":118},[3477],{"type":139,"value":3478},"onLoad",{"type":139,"value":3480}," event from ",{"type":130,"tag":135,"props":3482,"children":3483},{"className":118},[3484],{"type":139,"value":25},{"type":130,"tag":236,"props":3486,"children":3488},{"className":238,"code":3487,"language":240,"meta":118,"style":118},"\u003CNuxtImg\n  src=\"/images/colors.jpg\"\n  width=\"500\"\n  height=\"500\"\n  @load=\"doSomethingOnLoad\"\n/>\n",[3489],{"type":130,"tag":135,"props":3490,"children":3491},{"__ignoreMap":118},[3492,3503,3527,3551,3574,3599],{"type":130,"tag":246,"props":3493,"children":3494},{"class":248,"line":249},[3495,3499],{"type":130,"tag":246,"props":3496,"children":3497},{"style":253},[3498],{"type":139,"value":256},{"type":130,"tag":246,"props":3500,"children":3501},{"style":259},[3502],{"type":139,"value":670},{"type":130,"tag":246,"props":3504,"children":3505},{"class":248,"line":470},[3506,3510,3514,3518,3523],{"type":130,"tag":246,"props":3507,"children":3508},{"style":265},[3509],{"type":139,"value":476},{"type":130,"tag":246,"props":3511,"children":3512},{"style":253},[3513],{"type":139,"value":273},{"type":130,"tag":246,"props":3515,"children":3516},{"style":253},[3517],{"type":139,"value":278},{"type":130,"tag":246,"props":3519,"children":3520},{"style":281},[3521],{"type":139,"value":3522},"/images/colors.jpg",{"type":130,"tag":246,"props":3524,"children":3525},{"style":253},[3526],{"type":139,"value":278},{"type":130,"tag":246,"props":3528,"children":3529},{"class":248,"line":495},[3530,3534,3538,3542,3547],{"type":130,"tag":246,"props":3531,"children":3532},{"style":265},[3533],{"type":139,"value":2995},{"type":130,"tag":246,"props":3535,"children":3536},{"style":253},[3537],{"type":139,"value":273},{"type":130,"tag":246,"props":3539,"children":3540},{"style":253},[3541],{"type":139,"value":278},{"type":130,"tag":246,"props":3543,"children":3544},{"style":281},[3545],{"type":139,"value":3546},"500",{"type":130,"tag":246,"props":3548,"children":3549},{"style":253},[3550],{"type":139,"value":278},{"type":130,"tag":246,"props":3552,"children":3553},{"class":248,"line":521},[3554,3558,3562,3566,3570],{"type":130,"tag":246,"props":3555,"children":3556},{"style":265},[3557],{"type":139,"value":1149},{"type":130,"tag":246,"props":3559,"children":3560},{"style":253},[3561],{"type":139,"value":273},{"type":130,"tag":246,"props":3563,"children":3564},{"style":253},[3565],{"type":139,"value":278},{"type":130,"tag":246,"props":3567,"children":3568},{"style":281},[3569],{"type":139,"value":3546},{"type":130,"tag":246,"props":3571,"children":3572},{"style":253},[3573],{"type":139,"value":278},{"type":130,"tag":246,"props":3575,"children":3576},{"class":248,"line":1194},[3577,3582,3586,3590,3595],{"type":130,"tag":246,"props":3578,"children":3579},{"style":265},[3580],{"type":139,"value":3581},"  @load",{"type":130,"tag":246,"props":3583,"children":3584},{"style":253},[3585],{"type":139,"value":273},{"type":130,"tag":246,"props":3587,"children":3588},{"style":253},[3589],{"type":139,"value":278},{"type":130,"tag":246,"props":3591,"children":3592},{"style":281},[3593],{"type":139,"value":3594},"doSomethingOnLoad",{"type":130,"tag":246,"props":3596,"children":3597},{"style":253},[3598],{"type":139,"value":278},{"type":130,"tag":246,"props":3600,"children":3601},{"class":248,"line":1202},[3602],{"type":130,"tag":246,"props":3603,"children":3604},{"style":253},[3605],{"type":139,"value":527},{"type":130,"tag":529,"props":3607,"children":3608},{},[3609],{"type":139,"value":533},{"title":118,"searchDepth":470,"depth":470,"links":3611},[3612,3613,3630],{"id":116,"depth":470,"text":21},{"id":200,"depth":470,"text":203,"children":3614},[3615,3616,3618,3619,3620,3621,3622,3623,3624,3625,3626,3627,3628,3629],{"id":585,"depth":495,"text":585},{"id":875,"depth":495,"text":3617},"width / height",{"id":613,"depth":495,"text":613},{"id":1083,"depth":495,"text":1083},{"id":1256,"depth":495,"text":1256},{"id":1783,"depth":495,"text":1783},{"id":2110,"depth":495,"text":2110},{"id":224,"depth":495,"text":224},{"id":2590,"depth":495,"text":2590},{"id":2712,"depth":495,"text":2712},{"id":2894,"depth":495,"text":2894},{"id":3069,"depth":495,"text":3069},{"id":3136,"depth":495,"text":3136},{"id":3243,"depth":495,"text":3243},{"id":3439,"depth":470,"text":3442},"content:2.usage:1.nuxt-img.md","2.usage/1.nuxt-img.md",{"_path":32,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":31,"description":3634,"links":3635,"body":3638,"_type":541,"_id":4901,"_source":543,"_file":4902,"_extension":545},"A Vue composable that returns a helper function to generate optimized image URLs.",[3636],{"label":122,"icon":123,"to":3637,"size":125},"https://github.com/nuxt/image/blob/main/src/runtime/composables.ts",{"type":127,"children":3639,"toc":4896},[3640,3674,3678,3743,3759,3967,3976,4059,4073,4081,4197,4211,4892],{"type":130,"tag":131,"props":3641,"children":3642},{},[3643,3645,3649,3650,3654,3656,3660,3662,3667,3669,3673],{"type":139,"value":3644},"Sometimes you might need to use a generated image URL directly with applied transformations instead of the ",{"type":130,"tag":135,"props":3646,"children":3647},{"className":118},[3648],{"type":139,"value":25},{"type":139,"value":356},{"type":130,"tag":135,"props":3651,"children":3652},{"className":118},[3653],{"type":139,"value":28},{"type":139,"value":3655}," components. This is where ",{"type":130,"tag":135,"props":3657,"children":3658},{"className":118},[3659],{"type":139,"value":31},{"type":139,"value":3661}," comes in (and the helper function it returns, which you will often see referenced directly as ",{"type":130,"tag":135,"props":3663,"children":3664},{"className":118},[3665],{"type":139,"value":3666},"$img",{"type":139,"value":3668}," or ",{"type":130,"tag":135,"props":3670,"children":3671},{"className":118},[3672],{"type":139,"value":438},{"type":139,"value":939},{"type":130,"tag":198,"props":3675,"children":3676},{"id":116},[3677],{"type":139,"value":21},{"type":130,"tag":236,"props":3679,"children":3683},{"className":3680,"code":3681,"language":3682,"meta":118,"style":118},"language-js shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","const img = useImage()\n\nimg(src, modifiers, options)\n","js",[3684],{"type":130,"tag":135,"props":3685,"children":3686},{"__ignoreMap":118},[3687,3710,3713],{"type":130,"tag":246,"props":3688,"children":3689},{"class":248,"line":249},[3690,3694,3698,3702,3706],{"type":130,"tag":246,"props":3691,"children":3692},{"style":265},[3693],{"type":139,"value":1651},{"type":130,"tag":246,"props":3695,"children":3696},{"style":1654},[3697],{"type":139,"value":1657},{"type":130,"tag":246,"props":3699,"children":3700},{"style":253},[3701],{"type":139,"value":273},{"type":130,"tag":246,"props":3703,"children":3704},{"style":1664},[3705],{"type":139,"value":1667},{"type":130,"tag":246,"props":3707,"children":3708},{"style":1654},[3709],{"type":139,"value":1672},{"type":130,"tag":246,"props":3711,"children":3712},{"class":248,"line":470},[],{"type":130,"tag":246,"props":3714,"children":3715},{"class":248,"line":495},[3716,3720,3725,3729,3734,3738],{"type":130,"tag":246,"props":3717,"children":3718},{"style":1664},[3719],{"type":139,"value":438},{"type":130,"tag":246,"props":3721,"children":3722},{"style":1654},[3723],{"type":139,"value":3724},"(src",{"type":130,"tag":246,"props":3726,"children":3727},{"style":253},[3728],{"type":139,"value":2079},{"type":130,"tag":246,"props":3730,"children":3731},{"style":1654},[3732],{"type":139,"value":3733}," modifiers",{"type":130,"tag":246,"props":3735,"children":3736},{"style":253},[3737],{"type":139,"value":2079},{"type":130,"tag":246,"props":3739,"children":3740},{"style":1654},[3741],{"type":139,"value":3742}," options)",{"type":130,"tag":131,"props":3744,"children":3745},{},[3746,3750,3752,3757],{"type":130,"tag":445,"props":3747,"children":3748},{},[3749],{"type":139,"value":449},{"type":139,"value":3751}," Generate image URL for ",{"type":130,"tag":135,"props":3753,"children":3754},{"className":118},[3755],{"type":139,"value":3756},"backgroundImage",{"type":139,"value":3758}," style.",{"type":130,"tag":236,"props":3760,"children":3762},{"className":3680,"code":3761,"language":3682,"meta":118,"style":118},"const img = useImage()\nconst backgroundStyles = computed(() => {\n  const imgUrl = img('https://github.com/nuxt.png', { width: 100 })\n  return { backgroundImage: `url('${imgUrl}')` }\n})\n",[3763],{"type":130,"tag":135,"props":3764,"children":3765},{"__ignoreMap":118},[3766,3789,3827,3897,3956],{"type":130,"tag":246,"props":3767,"children":3768},{"class":248,"line":249},[3769,3773,3777,3781,3785],{"type":130,"tag":246,"props":3770,"children":3771},{"style":265},[3772],{"type":139,"value":1651},{"type":130,"tag":246,"props":3774,"children":3775},{"style":1654},[3776],{"type":139,"value":1657},{"type":130,"tag":246,"props":3778,"children":3779},{"style":253},[3780],{"type":139,"value":273},{"type":130,"tag":246,"props":3782,"children":3783},{"style":1664},[3784],{"type":139,"value":1667},{"type":130,"tag":246,"props":3786,"children":3787},{"style":1654},[3788],{"type":139,"value":1672},{"type":130,"tag":246,"props":3790,"children":3791},{"class":248,"line":470},[3792,3796,3801,3805,3810,3814,3818,3823],{"type":130,"tag":246,"props":3793,"children":3794},{"style":265},[3795],{"type":139,"value":1651},{"type":130,"tag":246,"props":3797,"children":3798},{"style":1654},[3799],{"type":139,"value":3800}," backgroundStyles ",{"type":130,"tag":246,"props":3802,"children":3803},{"style":253},[3804],{"type":139,"value":273},{"type":130,"tag":246,"props":3806,"children":3807},{"style":1664},[3808],{"type":139,"value":3809}," computed",{"type":130,"tag":246,"props":3811,"children":3812},{"style":1654},[3813],{"type":139,"value":2008},{"type":130,"tag":246,"props":3815,"children":3816},{"style":253},[3817],{"type":139,"value":1672},{"type":130,"tag":246,"props":3819,"children":3820},{"style":265},[3821],{"type":139,"value":3822}," =>",{"type":130,"tag":246,"props":3824,"children":3825},{"style":253},[3826],{"type":139,"value":2031},{"type":130,"tag":246,"props":3828,"children":3829},{"class":248,"line":495},[3830,3835,3840,3845,3850,3854,3858,3863,3867,3871,3875,3879,3883,3888,3893],{"type":130,"tag":246,"props":3831,"children":3832},{"style":265},[3833],{"type":139,"value":3834},"  const",{"type":130,"tag":246,"props":3836,"children":3837},{"style":1654},[3838],{"type":139,"value":3839}," imgUrl",{"type":130,"tag":246,"props":3841,"children":3842},{"style":253},[3843],{"type":139,"value":3844}," =",{"type":130,"tag":246,"props":3846,"children":3847},{"style":1664},[3848],{"type":139,"value":3849}," img",{"type":130,"tag":246,"props":3851,"children":3852},{"style":259},[3853],{"type":139,"value":2008},{"type":130,"tag":246,"props":3855,"children":3856},{"style":253},[3857],{"type":139,"value":2074},{"type":130,"tag":246,"props":3859,"children":3860},{"style":281},[3861],{"type":139,"value":3862},"https://github.com/nuxt.png",{"type":130,"tag":246,"props":3864,"children":3865},{"style":253},[3866],{"type":139,"value":2074},{"type":130,"tag":246,"props":3868,"children":3869},{"style":253},[3870],{"type":139,"value":2079},{"type":130,"tag":246,"props":3872,"children":3873},{"style":253},[3874],{"type":139,"value":2031},{"type":130,"tag":246,"props":3876,"children":3877},{"style":259},[3878],{"type":139,"value":2666},{"type":130,"tag":246,"props":3880,"children":3881},{"style":253},[3882],{"type":139,"value":2026},{"type":130,"tag":246,"props":3884,"children":3885},{"style":2401},[3886],{"type":139,"value":3887}," 100",{"type":130,"tag":246,"props":3889,"children":3890},{"style":253},[3891],{"type":139,"value":3892}," }",{"type":130,"tag":246,"props":3894,"children":3895},{"style":259},[3896],{"type":139,"value":914},{"type":130,"tag":246,"props":3898,"children":3899},{"class":248,"line":521},[3900,3905,3909,3914,3918,3923,3928,3933,3938,3942,3947,3952],{"type":130,"tag":246,"props":3901,"children":3902},{"style":1990},[3903],{"type":139,"value":3904},"  return",{"type":130,"tag":246,"props":3906,"children":3907},{"style":253},[3908],{"type":139,"value":2031},{"type":130,"tag":246,"props":3910,"children":3911},{"style":259},[3912],{"type":139,"value":3913}," backgroundImage",{"type":130,"tag":246,"props":3915,"children":3916},{"style":253},[3917],{"type":139,"value":2026},{"type":130,"tag":246,"props":3919,"children":3920},{"style":253},[3921],{"type":139,"value":3922}," `",{"type":130,"tag":246,"props":3924,"children":3925},{"style":281},[3926],{"type":139,"value":3927},"url('",{"type":130,"tag":246,"props":3929,"children":3930},{"style":253},[3931],{"type":139,"value":3932},"${",{"type":130,"tag":246,"props":3934,"children":3935},{"style":1654},[3936],{"type":139,"value":3937},"imgUrl",{"type":130,"tag":246,"props":3939,"children":3940},{"style":253},[3941],{"type":139,"value":2103},{"type":130,"tag":246,"props":3943,"children":3944},{"style":281},[3945],{"type":139,"value":3946},"')",{"type":130,"tag":246,"props":3948,"children":3949},{"style":253},[3950],{"type":139,"value":3951},"`",{"type":130,"tag":246,"props":3953,"children":3954},{"style":253},[3955],{"type":139,"value":3892},{"type":130,"tag":246,"props":3957,"children":3958},{"class":248,"line":1194},[3959,3963],{"type":130,"tag":246,"props":3960,"children":3961},{"style":253},[3962],{"type":139,"value":2103},{"type":130,"tag":246,"props":3964,"children":3965},{"style":1654},[3966],{"type":139,"value":914},{"type":130,"tag":222,"props":3968,"children":3970},{"id":3969},"imggetsizes",[3971],{"type":130,"tag":135,"props":3972,"children":3973},{"className":118},[3974],{"type":139,"value":3975},"img.getSizes",{"type":130,"tag":236,"props":3977,"children":3979},{"className":3680,"code":3978,"language":3682,"meta":118,"style":118},"const img = useImage()\n\nimg.getSizes(src, { sizes, modifiers })\n",[3980],{"type":130,"tag":135,"props":3981,"children":3982},{"__ignoreMap":118},[3983,4006,4009],{"type":130,"tag":246,"props":3984,"children":3985},{"class":248,"line":249},[3986,3990,3994,3998,4002],{"type":130,"tag":246,"props":3987,"children":3988},{"style":265},[3989],{"type":139,"value":1651},{"type":130,"tag":246,"props":3991,"children":3992},{"style":1654},[3993],{"type":139,"value":1657},{"type":130,"tag":246,"props":3995,"children":3996},{"style":253},[3997],{"type":139,"value":273},{"type":130,"tag":246,"props":3999,"children":4000},{"style":1664},[4001],{"type":139,"value":1667},{"type":130,"tag":246,"props":4003,"children":4004},{"style":1654},[4005],{"type":139,"value":1672},{"type":130,"tag":246,"props":4007,"children":4008},{"class":248,"line":470},[],{"type":130,"tag":246,"props":4010,"children":4011},{"class":248,"line":495},[4012,4016,4020,4025,4029,4033,4037,4042,4046,4051,4055],{"type":130,"tag":246,"props":4013,"children":4014},{"style":1654},[4015],{"type":139,"value":438},{"type":130,"tag":246,"props":4017,"children":4018},{"style":253},[4019],{"type":139,"value":196},{"type":130,"tag":246,"props":4021,"children":4022},{"style":1664},[4023],{"type":139,"value":4024},"getSizes",{"type":130,"tag":246,"props":4026,"children":4027},{"style":1654},[4028],{"type":139,"value":3724},{"type":130,"tag":246,"props":4030,"children":4031},{"style":253},[4032],{"type":139,"value":2079},{"type":130,"tag":246,"props":4034,"children":4035},{"style":253},[4036],{"type":139,"value":2031},{"type":130,"tag":246,"props":4038,"children":4039},{"style":1654},[4040],{"type":139,"value":4041}," sizes",{"type":130,"tag":246,"props":4043,"children":4044},{"style":253},[4045],{"type":139,"value":2079},{"type":130,"tag":246,"props":4047,"children":4048},{"style":1654},[4049],{"type":139,"value":4050}," modifiers ",{"type":130,"tag":246,"props":4052,"children":4053},{"style":253},[4054],{"type":139,"value":2103},{"type":130,"tag":246,"props":4056,"children":4057},{"style":1654},[4058],{"type":139,"value":914},{"type":130,"tag":205,"props":4060,"children":4061},{},[4062],{"type":130,"tag":131,"props":4063,"children":4064},{},[4065,4067,4071],{"type":139,"value":4066},"Unstable: ",{"type":130,"tag":135,"props":4068,"children":4069},{"className":118},[4070],{"type":139,"value":4024},{"type":139,"value":4072}," API might change or be removed.",{"type":130,"tag":131,"props":4074,"children":4075},{},[4076],{"type":130,"tag":445,"props":4077,"children":4078},{},[4079],{"type":139,"value":4080},"Parameters:",{"type":130,"tag":379,"props":4082,"children":4083},{},[4084,4093,4102,4155],{"type":130,"tag":383,"props":4085,"children":4086},{},[4087,4091],{"type":130,"tag":135,"props":4088,"children":4089},{"className":118},[4090],{"type":139,"value":585},{"type":139,"value":4092},": (string) Source to original image id",{"type":130,"tag":383,"props":4094,"children":4095},{},[4096,4100],{"type":130,"tag":135,"props":4097,"children":4098},{"className":118},[4099],{"type":139,"value":613},{"type":139,"value":4101},": (string) List of responsive image sizes ({breakpoint}:{size}{unit})",{"type":130,"tag":383,"props":4103,"children":4104},{},[4105,4109,4111],{"type":130,"tag":135,"props":4106,"children":4107},{"className":118},[4108],{"type":139,"value":2894},{"type":139,"value":4110},": (object) Modifiers passed to provider for resizing and optimizing\n",{"type":130,"tag":379,"props":4112,"children":4113},{},[4114,4123,4132,4141,4150],{"type":130,"tag":383,"props":4115,"children":4116},{},[4117,4121],{"type":130,"tag":135,"props":4118,"children":4119},{"className":118},[4120],{"type":139,"value":597},{"type":139,"value":4122},": resize to the specified width (in pixels)",{"type":130,"tag":383,"props":4124,"children":4125},{},[4126,4130],{"type":130,"tag":135,"props":4127,"children":4128},{"className":118},[4129],{"type":139,"value":603},{"type":139,"value":4131},": resize to specified height (in pixels)",{"type":130,"tag":383,"props":4133,"children":4134},{},[4135,4139],{"type":130,"tag":135,"props":4136,"children":4137},{"className":118},[4138],{"type":139,"value":2590},{"type":139,"value":4140},": Change image quality (0 to 100)",{"type":130,"tag":383,"props":4142,"children":4143},{},[4144,4148],{"type":130,"tag":135,"props":4145,"children":4146},{"className":118},[4147],{"type":139,"value":224},{"type":139,"value":4149},": Change the image format",{"type":130,"tag":383,"props":4151,"children":4152},{},[4153],{"type":139,"value":4154},"(any other custom provider modifier)",{"type":130,"tag":383,"props":4156,"children":4157},{},[4158,4163,4165],{"type":130,"tag":135,"props":4159,"children":4160},{"className":118},[4161],{"type":139,"value":4162},"options",{"type":139,"value":4164},": (object)\n",{"type":130,"tag":379,"props":4166,"children":4167},{},[4168,4184],{"type":130,"tag":383,"props":4169,"children":4170},{},[4171,4175,4177,4183],{"type":130,"tag":135,"props":4172,"children":4173},{"className":118},[4174],{"type":139,"value":1783},{"type":139,"value":4176},": (string) Provider name other than default (see ",{"type":130,"tag":161,"props":4178,"children":4180},{"href":4179},"/get-started/configuration#providers",[4181],{"type":139,"value":4182},"providers",{"type":139,"value":914},{"type":130,"tag":383,"props":4185,"children":4186},{},[4187,4191,4193],{"type":130,"tag":135,"props":4188,"children":4189},{"className":118},[4190],{"type":139,"value":2110},{"type":139,"value":4192},": Use a ",{"type":130,"tag":161,"props":4194,"children":4195},{"href":2131},[4196],{"type":139,"value":2110},{"type":130,"tag":131,"props":4198,"children":4199},{},[4200,4204,4206],{"type":130,"tag":445,"props":4201,"children":4202},{},[4203],{"type":139,"value":449},{"type":139,"value":4205}," Responsive srcset with Vuetify ",{"type":130,"tag":135,"props":4207,"children":4208},{"className":118},[4209],{"type":139,"value":4210},"v-img",{"type":130,"tag":236,"props":4212,"children":4214},{"className":238,"code":4213,"language":240,"meta":118,"style":118},"\u003Cscript setup lang=\"ts\">\nconst props = defineProps({\n  height: { type: [Number, String], default: 500 },\n  src: {\n    type: String,\n    default: '/img/header-bg.jpg'\n  }\n})\nconst img = useImage()\nconst _srcset = computed(() => {\n  return img.getSizes(props.src, {\n    sizes: 'xs:100vw sm:100vw md:100vw lg:100vw xl:100vw',\n    modifiers: {\n      format: 'webp',\n      quality: 70,\n      height: props.height\n    }\n  })\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Cv-img\n    :lazy-src=\"img(src, { width: 10, quality: 70 })\"\n    :src=\"img(src, { height, quality: 70 })\"\n    :srcset=\"_srcset.srcset\"\n    :height=\"height\"\n    :sizes=\"_srcset.sizes\"\n  >\u003C/v-img>\n\u003C/template>\n",[4215],{"type":130,"tag":135,"props":4216,"children":4217},{"__ignoreMap":118},[4218,4257,4286,4346,4361,4382,4407,4415,4426,4449,4485,4528,4557,4573,4601,4623,4649,4658,4670,4682,4698,4702,4718,4730,4756,4782,4808,4833,4859,4876],{"type":130,"tag":246,"props":4219,"children":4220},{"class":248,"line":249},[4221,4225,4229,4233,4237,4241,4245,4249,4253],{"type":130,"tag":246,"props":4222,"children":4223},{"style":253},[4224],{"type":139,"value":256},{"type":130,"tag":246,"props":4226,"children":4227},{"style":259},[4228],{"type":139,"value":1633},{"type":130,"tag":246,"props":4230,"children":4231},{"style":265},[4232],{"type":139,"value":1638},{"type":130,"tag":246,"props":4234,"children":4235},{"style":265},[4236],{"type":139,"value":3356},{"type":130,"tag":246,"props":4238,"children":4239},{"style":253},[4240],{"type":139,"value":273},{"type":130,"tag":246,"props":4242,"children":4243},{"style":253},[4244],{"type":139,"value":278},{"type":130,"tag":246,"props":4246,"children":4247},{"style":281},[4248],{"type":139,"value":1980},{"type":130,"tag":246,"props":4250,"children":4251},{"style":253},[4252],{"type":139,"value":278},{"type":130,"tag":246,"props":4254,"children":4255},{"style":253},[4256],{"type":139,"value":1643},{"type":130,"tag":246,"props":4258,"children":4259},{"class":248,"line":470},[4260,4264,4269,4273,4278,4282],{"type":130,"tag":246,"props":4261,"children":4262},{"style":265},[4263],{"type":139,"value":1651},{"type":130,"tag":246,"props":4265,"children":4266},{"style":1654},[4267],{"type":139,"value":4268}," props ",{"type":130,"tag":246,"props":4270,"children":4271},{"style":253},[4272],{"type":139,"value":273},{"type":130,"tag":246,"props":4274,"children":4275},{"style":1664},[4276],{"type":139,"value":4277}," defineProps",{"type":130,"tag":246,"props":4279,"children":4280},{"style":1654},[4281],{"type":139,"value":2008},{"type":130,"tag":246,"props":4283,"children":4284},{"style":253},[4285],{"type":139,"value":2013},{"type":130,"tag":246,"props":4287,"children":4288},{"class":248,"line":495},[4289,4293,4297,4301,4306,4310,4315,4319,4324,4328,4332,4336,4341],{"type":130,"tag":246,"props":4290,"children":4291},{"style":259},[4292],{"type":139,"value":1149},{"type":130,"tag":246,"props":4294,"children":4295},{"style":253},[4296],{"type":139,"value":2026},{"type":130,"tag":246,"props":4298,"children":4299},{"style":253},[4300],{"type":139,"value":2031},{"type":130,"tag":246,"props":4302,"children":4303},{"style":259},[4304],{"type":139,"value":4305}," type",{"type":130,"tag":246,"props":4307,"children":4308},{"style":253},[4309],{"type":139,"value":2026},{"type":130,"tag":246,"props":4311,"children":4312},{"style":1654},[4313],{"type":139,"value":4314}," [Number",{"type":130,"tag":246,"props":4316,"children":4317},{"style":253},[4318],{"type":139,"value":2079},{"type":130,"tag":246,"props":4320,"children":4321},{"style":1654},[4322],{"type":139,"value":4323}," String]",{"type":130,"tag":246,"props":4325,"children":4326},{"style":253},[4327],{"type":139,"value":2079},{"type":130,"tag":246,"props":4329,"children":4330},{"style":259},[4331],{"type":139,"value":1998},{"type":130,"tag":246,"props":4333,"children":4334},{"style":253},[4335],{"type":139,"value":2026},{"type":130,"tag":246,"props":4337,"children":4338},{"style":2401},[4339],{"type":139,"value":4340}," 500",{"type":130,"tag":246,"props":4342,"children":4343},{"style":253},[4344],{"type":139,"value":4345}," },",{"type":130,"tag":246,"props":4347,"children":4348},{"class":248,"line":521},[4349,4353,4357],{"type":130,"tag":246,"props":4350,"children":4351},{"style":259},[4352],{"type":139,"value":476},{"type":130,"tag":246,"props":4354,"children":4355},{"style":253},[4356],{"type":139,"value":2026},{"type":130,"tag":246,"props":4358,"children":4359},{"style":253},[4360],{"type":139,"value":2031},{"type":130,"tag":246,"props":4362,"children":4363},{"class":248,"line":1194},[4364,4369,4373,4378],{"type":130,"tag":246,"props":4365,"children":4366},{"style":259},[4367],{"type":139,"value":4368},"    type",{"type":130,"tag":246,"props":4370,"children":4371},{"style":253},[4372],{"type":139,"value":2026},{"type":130,"tag":246,"props":4374,"children":4375},{"style":1654},[4376],{"type":139,"value":4377}," String",{"type":130,"tag":246,"props":4379,"children":4380},{"style":253},[4381],{"type":139,"value":2079},{"type":130,"tag":246,"props":4383,"children":4384},{"class":248,"line":1202},[4385,4390,4394,4398,4403],{"type":130,"tag":246,"props":4386,"children":4387},{"style":259},[4388],{"type":139,"value":4389},"    default",{"type":130,"tag":246,"props":4391,"children":4392},{"style":253},[4393],{"type":139,"value":2026},{"type":130,"tag":246,"props":4395,"children":4396},{"style":253},[4397],{"type":139,"value":2064},{"type":130,"tag":246,"props":4399,"children":4400},{"style":281},[4401],{"type":139,"value":4402},"/img/header-bg.jpg",{"type":130,"tag":246,"props":4404,"children":4405},{"style":253},[4406],{"type":139,"value":2074},{"type":130,"tag":246,"props":4408,"children":4409},{"class":248,"line":1212},[4410],{"type":130,"tag":246,"props":4411,"children":4412},{"style":253},[4413],{"type":139,"value":4414},"  }",{"type":130,"tag":246,"props":4416,"children":4417},{"class":248,"line":1221},[4418,4422],{"type":130,"tag":246,"props":4419,"children":4420},{"style":253},[4421],{"type":139,"value":2103},{"type":130,"tag":246,"props":4423,"children":4424},{"style":1654},[4425],{"type":139,"value":914},{"type":130,"tag":246,"props":4427,"children":4428},{"class":248,"line":1230},[4429,4433,4437,4441,4445],{"type":130,"tag":246,"props":4430,"children":4431},{"style":265},[4432],{"type":139,"value":1651},{"type":130,"tag":246,"props":4434,"children":4435},{"style":1654},[4436],{"type":139,"value":1657},{"type":130,"tag":246,"props":4438,"children":4439},{"style":253},[4440],{"type":139,"value":273},{"type":130,"tag":246,"props":4442,"children":4443},{"style":1664},[4444],{"type":139,"value":1667},{"type":130,"tag":246,"props":4446,"children":4447},{"style":1654},[4448],{"type":139,"value":1672},{"type":130,"tag":246,"props":4450,"children":4451},{"class":248,"line":1239},[4452,4456,4461,4465,4469,4473,4477,4481],{"type":130,"tag":246,"props":4453,"children":4454},{"style":265},[4455],{"type":139,"value":1651},{"type":130,"tag":246,"props":4457,"children":4458},{"style":1654},[4459],{"type":139,"value":4460}," _srcset ",{"type":130,"tag":246,"props":4462,"children":4463},{"style":253},[4464],{"type":139,"value":273},{"type":130,"tag":246,"props":4466,"children":4467},{"style":1664},[4468],{"type":139,"value":3809},{"type":130,"tag":246,"props":4470,"children":4471},{"style":1654},[4472],{"type":139,"value":2008},{"type":130,"tag":246,"props":4474,"children":4475},{"style":253},[4476],{"type":139,"value":1672},{"type":130,"tag":246,"props":4478,"children":4479},{"style":265},[4480],{"type":139,"value":3822},{"type":130,"tag":246,"props":4482,"children":4483},{"style":253},[4484],{"type":139,"value":2031},{"type":130,"tag":246,"props":4486,"children":4487},{"class":248,"line":1247},[4488,4492,4496,4500,4504,4508,4512,4516,4520,4524],{"type":130,"tag":246,"props":4489,"children":4490},{"style":1990},[4491],{"type":139,"value":3904},{"type":130,"tag":246,"props":4493,"children":4494},{"style":1654},[4495],{"type":139,"value":3849},{"type":130,"tag":246,"props":4497,"children":4498},{"style":253},[4499],{"type":139,"value":196},{"type":130,"tag":246,"props":4501,"children":4502},{"style":1664},[4503],{"type":139,"value":4024},{"type":130,"tag":246,"props":4505,"children":4506},{"style":259},[4507],{"type":139,"value":2008},{"type":130,"tag":246,"props":4509,"children":4510},{"style":1654},[4511],{"type":139,"value":200},{"type":130,"tag":246,"props":4513,"children":4514},{"style":253},[4515],{"type":139,"value":196},{"type":130,"tag":246,"props":4517,"children":4518},{"style":1654},[4519],{"type":139,"value":585},{"type":130,"tag":246,"props":4521,"children":4522},{"style":253},[4523],{"type":139,"value":2079},{"type":130,"tag":246,"props":4525,"children":4526},{"style":253},[4527],{"type":139,"value":2031},{"type":130,"tag":246,"props":4529,"children":4530},{"class":248,"line":1531},[4531,4536,4540,4544,4549,4553],{"type":130,"tag":246,"props":4532,"children":4533},{"style":259},[4534],{"type":139,"value":4535},"    sizes",{"type":130,"tag":246,"props":4537,"children":4538},{"style":253},[4539],{"type":139,"value":2026},{"type":130,"tag":246,"props":4541,"children":4542},{"style":253},[4543],{"type":139,"value":2064},{"type":130,"tag":246,"props":4545,"children":4546},{"style":281},[4547],{"type":139,"value":4548},"xs:100vw sm:100vw md:100vw lg:100vw xl:100vw",{"type":130,"tag":246,"props":4550,"children":4551},{"style":253},[4552],{"type":139,"value":2074},{"type":130,"tag":246,"props":4554,"children":4555},{"style":253},[4556],{"type":139,"value":2079},{"type":130,"tag":246,"props":4558,"children":4559},{"class":248,"line":1535},[4560,4565,4569],{"type":130,"tag":246,"props":4561,"children":4562},{"style":259},[4563],{"type":139,"value":4564},"    modifiers",{"type":130,"tag":246,"props":4566,"children":4567},{"style":253},[4568],{"type":139,"value":2026},{"type":130,"tag":246,"props":4570,"children":4571},{"style":253},[4572],{"type":139,"value":2031},{"type":130,"tag":246,"props":4574,"children":4575},{"class":248,"line":1544},[4576,4581,4585,4589,4593,4597],{"type":130,"tag":246,"props":4577,"children":4578},{"style":259},[4579],{"type":139,"value":4580},"      format",{"type":130,"tag":246,"props":4582,"children":4583},{"style":253},[4584],{"type":139,"value":2026},{"type":130,"tag":246,"props":4586,"children":4587},{"style":253},[4588],{"type":139,"value":2064},{"type":130,"tag":246,"props":4590,"children":4591},{"style":281},[4592],{"type":139,"value":175},{"type":130,"tag":246,"props":4594,"children":4595},{"style":253},[4596],{"type":139,"value":2074},{"type":130,"tag":246,"props":4598,"children":4599},{"style":253},[4600],{"type":139,"value":2079},{"type":130,"tag":246,"props":4602,"children":4604},{"class":248,"line":4603},15,[4605,4610,4614,4619],{"type":130,"tag":246,"props":4606,"children":4607},{"style":259},[4608],{"type":139,"value":4609},"      quality",{"type":130,"tag":246,"props":4611,"children":4612},{"style":253},[4613],{"type":139,"value":2026},{"type":130,"tag":246,"props":4615,"children":4616},{"style":2401},[4617],{"type":139,"value":4618}," 70",{"type":130,"tag":246,"props":4620,"children":4621},{"style":253},[4622],{"type":139,"value":2079},{"type":130,"tag":246,"props":4624,"children":4626},{"class":248,"line":4625},16,[4627,4632,4636,4641,4645],{"type":130,"tag":246,"props":4628,"children":4629},{"style":259},[4630],{"type":139,"value":4631},"      height",{"type":130,"tag":246,"props":4633,"children":4634},{"style":253},[4635],{"type":139,"value":2026},{"type":130,"tag":246,"props":4637,"children":4638},{"style":1654},[4639],{"type":139,"value":4640}," props",{"type":130,"tag":246,"props":4642,"children":4643},{"style":253},[4644],{"type":139,"value":196},{"type":130,"tag":246,"props":4646,"children":4647},{"style":1654},[4648],{"type":139,"value":603},{"type":130,"tag":246,"props":4650,"children":4652},{"class":248,"line":4651},17,[4653],{"type":130,"tag":246,"props":4654,"children":4655},{"style":253},[4656],{"type":139,"value":4657},"    }",{"type":130,"tag":246,"props":4659,"children":4661},{"class":248,"line":4660},18,[4662,4666],{"type":130,"tag":246,"props":4663,"children":4664},{"style":253},[4665],{"type":139,"value":4414},{"type":130,"tag":246,"props":4667,"children":4668},{"style":259},[4669],{"type":139,"value":914},{"type":130,"tag":246,"props":4671,"children":4673},{"class":248,"line":4672},19,[4674,4678],{"type":130,"tag":246,"props":4675,"children":4676},{"style":253},[4677],{"type":139,"value":2103},{"type":130,"tag":246,"props":4679,"children":4680},{"style":1654},[4681],{"type":139,"value":914},{"type":130,"tag":246,"props":4683,"children":4685},{"class":248,"line":4684},20,[4686,4690,4694],{"type":130,"tag":246,"props":4687,"children":4688},{"style":253},[4689],{"type":139,"value":1680},{"type":130,"tag":246,"props":4691,"children":4692},{"style":259},[4693],{"type":139,"value":1633},{"type":130,"tag":246,"props":4695,"children":4696},{"style":253},[4697],{"type":139,"value":1643},{"type":130,"tag":246,"props":4699,"children":4701},{"class":248,"line":4700},21,[],{"type":130,"tag":246,"props":4703,"children":4705},{"class":248,"line":4704},22,[4706,4710,4714],{"type":130,"tag":246,"props":4707,"children":4708},{"style":253},[4709],{"type":139,"value":256},{"type":130,"tag":246,"props":4711,"children":4712},{"style":259},[4713],{"type":139,"value":1703},{"type":130,"tag":246,"props":4715,"children":4716},{"style":253},[4717],{"type":139,"value":1643},{"type":130,"tag":246,"props":4719,"children":4721},{"class":248,"line":4720},23,[4722,4726],{"type":130,"tag":246,"props":4723,"children":4724},{"style":253},[4725],{"type":139,"value":1715},{"type":130,"tag":246,"props":4727,"children":4728},{"style":259},[4729],{"type":139,"value":4210},{"type":130,"tag":246,"props":4731,"children":4733},{"class":248,"line":4732},24,[4734,4739,4743,4747,4752],{"type":130,"tag":246,"props":4735,"children":4736},{"style":265},[4737],{"type":139,"value":4738},"    :lazy-src",{"type":130,"tag":246,"props":4740,"children":4741},{"style":253},[4742],{"type":139,"value":273},{"type":130,"tag":246,"props":4744,"children":4745},{"style":253},[4746],{"type":139,"value":278},{"type":130,"tag":246,"props":4748,"children":4749},{"style":281},[4750],{"type":139,"value":4751},"img(src, { width: 10, quality: 70 })",{"type":130,"tag":246,"props":4753,"children":4754},{"style":253},[4755],{"type":139,"value":278},{"type":130,"tag":246,"props":4757,"children":4759},{"class":248,"line":4758},25,[4760,4765,4769,4773,4778],{"type":130,"tag":246,"props":4761,"children":4762},{"style":265},[4763],{"type":139,"value":4764},"    :src",{"type":130,"tag":246,"props":4766,"children":4767},{"style":253},[4768],{"type":139,"value":273},{"type":130,"tag":246,"props":4770,"children":4771},{"style":253},[4772],{"type":139,"value":278},{"type":130,"tag":246,"props":4774,"children":4775},{"style":281},[4776],{"type":139,"value":4777},"img(src, { height, quality: 70 })",{"type":130,"tag":246,"props":4779,"children":4780},{"style":253},[4781],{"type":139,"value":278},{"type":130,"tag":246,"props":4783,"children":4785},{"class":248,"line":4784},26,[4786,4791,4795,4799,4804],{"type":130,"tag":246,"props":4787,"children":4788},{"style":265},[4789],{"type":139,"value":4790},"    :srcset",{"type":130,"tag":246,"props":4792,"children":4793},{"style":253},[4794],{"type":139,"value":273},{"type":130,"tag":246,"props":4796,"children":4797},{"style":253},[4798],{"type":139,"value":278},{"type":130,"tag":246,"props":4800,"children":4801},{"style":281},[4802],{"type":139,"value":4803},"_srcset.srcset",{"type":130,"tag":246,"props":4805,"children":4806},{"style":253},[4807],{"type":139,"value":278},{"type":130,"tag":246,"props":4809,"children":4811},{"class":248,"line":4810},27,[4812,4817,4821,4825,4829],{"type":130,"tag":246,"props":4813,"children":4814},{"style":265},[4815],{"type":139,"value":4816},"    :height",{"type":130,"tag":246,"props":4818,"children":4819},{"style":253},[4820],{"type":139,"value":273},{"type":130,"tag":246,"props":4822,"children":4823},{"style":253},[4824],{"type":139,"value":278},{"type":130,"tag":246,"props":4826,"children":4827},{"style":281},[4828],{"type":139,"value":603},{"type":130,"tag":246,"props":4830,"children":4831},{"style":253},[4832],{"type":139,"value":278},{"type":130,"tag":246,"props":4834,"children":4836},{"class":248,"line":4835},28,[4837,4842,4846,4850,4855],{"type":130,"tag":246,"props":4838,"children":4839},{"style":265},[4840],{"type":139,"value":4841},"    :sizes",{"type":130,"tag":246,"props":4843,"children":4844},{"style":253},[4845],{"type":139,"value":273},{"type":130,"tag":246,"props":4847,"children":4848},{"style":253},[4849],{"type":139,"value":278},{"type":130,"tag":246,"props":4851,"children":4852},{"style":281},[4853],{"type":139,"value":4854},"_srcset.sizes",{"type":130,"tag":246,"props":4856,"children":4857},{"style":253},[4858],{"type":139,"value":278},{"type":130,"tag":246,"props":4860,"children":4862},{"class":248,"line":4861},29,[4863,4868,4872],{"type":130,"tag":246,"props":4864,"children":4865},{"style":253},[4866],{"type":139,"value":4867},"  >\u003C/",{"type":130,"tag":246,"props":4869,"children":4870},{"style":259},[4871],{"type":139,"value":4210},{"type":130,"tag":246,"props":4873,"children":4874},{"style":253},[4875],{"type":139,"value":1643},{"type":130,"tag":246,"props":4877,"children":4879},{"class":248,"line":4878},30,[4880,4884,4888],{"type":130,"tag":246,"props":4881,"children":4882},{"style":253},[4883],{"type":139,"value":1680},{"type":130,"tag":246,"props":4885,"children":4886},{"style":259},[4887],{"type":139,"value":1703},{"type":130,"tag":246,"props":4889,"children":4890},{"style":253},[4891],{"type":139,"value":1643},{"type":130,"tag":529,"props":4893,"children":4894},{},[4895],{"type":139,"value":533},{"title":118,"searchDepth":470,"depth":470,"links":4897},[4898],{"id":116,"depth":470,"text":21,"children":4899},[4900],{"id":3969,"depth":495,"text":3975},"content:2.usage:3.use-image.md","2.usage/3.use-image.md",1697713011307]