[{"data":1,"prerenderedAt":3897},["Reactive",2],{"navigation":3,"docs-/usage/nuxt-img":133,"docs-/usage/nuxt-img-surround":3313},[4,20,33,123],{"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,105,108,111,114,117,120],{"title":37,"_path":38},"Aliyun","/providers/aliyun",{"title":40,"_path":41},"AWS Amplify","/providers/aws-amplify",{"title":43,"_path":44},"Caisy","/providers/caisy",{"title":46,"_path":47},"Cloudflare","/providers/cloudflare",{"title":49,"_path":50},"Cloudimage","/providers/cloudimage",{"title":52,"_path":53},"Cloudinary","/providers/cloudinary",{"title":55,"_path":56},"Contentful","/providers/contentful",{"title":58,"_path":59},"Directus","/providers/directus",{"title":61,"_path":62},"Edgio","/providers/edgio",{"title":64,"_path":65},"Fastly","/providers/fastly",{"title":67,"_path":68},"Glide","/providers/glide",{"title":70,"_path":71},"Gumlet","/providers/gumlet",{"title":73,"_path":74},"Hygraph","/providers/hygraph",{"title":76,"_path":77},"ImageEngine","/providers/imageengine",{"title":79,"_path":80},"ImageKit","/providers/imagekit",{"title":82,"_path":83},"Imgix","/providers/imgix",{"title":85,"_path":86},"IPX","/providers/ipx",{"title":88,"_path":89},"Netlify","/providers/netlify",{"title":91,"_path":92},"Prepr","/providers/prepr",{"title":94,"_path":95},"Prismic","/providers/prismic",{"title":97,"_path":98},"Sanity","/providers/sanity",{"title":100,"_path":101},"Sirv","/providers/sirv",{"title":103,"_path":104},"Storyblok","/providers/storyblok",{"title":106,"_path":107},"Strapi","/providers/strapi",{"title":109,"_path":110},"Twicpics","/providers/twicpics",{"title":112,"_path":113},"Unsplash","/providers/unsplash",{"title":115,"_path":116},"Uploadcare","/providers/uploadcare",{"title":118,"_path":119},"Vercel","/providers/vercel",{"title":121,"_path":122},"Weserv","/providers/weserv",{"title":124,"_path":125,"children":126},"Advanced","/advanced",[127,130],{"title":128,"_path":129},"Custom Provider","/advanced/custom-provider",{"title":131,"_path":132},"Static Images","/advanced/static-images",{"_path":26,"_dir":134,"_draft":135,"_partial":135,"_locale":136,"title":25,"description":137,"links":138,"body":144,"_type":3309,"_id":3310,"_source":3311,"_file":3312,"_extension":623},"usage",false,"","Discover how to use and configure the Nuxt Image component.",[139],{"label":140,"icon":141,"to":142,"size":143},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-img.ts","xs",{"type":145,"children":146,"toc":3288},"root",[147,167,229,234,256,315,320,362,392,398,406,411,433,476,498,512,517,540,547,552,565,578,626,635,716,724,729,736,889,897,902,907,1253,1267,1439,1447,1465,1472,1767,1775,1780,1800,2130,2138,2143,2212,2259,2267,2272,2381,2389,2400,2452,2555,2563,2571,2576,2587,2594,2738,2746,2758,2805,2813,2837,2849,2913,2921,2947,3113,3119,3141,3161,3282],{"type":148,"tag":149,"props":150,"children":151},"element","p",{},[152,158,160,165],{"type":148,"tag":153,"props":154,"children":155},"code",{"className":136},[156],{"type":157,"value":25},"text",{"type":157,"value":159}," is a drop-in replacement for the native ",{"type":148,"tag":153,"props":161,"children":162},{"className":136},[163],{"type":157,"value":164},"\u003Cimg>",{"type":157,"value":166}," tag.",{"type":148,"tag":168,"props":169,"children":170},"ul",{},[171,177,189,206,218],{"type":148,"tag":172,"props":173,"children":174},"li",{},[175],{"type":157,"value":176},"Uses built-in provider to optimize local and remote images",{"type":148,"tag":172,"props":178,"children":179},{},[180,182,187],{"type":157,"value":181},"Converts ",{"type":148,"tag":153,"props":183,"children":184},{"className":136},[185],{"type":157,"value":186},"src",{"type":157,"value":188}," to provider optimized URLs",{"type":148,"tag":172,"props":190,"children":191},{},[192,194,199,201],{"type":157,"value":193},"Automatically resizes images based on ",{"type":148,"tag":153,"props":195,"children":196},{"className":136},[197],{"type":157,"value":198},"width",{"type":157,"value":200}," and ",{"type":148,"tag":153,"props":202,"children":203},{"className":136},[204],{"type":157,"value":205},"height",{"type":148,"tag":172,"props":207,"children":208},{},[209,211,216],{"type":157,"value":210},"Generates responsive sizes when providing ",{"type":148,"tag":153,"props":212,"children":213},{"className":136},[214],{"type":157,"value":215},"sizes",{"type":157,"value":217}," option",{"type":148,"tag":172,"props":219,"children":220},{},[221,223,227],{"type":157,"value":222},"Supports native lazy loading as well as other ",{"type":148,"tag":153,"props":224,"children":225},{"className":136},[226],{"type":157,"value":164},{"type":157,"value":228}," attributes",{"type":148,"tag":230,"props":231,"children":232},"h2",{"id":134},[233],{"type":157,"value":21},{"type":148,"tag":149,"props":235,"children":236},{},[237,241,243,248,250,254],{"type":148,"tag":153,"props":238,"children":239},{"className":136},[240],{"type":157,"value":25},{"type":157,"value":242}," outputs a native ",{"type":148,"tag":153,"props":244,"children":245},{"className":136},[246],{"type":157,"value":247},"img",{"type":157,"value":249}," tag directly (without any wrapper around it). Use it like you would use the ",{"type":148,"tag":153,"props":251,"children":252},{"className":136},[253],{"type":157,"value":164},{"type":157,"value":255}," tag:",{"type":148,"tag":257,"props":258,"children":262},"pre",{"className":259,"code":260,"language":261,"meta":136,"style":136},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNuxtImg src=\"/nuxt-icon.png\" />\n","html",[263],{"type":148,"tag":153,"props":264,"children":265},{"__ignoreMap":136},[266],{"type":148,"tag":267,"props":268,"children":271},"span",{"class":269,"line":270},"line",1,[272,278,284,290,295,300,306,310],{"type":148,"tag":267,"props":273,"children":275},{"style":274},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[276],{"type":157,"value":277},"\u003C",{"type":148,"tag":267,"props":279,"children":281},{"style":280},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[282],{"type":157,"value":283},"NuxtImg",{"type":148,"tag":267,"props":285,"children":287},{"style":286},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[288],{"type":157,"value":289}," src",{"type":148,"tag":267,"props":291,"children":292},{"style":274},[293],{"type":157,"value":294},"=",{"type":148,"tag":267,"props":296,"children":297},{"style":274},[298],{"type":157,"value":299},"\"",{"type":148,"tag":267,"props":301,"children":303},{"style":302},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[304],{"type":157,"value":305},"/nuxt-icon.png",{"type":148,"tag":267,"props":307,"children":308},{"style":274},[309],{"type":157,"value":299},{"type":148,"tag":267,"props":311,"children":312},{"style":274},[313],{"type":157,"value":314}," />\n",{"type":148,"tag":149,"props":316,"children":317},{},[318],{"type":157,"value":319},"Will result in:",{"type":148,"tag":257,"props":321,"children":323},{"className":259,"code":322,"language":261,"meta":136,"style":136},"\u003Cimg src=\"/nuxt-icon.png\" />\n",[324],{"type":148,"tag":153,"props":325,"children":326},{"__ignoreMap":136},[327],{"type":148,"tag":267,"props":328,"children":329},{"class":269,"line":270},[330,334,338,342,346,350,354,358],{"type":148,"tag":267,"props":331,"children":332},{"style":274},[333],{"type":157,"value":277},{"type":148,"tag":267,"props":335,"children":336},{"style":280},[337],{"type":157,"value":247},{"type":148,"tag":267,"props":339,"children":340},{"style":286},[341],{"type":157,"value":289},{"type":148,"tag":267,"props":343,"children":344},{"style":274},[345],{"type":157,"value":294},{"type":148,"tag":267,"props":347,"children":348},{"style":274},[349],{"type":157,"value":299},{"type":148,"tag":267,"props":351,"children":352},{"style":302},[353],{"type":157,"value":305},{"type":148,"tag":267,"props":355,"children":356},{"style":274},[357],{"type":157,"value":299},{"type":148,"tag":267,"props":359,"children":360},{"style":274},[361],{"type":157,"value":314},{"type":148,"tag":363,"props":364,"children":365},"callout",{},[366],{"type":148,"tag":149,"props":367,"children":368},{},[369,371,377,379,383,385,390],{"type":157,"value":370},"With ",{"type":148,"tag":372,"props":373,"children":374},"a",{"href":16},[375],{"type":157,"value":376},"default provider",{"type":157,"value":378},", you should put ",{"type":148,"tag":153,"props":380,"children":381},{"className":136},[382],{"type":157,"value":305},{"type":157,"value":384}," inside ",{"type":148,"tag":153,"props":386,"children":387},{"className":136},[388],{"type":157,"value":389},"public/",{"type":157,"value":391}," directory for Nuxt 3 make the above example work.",{"type":148,"tag":230,"props":393,"children":395},{"id":394},"props",[396],{"type":157,"value":397},"Props",{"type":148,"tag":399,"props":400,"children":401},"h3",{"id":186},[402],{"type":148,"tag":153,"props":403,"children":404},{"className":136},[405],{"type":157,"value":186},{"type":148,"tag":149,"props":407,"children":408},{},[409],{"type":157,"value":410},"Path to image file",{"type":148,"tag":149,"props":412,"children":413},{},[414,418,420,424,426,431],{"type":148,"tag":153,"props":415,"children":416},{"className":136},[417],{"type":157,"value":186},{"type":157,"value":419}," should be in the form of an absolute path for static images in ",{"type":148,"tag":153,"props":421,"children":422},{"className":136},[423],{"type":157,"value":389},{"type":157,"value":425}," directory.\nOtherwise path that is expected by provider that starts with ",{"type":148,"tag":153,"props":427,"children":428},{"className":136},[429],{"type":157,"value":430},"/",{"type":157,"value":432}," or a URL.",{"type":148,"tag":257,"props":434,"children":436},{"className":259,"code":435,"language":261,"meta":136,"style":136},"\u003CNuxtImg src=\"/nuxt.png\" />\n",[437],{"type":148,"tag":153,"props":438,"children":439},{"__ignoreMap":136},[440],{"type":148,"tag":267,"props":441,"children":442},{"class":269,"line":270},[443,447,451,455,459,463,468,472],{"type":148,"tag":267,"props":444,"children":445},{"style":274},[446],{"type":157,"value":277},{"type":148,"tag":267,"props":448,"children":449},{"style":280},[450],{"type":157,"value":283},{"type":148,"tag":267,"props":452,"children":453},{"style":286},[454],{"type":157,"value":289},{"type":148,"tag":267,"props":456,"children":457},{"style":274},[458],{"type":157,"value":294},{"type":148,"tag":267,"props":460,"children":461},{"style":274},[462],{"type":157,"value":299},{"type":148,"tag":267,"props":464,"children":465},{"style":302},[466],{"type":157,"value":467},"/nuxt.png",{"type":148,"tag":267,"props":469,"children":470},{"style":274},[471],{"type":157,"value":299},{"type":148,"tag":267,"props":473,"children":474},{"style":274},[475],{"type":157,"value":314},{"type":148,"tag":149,"props":477,"children":478},{},[479,481,485,487,496],{"type":157,"value":480},"For image optimization when using external urls in ",{"type":148,"tag":153,"props":482,"children":483},{"className":136},[484],{"type":157,"value":186},{"type":157,"value":486},", we need to whitelist them using ",{"type":148,"tag":372,"props":488,"children":490},{"href":489},"/get-started/configuration#domains",[491],{"type":148,"tag":153,"props":492,"children":493},{"className":136},[494],{"type":157,"value":495},"domains",{"type":157,"value":497}," option.",{"type":148,"tag":399,"props":499,"children":501},{"id":500},"width-height",[502,506,508],{"type":148,"tag":153,"props":503,"children":504},{"className":136},[505],{"type":157,"value":198},{"type":157,"value":507}," / ",{"type":148,"tag":153,"props":509,"children":510},{"className":136},[511],{"type":157,"value":205},{"type":148,"tag":149,"props":513,"children":514},{},[515],{"type":157,"value":516},"Specify width/height of the image.",{"type":148,"tag":168,"props":518,"children":519},{},[520,525],{"type":148,"tag":172,"props":521,"children":522},{},[523],{"type":157,"value":524},"Use desired width/height for static sized images like icons or avatars",{"type":148,"tag":172,"props":526,"children":527},{},[528,530,538],{"type":157,"value":529},"Use original image width/height for responsive images (when using ",{"type":148,"tag":372,"props":531,"children":533},{"href":532},"#sizes",[534],{"type":148,"tag":153,"props":535,"children":536},{"className":136},[537],{"type":157,"value":215},{"type":157,"value":539},")",{"type":148,"tag":399,"props":541,"children":542},{"id":215},[543],{"type":148,"tag":153,"props":544,"children":545},{"className":136},[546],{"type":157,"value":215},{"type":148,"tag":149,"props":548,"children":549},{},[550],{"type":157,"value":551},"Specify responsive sizes.",{"type":148,"tag":149,"props":553,"children":554},{},[555,557,563],{"type":157,"value":556},"This is a space-separated list of screen size/width pairs. You can ",{"type":148,"tag":372,"props":558,"children":560},{"href":559},"/get-started/configuration#screens",[561],{"type":157,"value":562},"see a list of the defined screen sizes here",{"type":157,"value":564},").",{"type":148,"tag":149,"props":566,"children":567},{},[568,570,576],{"type":157,"value":569},"By default Nuxt generates ",{"type":148,"tag":571,"props":572,"children":573},"em",{},[574],{"type":157,"value":575},"responsive-first",{"type":157,"value":577}," sizing.",{"type":148,"tag":168,"props":579,"children":580},{},[581,593],{"type":148,"tag":172,"props":582,"children":583},{},[584,586,591],{"type":157,"value":585},"If you omit a screen size prefix (like ",{"type":148,"tag":153,"props":587,"children":588},{"className":136},[589],{"type":157,"value":590},"sm:",{"type":157,"value":592},") 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":148,"tag":172,"props":594,"children":595},{},[596,598,603,605,610,612,617,619,624],{"type":157,"value":597},"This default size is used up until the next specified screen width, and so on. Each specified size pair applies ",{"type":148,"tag":571,"props":599,"children":600},{},[601],{"type":157,"value":602},"up",{"type":157,"value":604}," - so ",{"type":148,"tag":153,"props":606,"children":607},{"className":136},[608],{"type":157,"value":609},"md:400px",{"type":157,"value":611}," means that the image will be sized ",{"type":148,"tag":153,"props":613,"children":614},{"className":136},[615],{"type":157,"value":616},"400px",{"type":157,"value":618}," on ",{"type":148,"tag":153,"props":620,"children":621},{"className":136},[622],{"type":157,"value":623},"md",{"type":157,"value":625}," screens and up.",{"type":148,"tag":149,"props":627,"children":628},{},[629],{"type":148,"tag":630,"props":631,"children":632},"strong",{},[633],{"type":157,"value":634},"Example:",{"type":148,"tag":257,"props":636,"children":638},{"className":259,"code":637,"language":261,"meta":136,"style":136},"\u003CNuxtImg\n  src=\"/logos/nuxt.png\"\n  sizes=\"100vw sm:50vw md:400px\"\n/>\n",[639],{"type":148,"tag":153,"props":640,"children":641},{"__ignoreMap":136},[642,654,681,707],{"type":148,"tag":267,"props":643,"children":644},{"class":269,"line":270},[645,649],{"type":148,"tag":267,"props":646,"children":647},{"style":274},[648],{"type":157,"value":277},{"type":148,"tag":267,"props":650,"children":651},{"style":280},[652],{"type":157,"value":653},"NuxtImg\n",{"type":148,"tag":267,"props":655,"children":657},{"class":269,"line":656},2,[658,663,667,671,676],{"type":148,"tag":267,"props":659,"children":660},{"style":286},[661],{"type":157,"value":662},"  src",{"type":148,"tag":267,"props":664,"children":665},{"style":274},[666],{"type":157,"value":294},{"type":148,"tag":267,"props":668,"children":669},{"style":274},[670],{"type":157,"value":299},{"type":148,"tag":267,"props":672,"children":673},{"style":302},[674],{"type":157,"value":675},"/logos/nuxt.png",{"type":148,"tag":267,"props":677,"children":678},{"style":274},[679],{"type":157,"value":680},"\"\n",{"type":148,"tag":267,"props":682,"children":684},{"class":269,"line":683},3,[685,690,694,698,703],{"type":148,"tag":267,"props":686,"children":687},{"style":286},[688],{"type":157,"value":689},"  sizes",{"type":148,"tag":267,"props":691,"children":692},{"style":274},[693],{"type":157,"value":294},{"type":148,"tag":267,"props":695,"children":696},{"style":274},[697],{"type":157,"value":299},{"type":148,"tag":267,"props":699,"children":700},{"style":302},[701],{"type":157,"value":702},"100vw sm:50vw md:400px",{"type":148,"tag":267,"props":704,"children":705},{"style":274},[706],{"type":157,"value":680},{"type":148,"tag":267,"props":708,"children":710},{"class":269,"line":709},4,[711],{"type":148,"tag":267,"props":712,"children":713},{"style":274},[714],{"type":157,"value":715},"/>\n",{"type":148,"tag":399,"props":717,"children":719},{"id":718},"densities",[720],{"type":148,"tag":153,"props":721,"children":722},{"className":136},[723],{"type":157,"value":718},{"type":148,"tag":149,"props":725,"children":726},{},[727],{"type":157,"value":728},"To generate special versions of images for screens with increased pixel density.",{"type":148,"tag":149,"props":730,"children":731},{},[732],{"type":148,"tag":630,"props":733,"children":734},{},[735],{"type":157,"value":634},{"type":148,"tag":257,"props":737,"children":739},{"className":259,"code":738,"language":261,"meta":136,"style":136},"\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",[740],{"type":148,"tag":153,"props":741,"children":742},{"__ignoreMap":136},[743,754,777,802,827,835,845,854,863,872,880],{"type":148,"tag":267,"props":744,"children":745},{"class":269,"line":270},[746,750],{"type":148,"tag":267,"props":747,"children":748},{"style":274},[749],{"type":157,"value":277},{"type":148,"tag":267,"props":751,"children":752},{"style":280},[753],{"type":157,"value":653},{"type":148,"tag":267,"props":755,"children":756},{"class":269,"line":656},[757,761,765,769,773],{"type":148,"tag":267,"props":758,"children":759},{"style":286},[760],{"type":157,"value":662},{"type":148,"tag":267,"props":762,"children":763},{"style":274},[764],{"type":157,"value":294},{"type":148,"tag":267,"props":766,"children":767},{"style":274},[768],{"type":157,"value":299},{"type":148,"tag":267,"props":770,"children":771},{"style":302},[772],{"type":157,"value":675},{"type":148,"tag":267,"props":774,"children":775},{"style":274},[776],{"type":157,"value":680},{"type":148,"tag":267,"props":778,"children":779},{"class":269,"line":683},[780,785,789,793,798],{"type":148,"tag":267,"props":781,"children":782},{"style":286},[783],{"type":157,"value":784},"  height",{"type":148,"tag":267,"props":786,"children":787},{"style":274},[788],{"type":157,"value":294},{"type":148,"tag":267,"props":790,"children":791},{"style":274},[792],{"type":157,"value":299},{"type":148,"tag":267,"props":794,"children":795},{"style":302},[796],{"type":157,"value":797},"50",{"type":148,"tag":267,"props":799,"children":800},{"style":274},[801],{"type":157,"value":680},{"type":148,"tag":267,"props":803,"children":804},{"class":269,"line":709},[805,810,814,818,823],{"type":148,"tag":267,"props":806,"children":807},{"style":286},[808],{"type":157,"value":809},"  densities",{"type":148,"tag":267,"props":811,"children":812},{"style":274},[813],{"type":157,"value":294},{"type":148,"tag":267,"props":815,"children":816},{"style":274},[817],{"type":157,"value":299},{"type":148,"tag":267,"props":819,"children":820},{"style":302},[821],{"type":157,"value":822},"x1 x2",{"type":148,"tag":267,"props":824,"children":825},{"style":274},[826],{"type":157,"value":680},{"type":148,"tag":267,"props":828,"children":830},{"class":269,"line":829},5,[831],{"type":148,"tag":267,"props":832,"children":833},{"style":274},[834],{"type":157,"value":715},{"type":148,"tag":267,"props":836,"children":838},{"class":269,"line":837},6,[839],{"type":148,"tag":267,"props":840,"children":842},{"style":841},"--shiki-light:#90A4AE;--shiki-default:#546E7A;--shiki-dark:#676E95;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[843],{"type":157,"value":844},"\u003C!--\n",{"type":148,"tag":267,"props":846,"children":848},{"class":269,"line":847},7,[849],{"type":148,"tag":267,"props":850,"children":851},{"style":841},[852],{"type":157,"value":853},"\u003Cimg\n",{"type":148,"tag":267,"props":855,"children":857},{"class":269,"line":856},8,[858],{"type":148,"tag":267,"props":859,"children":860},{"style":841},[861],{"type":157,"value":862},"  src=\"/_ipx/w_50/logos/nuxt.png\" \n",{"type":148,"tag":267,"props":864,"children":866},{"class":269,"line":865},9,[867],{"type":148,"tag":267,"props":868,"children":869},{"style":841},[870],{"type":157,"value":871},"  srcset=\"/_ipx/w_100/logos/nuxt.png x2\"\n",{"type":148,"tag":267,"props":873,"children":875},{"class":269,"line":874},10,[876],{"type":148,"tag":267,"props":877,"children":878},{"style":841},[879],{"type":157,"value":715},{"type":148,"tag":267,"props":881,"children":883},{"class":269,"line":882},11,[884],{"type":148,"tag":267,"props":885,"children":886},{"style":841},[887],{"type":157,"value":888},"-->\n",{"type":148,"tag":399,"props":890,"children":892},{"id":891},"placeholder",[893],{"type":148,"tag":153,"props":894,"children":895},{"className":136},[896],{"type":157,"value":891},{"type":148,"tag":149,"props":898,"children":899},{},[900],{"type":157,"value":901},"Display a placeholder image before the actual image is fully loaded.",{"type":148,"tag":149,"props":903,"children":904},{},[905],{"type":157,"value":906},"The placeholder prop can be either a string, a boolean, a number, or an array. The usage is shown below for each case.",{"type":148,"tag":257,"props":908,"children":910},{"className":259,"code":909,"language":261,"meta":136,"style":136},"\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",[911],{"type":148,"tag":153,"props":912,"children":913},{"__ignoreMap":136},[914,922,963,972,980,1037,1044,1052,1108,1115,1123,1179,1187,1196],{"type":148,"tag":267,"props":915,"children":916},{"class":269,"line":270},[917],{"type":148,"tag":267,"props":918,"children":919},{"style":841},[920],{"type":157,"value":921},"\u003C!-- Automatically generate a placeholder based on the original image -->\n",{"type":148,"tag":267,"props":923,"children":924},{"class":269,"line":656},[925,929,934,938,942,946,950,954,959],{"type":148,"tag":267,"props":926,"children":927},{"style":274},[928],{"type":157,"value":277},{"type":148,"tag":267,"props":930,"children":931},{"style":280},[932],{"type":157,"value":933},"nuxt-img",{"type":148,"tag":267,"props":935,"children":936},{"style":286},[937],{"type":157,"value":289},{"type":148,"tag":267,"props":939,"children":940},{"style":274},[941],{"type":157,"value":294},{"type":148,"tag":267,"props":943,"children":944},{"style":274},[945],{"type":157,"value":299},{"type":148,"tag":267,"props":947,"children":948},{"style":302},[949],{"type":157,"value":467},{"type":148,"tag":267,"props":951,"children":952},{"style":274},[953],{"type":157,"value":299},{"type":148,"tag":267,"props":955,"children":956},{"style":286},[957],{"type":157,"value":958}," placeholder",{"type":148,"tag":267,"props":960,"children":961},{"style":274},[962],{"type":157,"value":314},{"type":148,"tag":267,"props":964,"children":965},{"class":269,"line":683},[966],{"type":148,"tag":267,"props":967,"children":969},{"emptyLinePlaceholder":968},true,[970],{"type":157,"value":971},"\n",{"type":148,"tag":267,"props":973,"children":974},{"class":269,"line":709},[975],{"type":148,"tag":267,"props":976,"children":977},{"style":841},[978],{"type":157,"value":979},"\u003C!-- Set a width, height for the automatically generated placeholder  -->\n",{"type":148,"tag":267,"props":981,"children":982},{"class":269,"line":829},[983,987,991,995,999,1003,1007,1011,1016,1020,1024,1029,1033],{"type":148,"tag":267,"props":984,"children":985},{"style":274},[986],{"type":157,"value":277},{"type":148,"tag":267,"props":988,"children":989},{"style":280},[990],{"type":157,"value":933},{"type":148,"tag":267,"props":992,"children":993},{"style":286},[994],{"type":157,"value":289},{"type":148,"tag":267,"props":996,"children":997},{"style":274},[998],{"type":157,"value":294},{"type":148,"tag":267,"props":1000,"children":1001},{"style":274},[1002],{"type":157,"value":299},{"type":148,"tag":267,"props":1004,"children":1005},{"style":302},[1006],{"type":157,"value":467},{"type":148,"tag":267,"props":1008,"children":1009},{"style":274},[1010],{"type":157,"value":299},{"type":148,"tag":267,"props":1012,"children":1013},{"style":286},[1014],{"type":157,"value":1015}," :placeholder",{"type":148,"tag":267,"props":1017,"children":1018},{"style":274},[1019],{"type":157,"value":294},{"type":148,"tag":267,"props":1021,"children":1022},{"style":274},[1023],{"type":157,"value":299},{"type":148,"tag":267,"props":1025,"children":1026},{"style":302},[1027],{"type":157,"value":1028},"[50, 25]",{"type":148,"tag":267,"props":1030,"children":1031},{"style":274},[1032],{"type":157,"value":299},{"type":148,"tag":267,"props":1034,"children":1035},{"style":274},[1036],{"type":157,"value":314},{"type":148,"tag":267,"props":1038,"children":1039},{"class":269,"line":837},[1040],{"type":148,"tag":267,"props":1041,"children":1042},{"emptyLinePlaceholder":968},[1043],{"type":157,"value":971},{"type":148,"tag":267,"props":1045,"children":1046},{"class":269,"line":847},[1047],{"type":148,"tag":267,"props":1048,"children":1049},{"style":841},[1050],{"type":157,"value":1051},"\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n",{"type":148,"tag":267,"props":1053,"children":1054},{"class":269,"line":856},[1055,1059,1063,1067,1071,1075,1079,1083,1087,1091,1095,1100,1104],{"type":148,"tag":267,"props":1056,"children":1057},{"style":274},[1058],{"type":157,"value":277},{"type":148,"tag":267,"props":1060,"children":1061},{"style":280},[1062],{"type":157,"value":933},{"type":148,"tag":267,"props":1064,"children":1065},{"style":286},[1066],{"type":157,"value":289},{"type":148,"tag":267,"props":1068,"children":1069},{"style":274},[1070],{"type":157,"value":294},{"type":148,"tag":267,"props":1072,"children":1073},{"style":274},[1074],{"type":157,"value":299},{"type":148,"tag":267,"props":1076,"children":1077},{"style":302},[1078],{"type":157,"value":467},{"type":148,"tag":267,"props":1080,"children":1081},{"style":274},[1082],{"type":157,"value":299},{"type":148,"tag":267,"props":1084,"children":1085},{"style":286},[1086],{"type":157,"value":1015},{"type":148,"tag":267,"props":1088,"children":1089},{"style":274},[1090],{"type":157,"value":294},{"type":148,"tag":267,"props":1092,"children":1093},{"style":274},[1094],{"type":157,"value":299},{"type":148,"tag":267,"props":1096,"children":1097},{"style":302},[1098],{"type":157,"value":1099},"[50, 25, 75, 5]",{"type":148,"tag":267,"props":1101,"children":1102},{"style":274},[1103],{"type":157,"value":299},{"type":148,"tag":267,"props":1105,"children":1106},{"style":274},[1107],{"type":157,"value":314},{"type":148,"tag":267,"props":1109,"children":1110},{"class":269,"line":865},[1111],{"type":148,"tag":267,"props":1112,"children":1113},{"emptyLinePlaceholder":968},[1114],{"type":157,"value":971},{"type":148,"tag":267,"props":1116,"children":1117},{"class":269,"line":874},[1118],{"type":148,"tag":267,"props":1119,"children":1120},{"style":841},[1121],{"type":157,"value":1122},"\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n",{"type":148,"tag":267,"props":1124,"children":1125},{"class":269,"line":882},[1126,1130,1134,1138,1142,1146,1150,1154,1158,1162,1166,1171,1175],{"type":148,"tag":267,"props":1127,"children":1128},{"style":274},[1129],{"type":157,"value":277},{"type":148,"tag":267,"props":1131,"children":1132},{"style":280},[1133],{"type":157,"value":933},{"type":148,"tag":267,"props":1135,"children":1136},{"style":286},[1137],{"type":157,"value":289},{"type":148,"tag":267,"props":1139,"children":1140},{"style":274},[1141],{"type":157,"value":294},{"type":148,"tag":267,"props":1143,"children":1144},{"style":274},[1145],{"type":157,"value":299},{"type":148,"tag":267,"props":1147,"children":1148},{"style":302},[1149],{"type":157,"value":467},{"type":148,"tag":267,"props":1151,"children":1152},{"style":274},[1153],{"type":157,"value":299},{"type":148,"tag":267,"props":1155,"children":1156},{"style":286},[1157],{"type":157,"value":1015},{"type":148,"tag":267,"props":1159,"children":1160},{"style":274},[1161],{"type":157,"value":294},{"type":148,"tag":267,"props":1163,"children":1164},{"style":274},[1165],{"type":157,"value":299},{"type":148,"tag":267,"props":1167,"children":1168},{"style":302},[1169],{"type":157,"value":1170},"15",{"type":148,"tag":267,"props":1172,"children":1173},{"style":274},[1174],{"type":157,"value":299},{"type":148,"tag":267,"props":1176,"children":1177},{"style":274},[1178],{"type":157,"value":314},{"type":148,"tag":267,"props":1180,"children":1182},{"class":269,"line":1181},12,[1183],{"type":148,"tag":267,"props":1184,"children":1185},{"emptyLinePlaceholder":968},[1186],{"type":157,"value":971},{"type":148,"tag":267,"props":1188,"children":1190},{"class":269,"line":1189},13,[1191],{"type":148,"tag":267,"props":1192,"children":1193},{"style":841},[1194],{"type":157,"value":1195},"\u003C!-- Provide your own image -->\n",{"type":148,"tag":267,"props":1197,"children":1199},{"class":269,"line":1198},14,[1200,1204,1208,1212,1216,1220,1224,1228,1232,1236,1240,1245,1249],{"type":148,"tag":267,"props":1201,"children":1202},{"style":274},[1203],{"type":157,"value":277},{"type":148,"tag":267,"props":1205,"children":1206},{"style":280},[1207],{"type":157,"value":933},{"type":148,"tag":267,"props":1209,"children":1210},{"style":286},[1211],{"type":157,"value":289},{"type":148,"tag":267,"props":1213,"children":1214},{"style":274},[1215],{"type":157,"value":294},{"type":148,"tag":267,"props":1217,"children":1218},{"style":274},[1219],{"type":157,"value":299},{"type":148,"tag":267,"props":1221,"children":1222},{"style":302},[1223],{"type":157,"value":467},{"type":148,"tag":267,"props":1225,"children":1226},{"style":274},[1227],{"type":157,"value":299},{"type":148,"tag":267,"props":1229,"children":1230},{"style":286},[1231],{"type":157,"value":958},{"type":148,"tag":267,"props":1233,"children":1234},{"style":274},[1235],{"type":157,"value":294},{"type":148,"tag":267,"props":1237,"children":1238},{"style":274},[1239],{"type":157,"value":299},{"type":148,"tag":267,"props":1241,"children":1242},{"style":302},[1243],{"type":157,"value":1244},"./placeholder.png",{"type":148,"tag":267,"props":1246,"children":1247},{"style":274},[1248],{"type":157,"value":299},{"type":148,"tag":267,"props":1250,"children":1251},{"style":274},[1252],{"type":157,"value":314},{"type":148,"tag":149,"props":1254,"children":1255},{},[1256,1258,1265],{"type":157,"value":1257},"You can also leverage ",{"type":148,"tag":372,"props":1259,"children":1260},{"href":32},[1261],{"type":148,"tag":153,"props":1262,"children":1263},{"className":136},[1264],{"type":157,"value":31},{"type":157,"value":1266}," 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":148,"tag":257,"props":1268,"children":1272},{"className":1269,"code":1270,"language":1271,"meta":136,"style":136},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\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",[1273],{"type":148,"tag":153,"props":1274,"children":1275},{"__ignoreMap":136},[1276,1298,1327,1343,1350,1366,1424],{"type":148,"tag":267,"props":1277,"children":1278},{"class":269,"line":270},[1279,1283,1288,1293],{"type":148,"tag":267,"props":1280,"children":1281},{"style":274},[1282],{"type":157,"value":277},{"type":148,"tag":267,"props":1284,"children":1285},{"style":280},[1286],{"type":157,"value":1287},"script",{"type":148,"tag":267,"props":1289,"children":1290},{"style":286},[1291],{"type":157,"value":1292}," setup",{"type":148,"tag":267,"props":1294,"children":1295},{"style":274},[1296],{"type":157,"value":1297},">\n",{"type":148,"tag":267,"props":1299,"children":1300},{"class":269,"line":656},[1301,1306,1312,1316,1322],{"type":148,"tag":267,"props":1302,"children":1303},{"style":286},[1304],{"type":157,"value":1305},"const",{"type":148,"tag":267,"props":1307,"children":1309},{"style":1308},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[1310],{"type":157,"value":1311}," img ",{"type":148,"tag":267,"props":1313,"children":1314},{"style":274},[1315],{"type":157,"value":294},{"type":148,"tag":267,"props":1317,"children":1319},{"style":1318},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[1320],{"type":157,"value":1321}," useImage",{"type":148,"tag":267,"props":1323,"children":1324},{"style":1308},[1325],{"type":157,"value":1326},"()\n",{"type":148,"tag":267,"props":1328,"children":1329},{"class":269,"line":683},[1330,1335,1339],{"type":148,"tag":267,"props":1331,"children":1332},{"style":274},[1333],{"type":157,"value":1334},"\u003C/",{"type":148,"tag":267,"props":1336,"children":1337},{"style":280},[1338],{"type":157,"value":1287},{"type":148,"tag":267,"props":1340,"children":1341},{"style":274},[1342],{"type":157,"value":1297},{"type":148,"tag":267,"props":1344,"children":1345},{"class":269,"line":709},[1346],{"type":148,"tag":267,"props":1347,"children":1348},{"emptyLinePlaceholder":968},[1349],{"type":157,"value":971},{"type":148,"tag":267,"props":1351,"children":1352},{"class":269,"line":829},[1353,1357,1362],{"type":148,"tag":267,"props":1354,"children":1355},{"style":274},[1356],{"type":157,"value":277},{"type":148,"tag":267,"props":1358,"children":1359},{"style":280},[1360],{"type":157,"value":1361},"template",{"type":148,"tag":267,"props":1363,"children":1364},{"style":274},[1365],{"type":157,"value":1297},{"type":148,"tag":267,"props":1367,"children":1368},{"class":269,"line":837},[1369,1374,1378,1382,1386,1390,1395,1399,1403,1407,1411,1416,1420],{"type":148,"tag":267,"props":1370,"children":1371},{"style":274},[1372],{"type":157,"value":1373},"  \u003C",{"type":148,"tag":267,"props":1375,"children":1376},{"style":280},[1377],{"type":157,"value":283},{"type":148,"tag":267,"props":1379,"children":1380},{"style":286},[1381],{"type":157,"value":1015},{"type":148,"tag":267,"props":1383,"children":1384},{"style":274},[1385],{"type":157,"value":294},{"type":148,"tag":267,"props":1387,"children":1388},{"style":274},[1389],{"type":157,"value":299},{"type":148,"tag":267,"props":1391,"children":1392},{"style":302},[1393],{"type":157,"value":1394},"img(`/nuxt.svg`, { h: 10, f: 'png', blur: 2, q: 50 })",{"type":148,"tag":267,"props":1396,"children":1397},{"style":274},[1398],{"type":157,"value":299},{"type":148,"tag":267,"props":1400,"children":1401},{"style":286},[1402],{"type":157,"value":289},{"type":148,"tag":267,"props":1404,"children":1405},{"style":274},[1406],{"type":157,"value":294},{"type":148,"tag":267,"props":1408,"children":1409},{"style":274},[1410],{"type":157,"value":299},{"type":148,"tag":267,"props":1412,"children":1413},{"style":302},[1414],{"type":157,"value":1415},"/nuxt.svg`",{"type":148,"tag":267,"props":1417,"children":1418},{"style":274},[1419],{"type":157,"value":299},{"type":148,"tag":267,"props":1421,"children":1422},{"style":274},[1423],{"type":157,"value":314},{"type":148,"tag":267,"props":1425,"children":1426},{"class":269,"line":847},[1427,1431,1435],{"type":148,"tag":267,"props":1428,"children":1429},{"style":274},[1430],{"type":157,"value":1334},{"type":148,"tag":267,"props":1432,"children":1433},{"style":280},[1434],{"type":157,"value":1361},{"type":148,"tag":267,"props":1436,"children":1437},{"style":274},[1438],{"type":157,"value":1297},{"type":148,"tag":399,"props":1440,"children":1442},{"id":1441},"provider",[1443],{"type":148,"tag":153,"props":1444,"children":1445},{"className":136},[1446],{"type":157,"value":1441},{"type":148,"tag":149,"props":1448,"children":1449},{},[1450,1452,1458,1460],{"type":157,"value":1451},"Use other provider instead of default ",{"type":148,"tag":372,"props":1453,"children":1455},{"href":1454},"/get-started/configuration#provider",[1456],{"type":157,"value":1457},"provider option",{"type":157,"value":1459}," specified in ",{"type":148,"tag":153,"props":1461,"children":1462},{"className":136},[1463],{"type":157,"value":1464},"nuxt.config",{"type":148,"tag":149,"props":1466,"children":1467},{},[1468],{"type":148,"tag":630,"props":1469,"children":1470},{},[1471],{"type":157,"value":634},{"type":148,"tag":1473,"props":1474,"children":1475},"code-group",{},[1476,1633],{"type":148,"tag":257,"props":1477,"children":1480},{"className":259,"code":1478,"filename":1479,"language":261,"meta":136,"style":136},"\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",[1481],{"type":148,"tag":153,"props":1482,"children":1483},{"__ignoreMap":136},[1484,1499,1510,1535,1560,1585,1610,1618],{"type":148,"tag":267,"props":1485,"children":1486},{"class":269,"line":270},[1487,1491,1495],{"type":148,"tag":267,"props":1488,"children":1489},{"style":274},[1490],{"type":157,"value":277},{"type":148,"tag":267,"props":1492,"children":1493},{"style":280},[1494],{"type":157,"value":1361},{"type":148,"tag":267,"props":1496,"children":1497},{"style":274},[1498],{"type":157,"value":1297},{"type":148,"tag":267,"props":1500,"children":1501},{"class":269,"line":656},[1502,1506],{"type":148,"tag":267,"props":1503,"children":1504},{"style":274},[1505],{"type":157,"value":1373},{"type":148,"tag":267,"props":1507,"children":1508},{"style":280},[1509],{"type":157,"value":653},{"type":148,"tag":267,"props":1511,"children":1512},{"class":269,"line":683},[1513,1518,1522,1526,1531],{"type":148,"tag":267,"props":1514,"children":1515},{"style":286},[1516],{"type":157,"value":1517},"    provider",{"type":148,"tag":267,"props":1519,"children":1520},{"style":274},[1521],{"type":157,"value":294},{"type":148,"tag":267,"props":1523,"children":1524},{"style":274},[1525],{"type":157,"value":299},{"type":148,"tag":267,"props":1527,"children":1528},{"style":302},[1529],{"type":157,"value":1530},"cloudinary",{"type":148,"tag":267,"props":1532,"children":1533},{"style":274},[1534],{"type":157,"value":680},{"type":148,"tag":267,"props":1536,"children":1537},{"class":269,"line":709},[1538,1543,1547,1551,1556],{"type":148,"tag":267,"props":1539,"children":1540},{"style":286},[1541],{"type":157,"value":1542},"    src",{"type":148,"tag":267,"props":1544,"children":1545},{"style":274},[1546],{"type":157,"value":294},{"type":148,"tag":267,"props":1548,"children":1549},{"style":274},[1550],{"type":157,"value":299},{"type":148,"tag":267,"props":1552,"children":1553},{"style":302},[1554],{"type":157,"value":1555},"/remote/nuxt-org/blog/going-full-static/main.png",{"type":148,"tag":267,"props":1557,"children":1558},{"style":274},[1559],{"type":157,"value":680},{"type":148,"tag":267,"props":1561,"children":1562},{"class":269,"line":829},[1563,1568,1572,1576,1581],{"type":148,"tag":267,"props":1564,"children":1565},{"style":286},[1566],{"type":157,"value":1567},"    width",{"type":148,"tag":267,"props":1569,"children":1570},{"style":274},[1571],{"type":157,"value":294},{"type":148,"tag":267,"props":1573,"children":1574},{"style":274},[1575],{"type":157,"value":299},{"type":148,"tag":267,"props":1577,"children":1578},{"style":302},[1579],{"type":157,"value":1580},"300",{"type":148,"tag":267,"props":1582,"children":1583},{"style":274},[1584],{"type":157,"value":680},{"type":148,"tag":267,"props":1586,"children":1587},{"class":269,"line":837},[1588,1593,1597,1601,1606],{"type":148,"tag":267,"props":1589,"children":1590},{"style":286},[1591],{"type":157,"value":1592},"    height",{"type":148,"tag":267,"props":1594,"children":1595},{"style":274},[1596],{"type":157,"value":294},{"type":148,"tag":267,"props":1598,"children":1599},{"style":274},[1600],{"type":157,"value":299},{"type":148,"tag":267,"props":1602,"children":1603},{"style":302},[1604],{"type":157,"value":1605},"169",{"type":148,"tag":267,"props":1607,"children":1608},{"style":274},[1609],{"type":157,"value":680},{"type":148,"tag":267,"props":1611,"children":1612},{"class":269,"line":847},[1613],{"type":148,"tag":267,"props":1614,"children":1615},{"style":274},[1616],{"type":157,"value":1617},"  />\n",{"type":148,"tag":267,"props":1619,"children":1620},{"class":269,"line":856},[1621,1625,1629],{"type":148,"tag":267,"props":1622,"children":1623},{"style":274},[1624],{"type":157,"value":1334},{"type":148,"tag":267,"props":1626,"children":1627},{"style":280},[1628],{"type":157,"value":1361},{"type":148,"tag":267,"props":1630,"children":1631},{"style":274},[1632],{"type":157,"value":1297},{"type":148,"tag":257,"props":1634,"children":1639},{"className":1635,"code":1636,"filename":1637,"language":1638,"meta":136,"style":136},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  image: {\n    cloudinary: {\n      baseURL: 'https://res.cloudinary.com/nuxt/image/upload/',\n    },\n  },\n})\n","nuxt.config.ts","ts",[1640],{"type":148,"tag":153,"props":1641,"children":1642},{"__ignoreMap":136},[1643,1672,1690,1706,1738,1746,1754],{"type":148,"tag":267,"props":1644,"children":1645},{"class":269,"line":270},[1646,1652,1657,1662,1667],{"type":148,"tag":267,"props":1647,"children":1649},{"style":1648},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[1650],{"type":157,"value":1651},"export",{"type":148,"tag":267,"props":1653,"children":1654},{"style":1648},[1655],{"type":157,"value":1656}," default",{"type":148,"tag":267,"props":1658,"children":1659},{"style":1318},[1660],{"type":157,"value":1661}," defineNuxtConfig",{"type":148,"tag":267,"props":1663,"children":1664},{"style":1308},[1665],{"type":157,"value":1666},"(",{"type":148,"tag":267,"props":1668,"children":1669},{"style":274},[1670],{"type":157,"value":1671},"{\n",{"type":148,"tag":267,"props":1673,"children":1674},{"class":269,"line":656},[1675,1680,1685],{"type":148,"tag":267,"props":1676,"children":1677},{"style":280},[1678],{"type":157,"value":1679},"  image",{"type":148,"tag":267,"props":1681,"children":1682},{"style":274},[1683],{"type":157,"value":1684},":",{"type":148,"tag":267,"props":1686,"children":1687},{"style":274},[1688],{"type":157,"value":1689}," {\n",{"type":148,"tag":267,"props":1691,"children":1692},{"class":269,"line":683},[1693,1698,1702],{"type":148,"tag":267,"props":1694,"children":1695},{"style":280},[1696],{"type":157,"value":1697},"    cloudinary",{"type":148,"tag":267,"props":1699,"children":1700},{"style":274},[1701],{"type":157,"value":1684},{"type":148,"tag":267,"props":1703,"children":1704},{"style":274},[1705],{"type":157,"value":1689},{"type":148,"tag":267,"props":1707,"children":1708},{"class":269,"line":709},[1709,1714,1718,1723,1728,1733],{"type":148,"tag":267,"props":1710,"children":1711},{"style":280},[1712],{"type":157,"value":1713},"      baseURL",{"type":148,"tag":267,"props":1715,"children":1716},{"style":274},[1717],{"type":157,"value":1684},{"type":148,"tag":267,"props":1719,"children":1720},{"style":274},[1721],{"type":157,"value":1722}," '",{"type":148,"tag":267,"props":1724,"children":1725},{"style":302},[1726],{"type":157,"value":1727},"https://res.cloudinary.com/nuxt/image/upload/",{"type":148,"tag":267,"props":1729,"children":1730},{"style":274},[1731],{"type":157,"value":1732},"'",{"type":148,"tag":267,"props":1734,"children":1735},{"style":274},[1736],{"type":157,"value":1737},",\n",{"type":148,"tag":267,"props":1739,"children":1740},{"class":269,"line":829},[1741],{"type":148,"tag":267,"props":1742,"children":1743},{"style":274},[1744],{"type":157,"value":1745},"    },\n",{"type":148,"tag":267,"props":1747,"children":1748},{"class":269,"line":837},[1749],{"type":148,"tag":267,"props":1750,"children":1751},{"style":274},[1752],{"type":157,"value":1753},"  },\n",{"type":148,"tag":267,"props":1755,"children":1756},{"class":269,"line":847},[1757,1762],{"type":148,"tag":267,"props":1758,"children":1759},{"style":274},[1760],{"type":157,"value":1761},"}",{"type":148,"tag":267,"props":1763,"children":1764},{"style":1308},[1765],{"type":157,"value":1766},")\n",{"type":148,"tag":399,"props":1768,"children":1770},{"id":1769},"preset",[1771],{"type":148,"tag":153,"props":1772,"children":1773},{"className":136},[1774],{"type":157,"value":1769},{"type":148,"tag":149,"props":1776,"children":1777},{},[1778],{"type":157,"value":1779},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",{"type":148,"tag":363,"props":1781,"children":1782},{},[1783],{"type":148,"tag":149,"props":1784,"children":1785},{},[1786,1788,1794,1796],{"type":157,"value":1787},"We can define presets using ",{"type":148,"tag":372,"props":1789,"children":1791},{"href":1790},"/get-started/configuration#presets",[1792],{"type":157,"value":1793},"presets options",{"type":157,"value":1795}," in ",{"type":148,"tag":153,"props":1797,"children":1798},{"className":136},[1799],{"type":157,"value":1464},{"type":148,"tag":1473,"props":1801,"children":1802},{},[1803,1897],{"type":148,"tag":257,"props":1804,"children":1806},{"className":259,"code":1805,"filename":1479,"language":261,"meta":136,"style":136},"\u003Ctemplate>\n  \u003CNuxtImg preset=\"cover\" src=\"/nuxt-icon.png\" />\n\u003C/template>\n",[1807],{"type":148,"tag":153,"props":1808,"children":1809},{"__ignoreMap":136},[1810,1825,1882],{"type":148,"tag":267,"props":1811,"children":1812},{"class":269,"line":270},[1813,1817,1821],{"type":148,"tag":267,"props":1814,"children":1815},{"style":274},[1816],{"type":157,"value":277},{"type":148,"tag":267,"props":1818,"children":1819},{"style":280},[1820],{"type":157,"value":1361},{"type":148,"tag":267,"props":1822,"children":1823},{"style":274},[1824],{"type":157,"value":1297},{"type":148,"tag":267,"props":1826,"children":1827},{"class":269,"line":656},[1828,1832,1836,1841,1845,1849,1854,1858,1862,1866,1870,1874,1878],{"type":148,"tag":267,"props":1829,"children":1830},{"style":274},[1831],{"type":157,"value":1373},{"type":148,"tag":267,"props":1833,"children":1834},{"style":280},[1835],{"type":157,"value":283},{"type":148,"tag":267,"props":1837,"children":1838},{"style":286},[1839],{"type":157,"value":1840}," preset",{"type":148,"tag":267,"props":1842,"children":1843},{"style":274},[1844],{"type":157,"value":294},{"type":148,"tag":267,"props":1846,"children":1847},{"style":274},[1848],{"type":157,"value":299},{"type":148,"tag":267,"props":1850,"children":1851},{"style":302},[1852],{"type":157,"value":1853},"cover",{"type":148,"tag":267,"props":1855,"children":1856},{"style":274},[1857],{"type":157,"value":299},{"type":148,"tag":267,"props":1859,"children":1860},{"style":286},[1861],{"type":157,"value":289},{"type":148,"tag":267,"props":1863,"children":1864},{"style":274},[1865],{"type":157,"value":294},{"type":148,"tag":267,"props":1867,"children":1868},{"style":274},[1869],{"type":157,"value":299},{"type":148,"tag":267,"props":1871,"children":1872},{"style":302},[1873],{"type":157,"value":305},{"type":148,"tag":267,"props":1875,"children":1876},{"style":274},[1877],{"type":157,"value":299},{"type":148,"tag":267,"props":1879,"children":1880},{"style":274},[1881],{"type":157,"value":314},{"type":148,"tag":267,"props":1883,"children":1884},{"class":269,"line":683},[1885,1889,1893],{"type":148,"tag":267,"props":1886,"children":1887},{"style":274},[1888],{"type":157,"value":1334},{"type":148,"tag":267,"props":1890,"children":1891},{"style":280},[1892],{"type":157,"value":1361},{"type":148,"tag":267,"props":1894,"children":1895},{"style":274},[1896],{"type":157,"value":1297},{"type":148,"tag":257,"props":1898,"children":1900},{"className":1635,"code":1899,"filename":1637,"language":1638,"meta":136,"style":136},"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",[1901],{"type":148,"tag":153,"props":1902,"children":1903},{"__ignoreMap":136},[1904,1927,1942,1958,1974,1990,2018,2047,2069,2089,2097,2105,2112,2119],{"type":148,"tag":267,"props":1905,"children":1906},{"class":269,"line":270},[1907,1911,1915,1919,1923],{"type":148,"tag":267,"props":1908,"children":1909},{"style":1648},[1910],{"type":157,"value":1651},{"type":148,"tag":267,"props":1912,"children":1913},{"style":1648},[1914],{"type":157,"value":1656},{"type":148,"tag":267,"props":1916,"children":1917},{"style":1318},[1918],{"type":157,"value":1661},{"type":148,"tag":267,"props":1920,"children":1921},{"style":1308},[1922],{"type":157,"value":1666},{"type":148,"tag":267,"props":1924,"children":1925},{"style":274},[1926],{"type":157,"value":1671},{"type":148,"tag":267,"props":1928,"children":1929},{"class":269,"line":656},[1930,1934,1938],{"type":148,"tag":267,"props":1931,"children":1932},{"style":280},[1933],{"type":157,"value":1679},{"type":148,"tag":267,"props":1935,"children":1936},{"style":274},[1937],{"type":157,"value":1684},{"type":148,"tag":267,"props":1939,"children":1940},{"style":274},[1941],{"type":157,"value":1689},{"type":148,"tag":267,"props":1943,"children":1944},{"class":269,"line":683},[1945,1950,1954],{"type":148,"tag":267,"props":1946,"children":1947},{"style":280},[1948],{"type":157,"value":1949},"    presets",{"type":148,"tag":267,"props":1951,"children":1952},{"style":274},[1953],{"type":157,"value":1684},{"type":148,"tag":267,"props":1955,"children":1956},{"style":274},[1957],{"type":157,"value":1689},{"type":148,"tag":267,"props":1959,"children":1960},{"class":269,"line":709},[1961,1966,1970],{"type":148,"tag":267,"props":1962,"children":1963},{"style":280},[1964],{"type":157,"value":1965},"      cover",{"type":148,"tag":267,"props":1967,"children":1968},{"style":274},[1969],{"type":157,"value":1684},{"type":148,"tag":267,"props":1971,"children":1972},{"style":274},[1973],{"type":157,"value":1689},{"type":148,"tag":267,"props":1975,"children":1976},{"class":269,"line":829},[1977,1982,1986],{"type":148,"tag":267,"props":1978,"children":1979},{"style":280},[1980],{"type":157,"value":1981},"        modifiers",{"type":148,"tag":267,"props":1983,"children":1984},{"style":274},[1985],{"type":157,"value":1684},{"type":148,"tag":267,"props":1987,"children":1988},{"style":274},[1989],{"type":157,"value":1689},{"type":148,"tag":267,"props":1991,"children":1992},{"class":269,"line":837},[1993,1998,2002,2006,2010,2014],{"type":148,"tag":267,"props":1994,"children":1995},{"style":280},[1996],{"type":157,"value":1997},"          fit",{"type":148,"tag":267,"props":1999,"children":2000},{"style":274},[2001],{"type":157,"value":1684},{"type":148,"tag":267,"props":2003,"children":2004},{"style":274},[2005],{"type":157,"value":1722},{"type":148,"tag":267,"props":2007,"children":2008},{"style":302},[2009],{"type":157,"value":1853},{"type":148,"tag":267,"props":2011,"children":2012},{"style":274},[2013],{"type":157,"value":1732},{"type":148,"tag":267,"props":2015,"children":2016},{"style":274},[2017],{"type":157,"value":1737},{"type":148,"tag":267,"props":2019,"children":2020},{"class":269,"line":847},[2021,2026,2030,2034,2039,2043],{"type":148,"tag":267,"props":2022,"children":2023},{"style":280},[2024],{"type":157,"value":2025},"          format",{"type":148,"tag":267,"props":2027,"children":2028},{"style":274},[2029],{"type":157,"value":1684},{"type":148,"tag":267,"props":2031,"children":2032},{"style":274},[2033],{"type":157,"value":1722},{"type":148,"tag":267,"props":2035,"children":2036},{"style":302},[2037],{"type":157,"value":2038},"jpg",{"type":148,"tag":267,"props":2040,"children":2041},{"style":274},[2042],{"type":157,"value":1732},{"type":148,"tag":267,"props":2044,"children":2045},{"style":274},[2046],{"type":157,"value":1737},{"type":148,"tag":267,"props":2048,"children":2049},{"class":269,"line":856},[2050,2055,2059,2065],{"type":148,"tag":267,"props":2051,"children":2052},{"style":280},[2053],{"type":157,"value":2054},"          width",{"type":148,"tag":267,"props":2056,"children":2057},{"style":274},[2058],{"type":157,"value":1684},{"type":148,"tag":267,"props":2060,"children":2062},{"style":2061},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[2063],{"type":157,"value":2064}," 300",{"type":148,"tag":267,"props":2066,"children":2067},{"style":274},[2068],{"type":157,"value":1737},{"type":148,"tag":267,"props":2070,"children":2071},{"class":269,"line":865},[2072,2077,2081,2085],{"type":148,"tag":267,"props":2073,"children":2074},{"style":280},[2075],{"type":157,"value":2076},"          height",{"type":148,"tag":267,"props":2078,"children":2079},{"style":274},[2080],{"type":157,"value":1684},{"type":148,"tag":267,"props":2082,"children":2083},{"style":2061},[2084],{"type":157,"value":2064},{"type":148,"tag":267,"props":2086,"children":2087},{"style":274},[2088],{"type":157,"value":1737},{"type":148,"tag":267,"props":2090,"children":2091},{"class":269,"line":874},[2092],{"type":148,"tag":267,"props":2093,"children":2094},{"style":274},[2095],{"type":157,"value":2096},"        },\n",{"type":148,"tag":267,"props":2098,"children":2099},{"class":269,"line":882},[2100],{"type":148,"tag":267,"props":2101,"children":2102},{"style":274},[2103],{"type":157,"value":2104},"      },\n",{"type":148,"tag":267,"props":2106,"children":2107},{"class":269,"line":1181},[2108],{"type":148,"tag":267,"props":2109,"children":2110},{"style":274},[2111],{"type":157,"value":1745},{"type":148,"tag":267,"props":2113,"children":2114},{"class":269,"line":1189},[2115],{"type":148,"tag":267,"props":2116,"children":2117},{"style":274},[2118],{"type":157,"value":1753},{"type":148,"tag":267,"props":2120,"children":2121},{"class":269,"line":1198},[2122,2126],{"type":148,"tag":267,"props":2123,"children":2124},{"style":274},[2125],{"type":157,"value":1761},{"type":148,"tag":267,"props":2127,"children":2128},{"style":1308},[2129],{"type":157,"value":1766},{"type":148,"tag":399,"props":2131,"children":2133},{"id":2132},"format",[2134],{"type":148,"tag":153,"props":2135,"children":2136},{"className":136},[2137],{"type":157,"value":2132},{"type":148,"tag":149,"props":2139,"children":2140},{},[2141],{"type":157,"value":2142},"In case you want to serve images in a specific format, use this prop.",{"type":148,"tag":257,"props":2144,"children":2146},{"className":259,"code":2145,"language":261,"meta":136,"style":136},"\u003CNuxtImg format=\"webp\" src=\"/nuxt-icon.png\" ... />\n",[2147],{"type":148,"tag":153,"props":2148,"children":2149},{"__ignoreMap":136},[2150],{"type":148,"tag":267,"props":2151,"children":2152},{"class":269,"line":270},[2153,2157,2161,2166,2170,2174,2179,2183,2187,2191,2195,2199,2203,2208],{"type":148,"tag":267,"props":2154,"children":2155},{"style":274},[2156],{"type":157,"value":277},{"type":148,"tag":267,"props":2158,"children":2159},{"style":280},[2160],{"type":157,"value":283},{"type":148,"tag":267,"props":2162,"children":2163},{"style":286},[2164],{"type":157,"value":2165}," format",{"type":148,"tag":267,"props":2167,"children":2168},{"style":274},[2169],{"type":157,"value":294},{"type":148,"tag":267,"props":2171,"children":2172},{"style":274},[2173],{"type":157,"value":299},{"type":148,"tag":267,"props":2175,"children":2176},{"style":302},[2177],{"type":157,"value":2178},"webp",{"type":148,"tag":267,"props":2180,"children":2181},{"style":274},[2182],{"type":157,"value":299},{"type":148,"tag":267,"props":2184,"children":2185},{"style":286},[2186],{"type":157,"value":289},{"type":148,"tag":267,"props":2188,"children":2189},{"style":274},[2190],{"type":157,"value":294},{"type":148,"tag":267,"props":2192,"children":2193},{"style":274},[2194],{"type":157,"value":299},{"type":148,"tag":267,"props":2196,"children":2197},{"style":302},[2198],{"type":157,"value":305},{"type":148,"tag":267,"props":2200,"children":2201},{"style":274},[2202],{"type":157,"value":299},{"type":148,"tag":267,"props":2204,"children":2205},{"style":286},[2206],{"type":157,"value":2207}," ...",{"type":148,"tag":267,"props":2209,"children":2210},{"style":274},[2211],{"type":157,"value":314},{"type":148,"tag":149,"props":2213,"children":2214},{},[2215,2217,2221,2223,2228,2229,2234,2235,2239,2240,2245,2246,2251,2252,2257],{"type":157,"value":2216},"Available formats are ",{"type":148,"tag":153,"props":2218,"children":2219},{"className":136},[2220],{"type":157,"value":2178},{"type":157,"value":2222},", ",{"type":148,"tag":153,"props":2224,"children":2225},{"className":136},[2226],{"type":157,"value":2227},"avif",{"type":157,"value":2222},{"type":148,"tag":153,"props":2230,"children":2231},{"className":136},[2232],{"type":157,"value":2233},"jpeg",{"type":157,"value":2222},{"type":148,"tag":153,"props":2236,"children":2237},{"className":136},[2238],{"type":157,"value":2038},{"type":157,"value":2222},{"type":148,"tag":153,"props":2241,"children":2242},{"className":136},[2243],{"type":157,"value":2244},"png",{"type":157,"value":2222},{"type":148,"tag":153,"props":2247,"children":2248},{"className":136},[2249],{"type":157,"value":2250},"gif",{"type":157,"value":200},{"type":148,"tag":153,"props":2253,"children":2254},{"className":136},[2255],{"type":157,"value":2256},"svg",{"type":157,"value":2258},". If the format is not specified, it will respect the default image format.",{"type":148,"tag":399,"props":2260,"children":2262},{"id":2261},"quality",[2263],{"type":148,"tag":153,"props":2264,"children":2265},{"className":136},[2266],{"type":157,"value":2261},{"type":148,"tag":149,"props":2268,"children":2269},{},[2270],{"type":157,"value":2271},"The quality for the generated image(s).",{"type":148,"tag":257,"props":2273,"children":2275},{"className":259,"code":2274,"language":261,"meta":136,"style":136},"\u003CNuxtImg src=\"/nuxt.jpg\" quality=\"80\" width=\"200\" height=\"100\" />\n",[2276],{"type":148,"tag":153,"props":2277,"children":2278},{"__ignoreMap":136},[2279],{"type":148,"tag":267,"props":2280,"children":2281},{"class":269,"line":270},[2282,2286,2290,2294,2298,2302,2307,2311,2316,2320,2324,2329,2333,2338,2342,2346,2351,2355,2360,2364,2368,2373,2377],{"type":148,"tag":267,"props":2283,"children":2284},{"style":274},[2285],{"type":157,"value":277},{"type":148,"tag":267,"props":2287,"children":2288},{"style":280},[2289],{"type":157,"value":283},{"type":148,"tag":267,"props":2291,"children":2292},{"style":286},[2293],{"type":157,"value":289},{"type":148,"tag":267,"props":2295,"children":2296},{"style":274},[2297],{"type":157,"value":294},{"type":148,"tag":267,"props":2299,"children":2300},{"style":274},[2301],{"type":157,"value":299},{"type":148,"tag":267,"props":2303,"children":2304},{"style":302},[2305],{"type":157,"value":2306},"/nuxt.jpg",{"type":148,"tag":267,"props":2308,"children":2309},{"style":274},[2310],{"type":157,"value":299},{"type":148,"tag":267,"props":2312,"children":2313},{"style":286},[2314],{"type":157,"value":2315}," quality",{"type":148,"tag":267,"props":2317,"children":2318},{"style":274},[2319],{"type":157,"value":294},{"type":148,"tag":267,"props":2321,"children":2322},{"style":274},[2323],{"type":157,"value":299},{"type":148,"tag":267,"props":2325,"children":2326},{"style":302},[2327],{"type":157,"value":2328},"80",{"type":148,"tag":267,"props":2330,"children":2331},{"style":274},[2332],{"type":157,"value":299},{"type":148,"tag":267,"props":2334,"children":2335},{"style":286},[2336],{"type":157,"value":2337}," width",{"type":148,"tag":267,"props":2339,"children":2340},{"style":274},[2341],{"type":157,"value":294},{"type":148,"tag":267,"props":2343,"children":2344},{"style":274},[2345],{"type":157,"value":299},{"type":148,"tag":267,"props":2347,"children":2348},{"style":302},[2349],{"type":157,"value":2350},"200",{"type":148,"tag":267,"props":2352,"children":2353},{"style":274},[2354],{"type":157,"value":299},{"type":148,"tag":267,"props":2356,"children":2357},{"style":286},[2358],{"type":157,"value":2359}," height",{"type":148,"tag":267,"props":2361,"children":2362},{"style":274},[2363],{"type":157,"value":294},{"type":148,"tag":267,"props":2365,"children":2366},{"style":274},[2367],{"type":157,"value":299},{"type":148,"tag":267,"props":2369,"children":2370},{"style":302},[2371],{"type":157,"value":2372},"100",{"type":148,"tag":267,"props":2374,"children":2375},{"style":274},[2376],{"type":157,"value":299},{"type":148,"tag":267,"props":2378,"children":2379},{"style":274},[2380],{"type":157,"value":314},{"type":148,"tag":399,"props":2382,"children":2384},{"id":2383},"fit",[2385],{"type":148,"tag":153,"props":2386,"children":2387},{"className":136},[2388],{"type":157,"value":2383},{"type":148,"tag":149,"props":2390,"children":2391},{},[2392,2394,2398],{"type":157,"value":2393},"The ",{"type":148,"tag":153,"props":2395,"children":2396},{"className":136},[2397],{"type":157,"value":2383},{"type":157,"value":2399}," property specifies the size of the images.\nThere are five standard values you can use with this property.",{"type":148,"tag":168,"props":2401,"children":2402},{},[2403,2412,2422,2432,2442],{"type":148,"tag":172,"props":2404,"children":2405},{},[2406,2410],{"type":148,"tag":153,"props":2407,"children":2408},{"className":136},[2409],{"type":157,"value":1853},{"type":157,"value":2411},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping/clipping to fit",{"type":148,"tag":172,"props":2413,"children":2414},{},[2415,2420],{"type":148,"tag":153,"props":2416,"children":2417},{"className":136},[2418],{"type":157,"value":2419},"contain",{"type":157,"value":2421},": Preserving aspect ratio, contain within both provided dimensions using \"letterboxing\" where necessary.",{"type":148,"tag":172,"props":2423,"children":2424},{},[2425,2430],{"type":148,"tag":153,"props":2426,"children":2427},{"className":136},[2428],{"type":157,"value":2429},"fill",{"type":157,"value":2431},": Ignore the aspect ratio of the input and stretch to both provided dimensions.",{"type":148,"tag":172,"props":2433,"children":2434},{},[2435,2440],{"type":148,"tag":153,"props":2436,"children":2437},{"className":136},[2438],{"type":157,"value":2439},"inside",{"type":157,"value":2441},": 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":148,"tag":172,"props":2443,"children":2444},{},[2445,2450],{"type":148,"tag":153,"props":2446,"children":2447},{"className":136},[2448],{"type":157,"value":2449},"outside",{"type":157,"value":2451},": 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":148,"tag":257,"props":2453,"children":2455},{"className":259,"code":2454,"language":261,"meta":136,"style":136},"\u003CNuxtImg fit=\"cover\" src=\"/nuxt-icon.png\" width=\"200\" height=\"100\" />\n",[2456],{"type":148,"tag":153,"props":2457,"children":2458},{"__ignoreMap":136},[2459],{"type":148,"tag":267,"props":2460,"children":2461},{"class":269,"line":270},[2462,2466,2470,2475,2479,2483,2487,2491,2495,2499,2503,2507,2511,2515,2519,2523,2527,2531,2535,2539,2543,2547,2551],{"type":148,"tag":267,"props":2463,"children":2464},{"style":274},[2465],{"type":157,"value":277},{"type":148,"tag":267,"props":2467,"children":2468},{"style":280},[2469],{"type":157,"value":283},{"type":148,"tag":267,"props":2471,"children":2472},{"style":286},[2473],{"type":157,"value":2474}," fit",{"type":148,"tag":267,"props":2476,"children":2477},{"style":274},[2478],{"type":157,"value":294},{"type":148,"tag":267,"props":2480,"children":2481},{"style":274},[2482],{"type":157,"value":299},{"type":148,"tag":267,"props":2484,"children":2485},{"style":302},[2486],{"type":157,"value":1853},{"type":148,"tag":267,"props":2488,"children":2489},{"style":274},[2490],{"type":157,"value":299},{"type":148,"tag":267,"props":2492,"children":2493},{"style":286},[2494],{"type":157,"value":289},{"type":148,"tag":267,"props":2496,"children":2497},{"style":274},[2498],{"type":157,"value":294},{"type":148,"tag":267,"props":2500,"children":2501},{"style":274},[2502],{"type":157,"value":299},{"type":148,"tag":267,"props":2504,"children":2505},{"style":302},[2506],{"type":157,"value":305},{"type":148,"tag":267,"props":2508,"children":2509},{"style":274},[2510],{"type":157,"value":299},{"type":148,"tag":267,"props":2512,"children":2513},{"style":286},[2514],{"type":157,"value":2337},{"type":148,"tag":267,"props":2516,"children":2517},{"style":274},[2518],{"type":157,"value":294},{"type":148,"tag":267,"props":2520,"children":2521},{"style":274},[2522],{"type":157,"value":299},{"type":148,"tag":267,"props":2524,"children":2525},{"style":302},[2526],{"type":157,"value":2350},{"type":148,"tag":267,"props":2528,"children":2529},{"style":274},[2530],{"type":157,"value":299},{"type":148,"tag":267,"props":2532,"children":2533},{"style":286},[2534],{"type":157,"value":2359},{"type":148,"tag":267,"props":2536,"children":2537},{"style":274},[2538],{"type":157,"value":294},{"type":148,"tag":267,"props":2540,"children":2541},{"style":274},[2542],{"type":157,"value":299},{"type":148,"tag":267,"props":2544,"children":2545},{"style":302},[2546],{"type":157,"value":2372},{"type":148,"tag":267,"props":2548,"children":2549},{"style":274},[2550],{"type":157,"value":299},{"type":148,"tag":267,"props":2552,"children":2553},{"style":274},[2554],{"type":157,"value":314},{"type":148,"tag":363,"props":2556,"children":2557},{},[2558],{"type":148,"tag":149,"props":2559,"children":2560},{},[2561],{"type":157,"value":2562},"Some providers support other values.",{"type":148,"tag":399,"props":2564,"children":2566},{"id":2565},"modifiers",[2567],{"type":148,"tag":153,"props":2568,"children":2569},{"className":136},[2570],{"type":157,"value":2565},{"type":148,"tag":149,"props":2572,"children":2573},{},[2574],{"type":157,"value":2575},"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":148,"tag":149,"props":2577,"children":2578},{},[2579,2581,2585],{"type":157,"value":2580},"Using the ",{"type":148,"tag":153,"props":2582,"children":2583},{"className":136},[2584],{"type":157,"value":2565},{"type":157,"value":2586}," prop lets you use any of these transformations.",{"type":148,"tag":149,"props":2588,"children":2589},{},[2590],{"type":148,"tag":630,"props":2591,"children":2592},{},[2593],{"type":157,"value":634},{"type":148,"tag":257,"props":2595,"children":2597},{"className":259,"code":2596,"language":261,"meta":136,"style":136},"\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",[2598],{"type":148,"tag":153,"props":2599,"children":2600},{"__ignoreMap":136},[2601,2612,2636,2659,2683,2706,2731],{"type":148,"tag":267,"props":2602,"children":2603},{"class":269,"line":270},[2604,2608],{"type":148,"tag":267,"props":2605,"children":2606},{"style":274},[2607],{"type":157,"value":277},{"type":148,"tag":267,"props":2609,"children":2610},{"style":280},[2611],{"type":157,"value":653},{"type":148,"tag":267,"props":2613,"children":2614},{"class":269,"line":656},[2615,2620,2624,2628,2632],{"type":148,"tag":267,"props":2616,"children":2617},{"style":286},[2618],{"type":157,"value":2619},"  provider",{"type":148,"tag":267,"props":2621,"children":2622},{"style":274},[2623],{"type":157,"value":294},{"type":148,"tag":267,"props":2625,"children":2626},{"style":274},[2627],{"type":157,"value":299},{"type":148,"tag":267,"props":2629,"children":2630},{"style":302},[2631],{"type":157,"value":1530},{"type":148,"tag":267,"props":2633,"children":2634},{"style":274},[2635],{"type":157,"value":680},{"type":148,"tag":267,"props":2637,"children":2638},{"class":269,"line":683},[2639,2643,2647,2651,2655],{"type":148,"tag":267,"props":2640,"children":2641},{"style":286},[2642],{"type":157,"value":662},{"type":148,"tag":267,"props":2644,"children":2645},{"style":274},[2646],{"type":157,"value":294},{"type":148,"tag":267,"props":2648,"children":2649},{"style":274},[2650],{"type":157,"value":299},{"type":148,"tag":267,"props":2652,"children":2653},{"style":302},[2654],{"type":157,"value":1555},{"type":148,"tag":267,"props":2656,"children":2657},{"style":274},[2658],{"type":157,"value":680},{"type":148,"tag":267,"props":2660,"children":2661},{"class":269,"line":709},[2662,2667,2671,2675,2679],{"type":148,"tag":267,"props":2663,"children":2664},{"style":286},[2665],{"type":157,"value":2666},"  width",{"type":148,"tag":267,"props":2668,"children":2669},{"style":274},[2670],{"type":157,"value":294},{"type":148,"tag":267,"props":2672,"children":2673},{"style":274},[2674],{"type":157,"value":299},{"type":148,"tag":267,"props":2676,"children":2677},{"style":302},[2678],{"type":157,"value":1580},{"type":148,"tag":267,"props":2680,"children":2681},{"style":274},[2682],{"type":157,"value":680},{"type":148,"tag":267,"props":2684,"children":2685},{"class":269,"line":829},[2686,2690,2694,2698,2702],{"type":148,"tag":267,"props":2687,"children":2688},{"style":286},[2689],{"type":157,"value":784},{"type":148,"tag":267,"props":2691,"children":2692},{"style":274},[2693],{"type":157,"value":294},{"type":148,"tag":267,"props":2695,"children":2696},{"style":274},[2697],{"type":157,"value":299},{"type":148,"tag":267,"props":2699,"children":2700},{"style":302},[2701],{"type":157,"value":1605},{"type":148,"tag":267,"props":2703,"children":2704},{"style":274},[2705],{"type":157,"value":680},{"type":148,"tag":267,"props":2707,"children":2708},{"class":269,"line":837},[2709,2714,2718,2722,2727],{"type":148,"tag":267,"props":2710,"children":2711},{"style":286},[2712],{"type":157,"value":2713},"  :modifiers",{"type":148,"tag":267,"props":2715,"children":2716},{"style":274},[2717],{"type":157,"value":294},{"type":148,"tag":267,"props":2719,"children":2720},{"style":274},[2721],{"type":157,"value":299},{"type":148,"tag":267,"props":2723,"children":2724},{"style":302},[2725],{"type":157,"value":2726},"{ roundCorner: '0:100' }",{"type":148,"tag":267,"props":2728,"children":2729},{"style":274},[2730],{"type":157,"value":680},{"type":148,"tag":267,"props":2732,"children":2733},{"class":269,"line":847},[2734],{"type":148,"tag":267,"props":2735,"children":2736},{"style":274},[2737],{"type":157,"value":715},{"type":148,"tag":399,"props":2739,"children":2741},{"id":2740},"preload",[2742],{"type":148,"tag":153,"props":2743,"children":2744},{"className":136},[2745],{"type":157,"value":2740},{"type":148,"tag":149,"props":2747,"children":2748},{},[2749,2751,2756],{"type":157,"value":2750},"In case you want to preload the image, use this prop. This will place a corresponding ",{"type":148,"tag":153,"props":2752,"children":2753},{"className":136},[2754],{"type":157,"value":2755},"link",{"type":157,"value":2757}," tag in the page's head.",{"type":148,"tag":257,"props":2759,"children":2761},{"className":259,"code":2760,"language":261,"meta":136,"style":136},"\u003CNuxtImg preload src=\"/nuxt-icon.png\" />\n",[2762],{"type":148,"tag":153,"props":2763,"children":2764},{"__ignoreMap":136},[2765],{"type":148,"tag":267,"props":2766,"children":2767},{"class":269,"line":270},[2768,2772,2776,2781,2785,2789,2793,2797,2801],{"type":148,"tag":267,"props":2769,"children":2770},{"style":274},[2771],{"type":157,"value":277},{"type":148,"tag":267,"props":2773,"children":2774},{"style":280},[2775],{"type":157,"value":283},{"type":148,"tag":267,"props":2777,"children":2778},{"style":286},[2779],{"type":157,"value":2780}," preload",{"type":148,"tag":267,"props":2782,"children":2783},{"style":286},[2784],{"type":157,"value":289},{"type":148,"tag":267,"props":2786,"children":2787},{"style":274},[2788],{"type":157,"value":294},{"type":148,"tag":267,"props":2790,"children":2791},{"style":274},[2792],{"type":157,"value":299},{"type":148,"tag":267,"props":2794,"children":2795},{"style":302},[2796],{"type":157,"value":305},{"type":148,"tag":267,"props":2798,"children":2799},{"style":274},[2800],{"type":157,"value":299},{"type":148,"tag":267,"props":2802,"children":2803},{"style":274},[2804],{"type":157,"value":314},{"type":148,"tag":399,"props":2806,"children":2808},{"id":2807},"loading",[2809],{"type":148,"tag":153,"props":2810,"children":2811},{"className":136},[2812],{"type":157,"value":2807},{"type":148,"tag":149,"props":2814,"children":2815},{},[2816,2818,2826,2828,2835],{"type":157,"value":2817},"This is a ",{"type":148,"tag":372,"props":2819,"children":2823},{"href":2820,"rel":2821},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading",[2822],"nofollow",[2824],{"type":157,"value":2825},"native",{"type":157,"value":2827}," 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":148,"tag":372,"props":2829,"children":2832},{"href":2830,"rel":2831},"https://caniuse.com/loading-lazy-attr",[2822],[2833],{"type":157,"value":2834},"supported",{"type":157,"value":2836}," by the latest version of all major browsers since March 2022.",{"type":148,"tag":149,"props":2838,"children":2839},{},[2840,2842,2847],{"type":157,"value":2841},"Set ",{"type":148,"tag":153,"props":2843,"children":2844},{"className":136},[2845],{"type":157,"value":2846},"loading=\"lazy\"",{"type":157,"value":2848}," to defer loading of an image until it appears in the viewport.",{"type":148,"tag":257,"props":2850,"children":2852},{"className":259,"code":2851,"language":261,"meta":136,"style":136},"\u003CNuxtImg src=\"/nuxt-icon.png\" loading=\"lazy\" />\n",[2853],{"type":148,"tag":153,"props":2854,"children":2855},{"__ignoreMap":136},[2856],{"type":148,"tag":267,"props":2857,"children":2858},{"class":269,"line":270},[2859,2863,2867,2871,2875,2879,2883,2887,2892,2896,2900,2905,2909],{"type":148,"tag":267,"props":2860,"children":2861},{"style":274},[2862],{"type":157,"value":277},{"type":148,"tag":267,"props":2864,"children":2865},{"style":280},[2866],{"type":157,"value":283},{"type":148,"tag":267,"props":2868,"children":2869},{"style":286},[2870],{"type":157,"value":289},{"type":148,"tag":267,"props":2872,"children":2873},{"style":274},[2874],{"type":157,"value":294},{"type":148,"tag":267,"props":2876,"children":2877},{"style":274},[2878],{"type":157,"value":299},{"type":148,"tag":267,"props":2880,"children":2881},{"style":302},[2882],{"type":157,"value":305},{"type":148,"tag":267,"props":2884,"children":2885},{"style":274},[2886],{"type":157,"value":299},{"type":148,"tag":267,"props":2888,"children":2889},{"style":286},[2890],{"type":157,"value":2891}," loading",{"type":148,"tag":267,"props":2893,"children":2894},{"style":274},[2895],{"type":157,"value":294},{"type":148,"tag":267,"props":2897,"children":2898},{"style":274},[2899],{"type":157,"value":299},{"type":148,"tag":267,"props":2901,"children":2902},{"style":302},[2903],{"type":157,"value":2904},"lazy",{"type":148,"tag":267,"props":2906,"children":2907},{"style":274},[2908],{"type":157,"value":299},{"type":148,"tag":267,"props":2910,"children":2911},{"style":274},[2912],{"type":157,"value":314},{"type":148,"tag":399,"props":2914,"children":2916},{"id":2915},"nonce",[2917],{"type":148,"tag":153,"props":2918,"children":2919},{"className":136},[2920],{"type":157,"value":2915},{"type":148,"tag":149,"props":2922,"children":2923},{},[2924,2925,2931,2933,2938,2940,2945],{"type":157,"value":2817},{"type":148,"tag":372,"props":2926,"children":2929},{"href":2927,"rel":2928},"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce",[2822],[2930],{"type":157,"value":2825},{"type":157,"value":2932}," 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":148,"tag":153,"props":2934,"children":2935},{"className":136},[2936],{"type":157,"value":2937},"unsafe-inline",{"type":157,"value":2939}," directive, which would allowlist ",{"type":148,"tag":571,"props":2941,"children":2942},{},[2943],{"type":157,"value":2944},"all",{"type":157,"value":2946}," inline script or styles.",{"type":148,"tag":257,"props":2948,"children":2950},{"className":259,"code":2949,"language":261,"meta":136,"style":136},"\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",[2951],{"type":148,"tag":153,"props":2952,"children":2953},{"__ignoreMap":136},[2954,3010,3017,3057,3065,3073,3098],{"type":148,"tag":267,"props":2955,"children":2956},{"class":269,"line":270},[2957,2961,2965,2969,2973,2977,2981,2985,2990,2994,2998,3002,3006],{"type":148,"tag":267,"props":2958,"children":2959},{"style":274},[2960],{"type":157,"value":277},{"type":148,"tag":267,"props":2962,"children":2963},{"style":280},[2964],{"type":157,"value":283},{"type":148,"tag":267,"props":2966,"children":2967},{"style":286},[2968],{"type":157,"value":289},{"type":148,"tag":267,"props":2970,"children":2971},{"style":274},[2972],{"type":157,"value":294},{"type":148,"tag":267,"props":2974,"children":2975},{"style":274},[2976],{"type":157,"value":299},{"type":148,"tag":267,"props":2978,"children":2979},{"style":302},[2980],{"type":157,"value":305},{"type":148,"tag":267,"props":2982,"children":2983},{"style":274},[2984],{"type":157,"value":299},{"type":148,"tag":267,"props":2986,"children":2987},{"style":286},[2988],{"type":157,"value":2989}," :nonce",{"type":148,"tag":267,"props":2991,"children":2992},{"style":274},[2993],{"type":157,"value":294},{"type":148,"tag":267,"props":2995,"children":2996},{"style":274},[2997],{"type":157,"value":299},{"type":148,"tag":267,"props":2999,"children":3000},{"style":302},[3001],{"type":157,"value":2915},{"type":148,"tag":267,"props":3003,"children":3004},{"style":274},[3005],{"type":157,"value":299},{"type":148,"tag":267,"props":3007,"children":3008},{"style":274},[3009],{"type":157,"value":314},{"type":148,"tag":267,"props":3011,"children":3012},{"class":269,"line":656},[3013],{"type":148,"tag":267,"props":3014,"children":3015},{"emptyLinePlaceholder":968},[3016],{"type":157,"value":971},{"type":148,"tag":267,"props":3018,"children":3019},{"class":269,"line":683},[3020,3024,3028,3033,3037,3041,3045,3049,3053],{"type":148,"tag":267,"props":3021,"children":3022},{"style":274},[3023],{"type":157,"value":277},{"type":148,"tag":267,"props":3025,"children":3026},{"style":280},[3027],{"type":157,"value":1287},{"type":148,"tag":267,"props":3029,"children":3030},{"style":286},[3031],{"type":157,"value":3032}," lang",{"type":148,"tag":267,"props":3034,"children":3035},{"style":274},[3036],{"type":157,"value":294},{"type":148,"tag":267,"props":3038,"children":3039},{"style":274},[3040],{"type":157,"value":299},{"type":148,"tag":267,"props":3042,"children":3043},{"style":302},[3044],{"type":157,"value":1638},{"type":148,"tag":267,"props":3046,"children":3047},{"style":274},[3048],{"type":157,"value":299},{"type":148,"tag":267,"props":3050,"children":3051},{"style":286},[3052],{"type":157,"value":1292},{"type":148,"tag":267,"props":3054,"children":3055},{"style":274},[3056],{"type":157,"value":1297},{"type":148,"tag":267,"props":3058,"children":3059},{"class":269,"line":709},[3060],{"type":148,"tag":267,"props":3061,"children":3062},{"style":841},[3063],{"type":157,"value":3064},"// useNonce is not provided by nuxt/image but might be\n",{"type":148,"tag":267,"props":3066,"children":3067},{"class":269,"line":829},[3068],{"type":148,"tag":267,"props":3069,"children":3070},{"style":841},[3071],{"type":157,"value":3072},"// provided by another module, for example nuxt-security\n",{"type":148,"tag":267,"props":3074,"children":3075},{"class":269,"line":837},[3076,3080,3085,3089,3094],{"type":148,"tag":267,"props":3077,"children":3078},{"style":286},[3079],{"type":157,"value":1305},{"type":148,"tag":267,"props":3081,"children":3082},{"style":1308},[3083],{"type":157,"value":3084}," nonce ",{"type":148,"tag":267,"props":3086,"children":3087},{"style":274},[3088],{"type":157,"value":294},{"type":148,"tag":267,"props":3090,"children":3091},{"style":1318},[3092],{"type":157,"value":3093}," useNonce",{"type":148,"tag":267,"props":3095,"children":3096},{"style":1308},[3097],{"type":157,"value":1326},{"type":148,"tag":267,"props":3099,"children":3100},{"class":269,"line":847},[3101,3105,3109],{"type":148,"tag":267,"props":3102,"children":3103},{"style":274},[3104],{"type":157,"value":1334},{"type":148,"tag":267,"props":3106,"children":3107},{"style":280},[3108],{"type":157,"value":1287},{"type":148,"tag":267,"props":3110,"children":3111},{"style":274},[3112],{"type":157,"value":1297},{"type":148,"tag":230,"props":3114,"children":3116},{"id":3115},"events",[3117],{"type":157,"value":3118},"Events",{"type":148,"tag":149,"props":3120,"children":3121},{},[3122,3124,3128,3130,3134,3135,3139],{"type":157,"value":3123},"Native events emitted by the ",{"type":148,"tag":153,"props":3125,"children":3126},{"className":136},[3127],{"type":157,"value":164},{"type":157,"value":3129}," element contained by ",{"type":148,"tag":153,"props":3131,"children":3132},{"className":136},[3133],{"type":157,"value":25},{"type":157,"value":200},{"type":148,"tag":153,"props":3136,"children":3137},{"className":136},[3138],{"type":157,"value":28},{"type":157,"value":3140}," components are re-emitted and can be listened to.",{"type":148,"tag":149,"props":3142,"children":3143},{},[3144,3148,3150,3155,3157],{"type":148,"tag":630,"props":3145,"children":3146},{},[3147],{"type":157,"value":634},{"type":157,"value":3149}," Listen to the native ",{"type":148,"tag":153,"props":3151,"children":3152},{"className":136},[3153],{"type":157,"value":3154},"onLoad",{"type":157,"value":3156}," event from ",{"type":148,"tag":153,"props":3158,"children":3159},{"className":136},[3160],{"type":157,"value":25},{"type":148,"tag":257,"props":3162,"children":3164},{"className":259,"code":3163,"language":261,"meta":136,"style":136},"\u003CNuxtImg\n  src=\"/images/colors.jpg\"\n  width=\"500\"\n  height=\"500\"\n  @load=\"doSomethingOnLoad\"\n/>\n",[3165],{"type":148,"tag":153,"props":3166,"children":3167},{"__ignoreMap":136},[3168,3179,3203,3227,3250,3275],{"type":148,"tag":267,"props":3169,"children":3170},{"class":269,"line":270},[3171,3175],{"type":148,"tag":267,"props":3172,"children":3173},{"style":274},[3174],{"type":157,"value":277},{"type":148,"tag":267,"props":3176,"children":3177},{"style":280},[3178],{"type":157,"value":653},{"type":148,"tag":267,"props":3180,"children":3181},{"class":269,"line":656},[3182,3186,3190,3194,3199],{"type":148,"tag":267,"props":3183,"children":3184},{"style":286},[3185],{"type":157,"value":662},{"type":148,"tag":267,"props":3187,"children":3188},{"style":274},[3189],{"type":157,"value":294},{"type":148,"tag":267,"props":3191,"children":3192},{"style":274},[3193],{"type":157,"value":299},{"type":148,"tag":267,"props":3195,"children":3196},{"style":302},[3197],{"type":157,"value":3198},"/images/colors.jpg",{"type":148,"tag":267,"props":3200,"children":3201},{"style":274},[3202],{"type":157,"value":680},{"type":148,"tag":267,"props":3204,"children":3205},{"class":269,"line":683},[3206,3210,3214,3218,3223],{"type":148,"tag":267,"props":3207,"children":3208},{"style":286},[3209],{"type":157,"value":2666},{"type":148,"tag":267,"props":3211,"children":3212},{"style":274},[3213],{"type":157,"value":294},{"type":148,"tag":267,"props":3215,"children":3216},{"style":274},[3217],{"type":157,"value":299},{"type":148,"tag":267,"props":3219,"children":3220},{"style":302},[3221],{"type":157,"value":3222},"500",{"type":148,"tag":267,"props":3224,"children":3225},{"style":274},[3226],{"type":157,"value":680},{"type":148,"tag":267,"props":3228,"children":3229},{"class":269,"line":709},[3230,3234,3238,3242,3246],{"type":148,"tag":267,"props":3231,"children":3232},{"style":286},[3233],{"type":157,"value":784},{"type":148,"tag":267,"props":3235,"children":3236},{"style":274},[3237],{"type":157,"value":294},{"type":148,"tag":267,"props":3239,"children":3240},{"style":274},[3241],{"type":157,"value":299},{"type":148,"tag":267,"props":3243,"children":3244},{"style":302},[3245],{"type":157,"value":3222},{"type":148,"tag":267,"props":3247,"children":3248},{"style":274},[3249],{"type":157,"value":680},{"type":148,"tag":267,"props":3251,"children":3252},{"class":269,"line":829},[3253,3258,3262,3266,3271],{"type":148,"tag":267,"props":3254,"children":3255},{"style":286},[3256],{"type":157,"value":3257},"  @load",{"type":148,"tag":267,"props":3259,"children":3260},{"style":274},[3261],{"type":157,"value":294},{"type":148,"tag":267,"props":3263,"children":3264},{"style":274},[3265],{"type":157,"value":299},{"type":148,"tag":267,"props":3267,"children":3268},{"style":302},[3269],{"type":157,"value":3270},"doSomethingOnLoad",{"type":148,"tag":267,"props":3272,"children":3273},{"style":274},[3274],{"type":157,"value":680},{"type":148,"tag":267,"props":3276,"children":3277},{"class":269,"line":837},[3278],{"type":148,"tag":267,"props":3279,"children":3280},{"style":274},[3281],{"type":157,"value":715},{"type":148,"tag":3283,"props":3284,"children":3285},"style",{},[3286],{"type":157,"value":3287},"html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":136,"searchDepth":656,"depth":656,"links":3289},[3290,3291,3308],{"id":134,"depth":656,"text":21},{"id":394,"depth":656,"text":397,"children":3292},[3293,3294,3296,3297,3298,3299,3300,3301,3302,3303,3304,3305,3306,3307],{"id":186,"depth":683,"text":186},{"id":500,"depth":683,"text":3295},"width / height",{"id":215,"depth":683,"text":215},{"id":718,"depth":683,"text":718},{"id":891,"depth":683,"text":891},{"id":1441,"depth":683,"text":1441},{"id":1769,"depth":683,"text":1769},{"id":2132,"depth":683,"text":2132},{"id":2261,"depth":683,"text":2261},{"id":2383,"depth":683,"text":2383},{"id":2565,"depth":683,"text":2565},{"id":2740,"depth":683,"text":2740},{"id":2807,"depth":683,"text":2807},{"id":2915,"depth":683,"text":2915},{"id":3115,"depth":656,"text":3118},"markdown","content:2.usage:1.nuxt-img.md","content","2.usage/1.nuxt-img.md",[3314,3530],{"_path":19,"_dir":3315,"_draft":135,"_partial":135,"_locale":136,"title":18,"description":3316,"body":3317,"_type":3309,"_id":3528,"_source":3311,"_file":3529,"_extension":623},"get-started","We can never thank you enough for your contributions. ❤️",{"type":145,"children":3318,"toc":3522},[3319,3336,3342,3391,3397,3469,3475],{"type":148,"tag":363,"props":3320,"children":3321},{},[3322],{"type":148,"tag":149,"props":3323,"children":3324},{},[3325,3327,3334],{"type":157,"value":3326},"It is highly recommended to read ",{"type":148,"tag":372,"props":3328,"children":3331},{"href":3329,"rel":3330},"https://nuxt.com/docs/community/contribution",[2822],[3332],{"type":157,"value":3333},"Nuxt contribution guide",{"type":157,"value":3335}," before making any contributions.",{"type":148,"tag":230,"props":3337,"children":3339},{"id":3338},"how-to-contribute",[3340],{"type":157,"value":3341},"How to contribute?",{"type":148,"tag":168,"props":3343,"children":3344},{},[3345,3359,3369,3379],{"type":148,"tag":172,"props":3346,"children":3347},{},[3348,3350,3357],{"type":157,"value":3349},"Clone ",{"type":148,"tag":372,"props":3351,"children":3354},{"href":3352,"rel":3353},"https://github.com/nuxt/image",[2822],[3355],{"type":157,"value":3356},"nuxt/image",{"type":157,"value":3358}," repository",{"type":148,"tag":172,"props":3360,"children":3361},{},[3362,3364],{"type":157,"value":3363},"Enable Corepack using ",{"type":148,"tag":153,"props":3365,"children":3366},{"className":136},[3367],{"type":157,"value":3368},"corepack enable",{"type":148,"tag":172,"props":3370,"children":3371},{},[3372,3374],{"type":157,"value":3373},"Install dependencies using ",{"type":148,"tag":153,"props":3375,"children":3376},{"className":136},[3377],{"type":157,"value":3378},"pnpm install",{"type":148,"tag":172,"props":3380,"children":3381},{},[3382,3384,3389],{"type":157,"value":3383},"Run ",{"type":148,"tag":153,"props":3385,"children":3386},{"className":136},[3387],{"type":157,"value":3388},"pnpm dev:prepare",{"type":157,"value":3390}," to generate type stubs.",{"type":148,"tag":399,"props":3392,"children":3394},{"id":3393},"nuxt-image",[3395],{"type":157,"value":3396},"Nuxt Image",{"type":148,"tag":168,"props":3398,"children":3399},{},[3400,3421,3426,3447,3457],{"type":148,"tag":172,"props":3401,"children":3402},{},[3403,3405,3410,3412,3419],{"type":157,"value":3404},"Use ",{"type":148,"tag":153,"props":3406,"children":3407},{"className":136},[3408],{"type":157,"value":3409},"pnpm dev",{"type":157,"value":3411}," to start the ",{"type":148,"tag":372,"props":3413,"children":3416},{"href":3414,"rel":3415},"https://github.com/nuxt/image/tree/main/playground",[2822],[3417],{"type":157,"value":3418},"playground",{"type":157,"value":3420}," in development mode.",{"type":148,"tag":172,"props":3422,"children":3423},{},[3424],{"type":157,"value":3425},"Apply your changes",{"type":148,"tag":172,"props":3427,"children":3428},{},[3429,3431,3438,3440,3445],{"type":157,"value":3430},"Add tests into the ",{"type":148,"tag":372,"props":3432,"children":3435},{"href":3433,"rel":3434},"https://github.com/nuxt/image/tree/main/test",[2822],[3436],{"type":157,"value":3437},"test/",{"type":157,"value":3439}," directory and run ",{"type":148,"tag":153,"props":3441,"children":3442},{"className":136},[3443],{"type":157,"value":3444},"pnpm test",{"type":157,"value":3446}," to make sure they pass.",{"type":148,"tag":172,"props":3448,"children":3449},{},[3450,3452],{"type":157,"value":3451},"Check the code style with ",{"type":148,"tag":153,"props":3453,"children":3454},{"className":136},[3455],{"type":157,"value":3456},"pnpm lint",{"type":148,"tag":172,"props":3458,"children":3459},{},[3460,3462,3467],{"type":157,"value":3461},"Before creating a PR, make sure to run ",{"type":148,"tag":153,"props":3463,"children":3464},{"className":136},[3465],{"type":157,"value":3466},"pnpm build",{"type":157,"value":3468}," and that no errors are reported.",{"type":148,"tag":399,"props":3470,"children":3472},{"id":3471},"documentation",[3473],{"type":157,"value":3474},"Documentation",{"type":148,"tag":168,"props":3476,"children":3477},{},[3478,3495,3508],{"type":148,"tag":172,"props":3479,"children":3480},{},[3481,3482,3487,3488,3494],{"type":157,"value":3404},{"type":148,"tag":153,"props":3483,"children":3484},{"className":136},[3485],{"type":157,"value":3486},"pnpm docs:dev",{"type":157,"value":3411},{"type":148,"tag":372,"props":3489,"children":3492},{"href":3490,"rel":3491},"https://github.com/nuxt/image/tree/main/docs",[2822],[3493],{"type":157,"value":3471},{"type":157,"value":3420},{"type":148,"tag":172,"props":3496,"children":3497},{},[3498,3500,3506],{"type":157,"value":3499},"Open ",{"type":148,"tag":372,"props":3501,"children":3504},{"href":3502,"rel":3503},"http://localhost:3000",[2822],[3505],{"type":157,"value":3502},{"type":157,"value":3507}," to view it in the browser.",{"type":148,"tag":172,"props":3509,"children":3510},{},[3511,3513,3520],{"type":157,"value":3512},"Update the content of the documentation in the ",{"type":148,"tag":372,"props":3514,"children":3517},{"href":3515,"rel":3516},"https://github.com/nuxt/image/tree/main/docs/content",[2822],[3518],{"type":157,"value":3519},"docs/content/",{"type":157,"value":3521}," directory.",{"title":136,"searchDepth":656,"depth":656,"links":3523},[3524],{"id":3338,"depth":656,"text":3341,"children":3525},[3526,3527],{"id":3393,"depth":683,"text":3396},{"id":3471,"depth":683,"text":3474},"content:1.get-started:4.contributing.md","1.get-started/4.contributing.md",{"_path":29,"_dir":134,"_draft":135,"_partial":135,"_locale":136,"title":28,"description":3531,"links":3532,"body":3535,"_type":3309,"_id":3895,"_source":3311,"_file":3896,"_extension":623},"Discover how to use and configure the Nuxt Picture component.",[3533],{"label":140,"icon":141,"to":3534,"size":143},"https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-picture.ts",{"type":145,"children":3536,"toc":3888},[3537,3551,3577,3595,3599,3615,3622,3627,3695,3729,3738,3743,3783,3792,3803,3810,3884],{"type":148,"tag":149,"props":3538,"children":3539},{},[3540,3544,3545,3550],{"type":148,"tag":153,"props":3541,"children":3542},{"className":136},[3543],{"type":157,"value":28},{"type":157,"value":159},{"type":148,"tag":153,"props":3546,"children":3547},{"className":136},[3548],{"type":157,"value":3549},"\u003Cpicture>",{"type":157,"value":166},{"type":148,"tag":149,"props":3552,"children":3553},{},[3554,3556,3560,3562,3569,3571,3575],{"type":157,"value":3555},"Usage of ",{"type":148,"tag":153,"props":3557,"children":3558},{"className":136},[3559],{"type":157,"value":28},{"type":157,"value":3561}," is almost identical to ",{"type":148,"tag":372,"props":3563,"children":3564},{"href":933},[3565],{"type":148,"tag":153,"props":3566,"children":3567},{"className":136},[3568],{"type":157,"value":25},{"type":157,"value":3570}," but also allows serving modern formats like ",{"type":148,"tag":153,"props":3572,"children":3573},{"className":136},[3574],{"type":157,"value":2178},{"type":157,"value":3576}," when possible.",{"type":148,"tag":149,"props":3578,"children":3579},{},[3580,3582,3593],{"type":157,"value":3581},"Learn more about the ",{"type":148,"tag":372,"props":3583,"children":3586},{"href":3584,"rel":3585},"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture",[2822],[3587,3591],{"type":148,"tag":153,"props":3588,"children":3589},{"className":136},[3590],{"type":157,"value":3549},{"type":157,"value":3592}," tag on MDN",{"type":157,"value":3594},".",{"type":148,"tag":230,"props":3596,"children":3597},{"id":394},[3598],{"type":157,"value":397},{"type":148,"tag":363,"props":3600,"children":3601},{},[3602],{"type":148,"tag":149,"props":3603,"children":3604},{},[3605,3607],{"type":157,"value":3606},"See props supported by",{"type":148,"tag":372,"props":3608,"children":3610},{"href":3609},"/usage/nuxt-img#props",[3611],{"type":148,"tag":153,"props":3612,"children":3613},{"className":136},[3614],{"type":157,"value":25},{"type":148,"tag":399,"props":3616,"children":3617},{"id":2132},[3618],{"type":148,"tag":153,"props":3619,"children":3620},{"className":136},[3621],{"type":157,"value":2132},{"type":148,"tag":149,"props":3623,"children":3624},{},[3625],{"type":157,"value":3626},"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":148,"tag":257,"props":3628,"children":3630},{"className":259,"code":3629,"language":261,"meta":136,"style":136},"\u003CNuxtPicture format=\"avif,webp\" src=\"/nuxt-icon.png\" ... />\n",[3631],{"type":148,"tag":153,"props":3632,"children":3633},{"__ignoreMap":136},[3634],{"type":148,"tag":267,"props":3635,"children":3636},{"class":269,"line":270},[3637,3641,3646,3650,3654,3658,3663,3667,3671,3675,3679,3683,3687,3691],{"type":148,"tag":267,"props":3638,"children":3639},{"style":274},[3640],{"type":157,"value":277},{"type":148,"tag":267,"props":3642,"children":3643},{"style":280},[3644],{"type":157,"value":3645},"NuxtPicture",{"type":148,"tag":267,"props":3647,"children":3648},{"style":286},[3649],{"type":157,"value":2165},{"type":148,"tag":267,"props":3651,"children":3652},{"style":274},[3653],{"type":157,"value":294},{"type":148,"tag":267,"props":3655,"children":3656},{"style":274},[3657],{"type":157,"value":299},{"type":148,"tag":267,"props":3659,"children":3660},{"style":302},[3661],{"type":157,"value":3662},"avif,webp",{"type":148,"tag":267,"props":3664,"children":3665},{"style":274},[3666],{"type":157,"value":299},{"type":148,"tag":267,"props":3668,"children":3669},{"style":286},[3670],{"type":157,"value":289},{"type":148,"tag":267,"props":3672,"children":3673},{"style":274},[3674],{"type":157,"value":294},{"type":148,"tag":267,"props":3676,"children":3677},{"style":274},[3678],{"type":157,"value":299},{"type":148,"tag":267,"props":3680,"children":3681},{"style":302},[3682],{"type":157,"value":305},{"type":148,"tag":267,"props":3684,"children":3685},{"style":274},[3686],{"type":157,"value":299},{"type":148,"tag":267,"props":3688,"children":3689},{"style":286},[3690],{"type":157,"value":2207},{"type":148,"tag":267,"props":3692,"children":3693},{"style":274},[3694],{"type":157,"value":314},{"type":148,"tag":149,"props":3696,"children":3697},{},[3698,3699,3703,3704,3708,3709,3713,3714,3718,3719,3723,3724,3728],{"type":157,"value":2216},{"type":148,"tag":153,"props":3700,"children":3701},{"className":136},[3702],{"type":157,"value":2178},{"type":157,"value":2222},{"type":148,"tag":153,"props":3705,"children":3706},{"className":136},[3707],{"type":157,"value":2227},{"type":157,"value":2222},{"type":148,"tag":153,"props":3710,"children":3711},{"className":136},[3712],{"type":157,"value":2233},{"type":157,"value":2222},{"type":148,"tag":153,"props":3715,"children":3716},{"className":136},[3717],{"type":157,"value":2038},{"type":157,"value":2222},{"type":148,"tag":153,"props":3720,"children":3721},{"className":136},[3722],{"type":157,"value":2244},{"type":157,"value":200},{"type":148,"tag":153,"props":3725,"children":3726},{"className":136},[3727],{"type":157,"value":2250},{"type":157,"value":2258},{"type":148,"tag":399,"props":3730,"children":3732},{"id":3731},"legacyformat",[3733],{"type":148,"tag":153,"props":3734,"children":3735},{"className":136},[3736],{"type":157,"value":3737},"legacyFormat",{"type":148,"tag":149,"props":3739,"children":3740},{},[3741],{"type":157,"value":3742},"Format used for fallback. Default is conditional:",{"type":148,"tag":168,"props":3744,"children":3745},{},[3746,3773],{"type":148,"tag":172,"props":3747,"children":3748},{},[3749,3751,3755,3756,3760,3761,3765,3767,3771],{"type":157,"value":3750},"If original format supports transparency (",{"type":148,"tag":153,"props":3752,"children":3753},{"className":136},[3754],{"type":157,"value":2244},{"type":157,"value":2222},{"type":148,"tag":153,"props":3757,"children":3758},{"className":136},[3759],{"type":157,"value":2178},{"type":157,"value":200},{"type":148,"tag":153,"props":3762,"children":3763},{"className":136},[3764],{"type":157,"value":2250},{"type":157,"value":3766},"), ",{"type":148,"tag":153,"props":3768,"children":3769},{"className":136},[3770],{"type":157,"value":2244},{"type":157,"value":3772}," is used for fallback",{"type":148,"tag":172,"props":3774,"children":3775},{},[3776,3778,3782],{"type":157,"value":3777},"Otherwise ",{"type":148,"tag":153,"props":3779,"children":3780},{"className":136},[3781],{"type":157,"value":2233},{"type":157,"value":3772},{"type":148,"tag":399,"props":3784,"children":3786},{"id":3785},"imgattrs",[3787],{"type":148,"tag":153,"props":3788,"children":3789},{"className":136},[3790],{"type":157,"value":3791},"imgAttrs",{"type":148,"tag":149,"props":3793,"children":3794},{},[3795,3797,3801],{"type":157,"value":3796},"Allows you to set additional HTML-attributes on the ",{"type":148,"tag":153,"props":3798,"children":3799},{"className":136},[3800],{"type":157,"value":247},{"type":157,"value":3802}," element.",{"type":148,"tag":149,"props":3804,"children":3805},{},[3806],{"type":148,"tag":630,"props":3807,"children":3808},{},[3809],{"type":157,"value":634},{"type":148,"tag":257,"props":3811,"children":3813},{"className":259,"code":3812,"language":261,"meta":136,"style":136},"\u003CNuxtPicture\n  src=\"/nuxt-icon.png\"\n  :imgAttrs=\"{id:'my-id', class:'my-class', style:'display:block', 'data-my-data': 'my-value'}\"\n/>\n",[3814],{"type":148,"tag":153,"props":3815,"children":3816},{"__ignoreMap":136},[3817,3829,3852,3877],{"type":148,"tag":267,"props":3818,"children":3819},{"class":269,"line":270},[3820,3824],{"type":148,"tag":267,"props":3821,"children":3822},{"style":274},[3823],{"type":157,"value":277},{"type":148,"tag":267,"props":3825,"children":3826},{"style":280},[3827],{"type":157,"value":3828},"NuxtPicture\n",{"type":148,"tag":267,"props":3830,"children":3831},{"class":269,"line":656},[3832,3836,3840,3844,3848],{"type":148,"tag":267,"props":3833,"children":3834},{"style":286},[3835],{"type":157,"value":662},{"type":148,"tag":267,"props":3837,"children":3838},{"style":274},[3839],{"type":157,"value":294},{"type":148,"tag":267,"props":3841,"children":3842},{"style":274},[3843],{"type":157,"value":299},{"type":148,"tag":267,"props":3845,"children":3846},{"style":302},[3847],{"type":157,"value":305},{"type":148,"tag":267,"props":3849,"children":3850},{"style":274},[3851],{"type":157,"value":680},{"type":148,"tag":267,"props":3853,"children":3854},{"class":269,"line":683},[3855,3860,3864,3868,3873],{"type":148,"tag":267,"props":3856,"children":3857},{"style":286},[3858],{"type":157,"value":3859},"  :imgAttrs",{"type":148,"tag":267,"props":3861,"children":3862},{"style":274},[3863],{"type":157,"value":294},{"type":148,"tag":267,"props":3865,"children":3866},{"style":274},[3867],{"type":157,"value":299},{"type":148,"tag":267,"props":3869,"children":3870},{"style":302},[3871],{"type":157,"value":3872},"{id:'my-id', class:'my-class', style:'display:block', 'data-my-data': 'my-value'}",{"type":148,"tag":267,"props":3874,"children":3875},{"style":274},[3876],{"type":157,"value":680},{"type":148,"tag":267,"props":3878,"children":3879},{"class":269,"line":709},[3880],{"type":148,"tag":267,"props":3881,"children":3882},{"style":274},[3883],{"type":157,"value":715},{"type":148,"tag":3283,"props":3885,"children":3886},{},[3887],{"type":157,"value":3287},{"title":136,"searchDepth":656,"depth":656,"links":3889},[3890],{"id":394,"depth":656,"text":397,"children":3891},[3892,3893,3894],{"id":2132,"depth":683,"text":2132},{"id":3731,"depth":683,"text":3737},{"id":3785,"depth":683,"text":3791},"content:2.usage:2.nuxt-picture.md","2.usage/2.nuxt-picture.md",1703164847742]