[{"data":1,"prerenderedAt":6484},["ShallowReactive",2],{"navigation":3,"docs-/usage/nuxt-picture":139,"docs-/usage/nuxt-picture-surround":778},[4,20,33,129],{"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,123,126],{"title":37,"_path":38},"Aliyun","/providers/aliyun",{"title":40,"_path":41},"AWS Amplify","/providers/aws-amplify",{"title":43,"_path":44},"Bunny","/providers/bunny",{"title":46,"_path":47},"Caisy","/providers/caisy",{"title":49,"_path":50},"Cloudflare","/providers/cloudflare",{"title":52,"_path":53},"Cloudimage","/providers/cloudimage",{"title":55,"_path":56},"Cloudinary","/providers/cloudinary",{"title":58,"_path":59},"Contentful","/providers/contentful",{"title":61,"_path":62},"Directus","/providers/directus",{"title":64,"_path":65},"Edgio","/providers/edgio",{"title":67,"_path":68},"Fastly","/providers/fastly",{"title":70,"_path":71},"Filerobot","/providers/filerobot",{"title":73,"_path":74},"Glide","/providers/glide",{"title":76,"_path":77},"Gumlet","/providers/gumlet",{"title":79,"_path":80},"Hygraph","/providers/hygraph",{"title":82,"_path":83},"ImageEngine","/providers/imageengine",{"title":85,"_path":86},"ImageKit","/providers/imagekit",{"title":88,"_path":89},"Imgix","/providers/imgix",{"title":91,"_path":92},"IPX","/providers/ipx",{"title":94,"_path":95},"Netlify","/providers/netlify",{"title":97,"_path":98},"Prepr","/providers/prepr",{"title":100,"_path":101},"Prismic","/providers/prismic",{"title":103,"_path":104},"Sanity","/providers/sanity",{"title":106,"_path":107},"Sirv","/providers/sirv",{"title":109,"_path":110},"Storyblok","/providers/storyblok",{"title":112,"_path":113},"Strapi","/providers/strapi",{"title":115,"_path":116},"Twicpics","/providers/twicpics",{"title":118,"_path":119},"Unsplash","/providers/unsplash",{"title":121,"_path":122},"Uploadcare","/providers/uploadcare",{"title":124,"_path":125},"Vercel","/providers/vercel",{"title":127,"_path":128},"Weserv","/providers/weserv",{"title":130,"_path":131,"children":132},"Advanced","/advanced",[133,136],{"title":134,"_path":135},"Custom Provider","/advanced/custom-provider",{"title":137,"_path":138},"Static Images","/advanced/static-images",{"_path":29,"_dir":140,"_draft":141,"_partial":141,"_locale":142,"title":28,"description":143,"links":144,"body":150,"_type":772,"_id":773,"_source":774,"_file":775,"_stem":776,"_extension":777},"usage",false,"","Discover how to use and configure the Nuxt Picture component.",[145],{"label":146,"icon":147,"to":148,"size":149},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-picture.ts","xs",{"type":151,"children":152,"toc":765},"root",[153,175,207,227,267,274,291,301,306,401,449,459,464,511,521,534,543,759],{"type":154,"tag":155,"props":156,"children":157},"element","p",{},[158,165,167,173],{"type":154,"tag":159,"props":160,"children":162},"code",{"className":161},[],[163],{"type":164,"value":28},"text",{"type":164,"value":166}," is a drop-in replacement for the native ",{"type":154,"tag":159,"props":168,"children":170},{"className":169},[],[171],{"type":164,"value":172},"\u003Cpicture>",{"type":164,"value":174}," tag.",{"type":154,"tag":155,"props":176,"children":177},{},[178,180,185,187,197,199,205],{"type":164,"value":179},"Usage of ",{"type":154,"tag":159,"props":181,"children":183},{"className":182},[],[184],{"type":164,"value":28},{"type":164,"value":186}," is almost identical to ",{"type":154,"tag":188,"props":189,"children":191},"a",{"href":190},"nuxt-img",[192],{"type":154,"tag":159,"props":193,"children":195},{"className":194},[],[196],{"type":164,"value":25},{"type":164,"value":198}," but also allows serving modern formats like ",{"type":154,"tag":159,"props":200,"children":202},{"className":201},[],[203],{"type":164,"value":204},"webp",{"type":164,"value":206}," when possible.",{"type":154,"tag":155,"props":208,"children":209},{},[210,212,225],{"type":164,"value":211},"Learn more about the ",{"type":154,"tag":188,"props":213,"children":217},{"href":214,"rel":215},"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture",[216],"nofollow",[218,223],{"type":154,"tag":159,"props":219,"children":221},{"className":220},[],[222],{"type":164,"value":172},{"type":164,"value":224}," tag on MDN",{"type":164,"value":226},".",{"type":154,"tag":228,"props":229,"children":232},"callout",{"color":230,"icon":231},"amber","i-heroicons-exclamation-triangle",[233],{"type":154,"tag":155,"props":234,"children":235},{},[236,238,249,251,256,258,265],{"type":164,"value":237},"Unlike the native ",{"type":154,"tag":188,"props":239,"children":241},{"href":214,"rel":240},[216],[242,247],{"type":154,"tag":159,"props":243,"children":245},{"className":244},[],[246],{"type":164,"value":172},{"type":164,"value":248}," element",{"type":164,"value":250},", ",{"type":154,"tag":159,"props":252,"children":254},{"className":253},[],[255],{"type":164,"value":28},{"type":164,"value":257}," currently doesn't support using multiple image sources. See ",{"type":154,"tag":188,"props":259,"children":262},{"href":260,"rel":261},"https://github.com/nuxt/image/issues/309",[216],[263],{"type":164,"value":264},"#309",{"type":164,"value":266}," for more info.",{"type":154,"tag":268,"props":269,"children":271},"h2",{"id":270},"props",[272],{"type":164,"value":273},"Props",{"type":154,"tag":228,"props":275,"children":276},{},[277],{"type":154,"tag":155,"props":278,"children":279},{},[280,282],{"type":164,"value":281},"See props supported by",{"type":154,"tag":188,"props":283,"children":285},{"href":284},"/usage/nuxt-img#props",[286],{"type":154,"tag":159,"props":287,"children":289},{"className":288},[],[290],{"type":164,"value":25},{"type":154,"tag":292,"props":293,"children":295},"h3",{"id":294},"format",[296],{"type":154,"tag":159,"props":297,"children":299},{"className":298},[],[300],{"type":164,"value":294},{"type":154,"tag":155,"props":302,"children":303},{},[304],{"type":164,"value":305},"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":154,"tag":307,"props":308,"children":312},"pre",{"className":309,"code":310,"language":311,"meta":142,"style":142},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNuxtPicture\n format=\"avif,webp\"\n src=\"/nuxt-icon.png\"\n/>\n","vue",[313],{"type":154,"tag":159,"props":314,"children":315},{"__ignoreMap":142},[316,334,365,391],{"type":154,"tag":317,"props":318,"children":321},"span",{"class":319,"line":320},"line",1,[322,328],{"type":154,"tag":317,"props":323,"children":325},{"style":324},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[326],{"type":164,"value":327},"\u003C",{"type":154,"tag":317,"props":329,"children":331},{"style":330},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[332],{"type":164,"value":333},"NuxtPicture\n",{"type":154,"tag":317,"props":335,"children":337},{"class":319,"line":336},2,[338,344,349,354,360],{"type":154,"tag":317,"props":339,"children":341},{"style":340},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[342],{"type":164,"value":343}," format",{"type":154,"tag":317,"props":345,"children":346},{"style":324},[347],{"type":164,"value":348},"=",{"type":154,"tag":317,"props":350,"children":351},{"style":324},[352],{"type":164,"value":353},"\"",{"type":154,"tag":317,"props":355,"children":357},{"style":356},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[358],{"type":164,"value":359},"avif,webp",{"type":154,"tag":317,"props":361,"children":362},{"style":324},[363],{"type":164,"value":364},"\"\n",{"type":154,"tag":317,"props":366,"children":368},{"class":319,"line":367},3,[369,374,378,382,387],{"type":154,"tag":317,"props":370,"children":371},{"style":340},[372],{"type":164,"value":373}," src",{"type":154,"tag":317,"props":375,"children":376},{"style":324},[377],{"type":164,"value":348},{"type":154,"tag":317,"props":379,"children":380},{"style":324},[381],{"type":164,"value":353},{"type":154,"tag":317,"props":383,"children":384},{"style":356},[385],{"type":164,"value":386},"/nuxt-icon.png",{"type":154,"tag":317,"props":388,"children":389},{"style":324},[390],{"type":164,"value":364},{"type":154,"tag":317,"props":392,"children":394},{"class":319,"line":393},4,[395],{"type":154,"tag":317,"props":396,"children":398},{"style":397},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[399],{"type":164,"value":400},"/>\n",{"type":154,"tag":155,"props":402,"children":403},{},[404,406,411,412,418,419,425,426,432,433,439,441,447],{"type":164,"value":405},"Available formats are ",{"type":154,"tag":159,"props":407,"children":409},{"className":408},[],[410],{"type":164,"value":204},{"type":164,"value":250},{"type":154,"tag":159,"props":413,"children":415},{"className":414},[],[416],{"type":164,"value":417},"avif",{"type":164,"value":250},{"type":154,"tag":159,"props":420,"children":422},{"className":421},[],[423],{"type":164,"value":424},"jpeg",{"type":164,"value":250},{"type":154,"tag":159,"props":427,"children":429},{"className":428},[],[430],{"type":164,"value":431},"jpg",{"type":164,"value":250},{"type":154,"tag":159,"props":434,"children":436},{"className":435},[],[437],{"type":164,"value":438},"png",{"type":164,"value":440},", and ",{"type":154,"tag":159,"props":442,"children":444},{"className":443},[],[445],{"type":164,"value":446},"gif",{"type":164,"value":448},". If the format is not specified, it will respect the default image format.",{"type":154,"tag":292,"props":450,"children":452},{"id":451},"legacyformat",[453],{"type":154,"tag":159,"props":454,"children":456},{"className":455},[],[457],{"type":164,"value":458},"legacyFormat",{"type":154,"tag":155,"props":460,"children":461},{},[462],{"type":164,"value":463},"Format used for fallback. Default is conditional:",{"type":154,"tag":465,"props":466,"children":467},"ul",{},[468,500],{"type":154,"tag":469,"props":470,"children":471},"li",{},[472,474,479,480,485,486,491,493,498],{"type":164,"value":473},"If original format supports transparency (",{"type":154,"tag":159,"props":475,"children":477},{"className":476},[],[478],{"type":164,"value":438},{"type":164,"value":250},{"type":154,"tag":159,"props":481,"children":483},{"className":482},[],[484],{"type":164,"value":204},{"type":164,"value":440},{"type":154,"tag":159,"props":487,"children":489},{"className":488},[],[490],{"type":164,"value":446},{"type":164,"value":492},"), ",{"type":154,"tag":159,"props":494,"children":496},{"className":495},[],[497],{"type":164,"value":438},{"type":164,"value":499}," is used for fallback",{"type":154,"tag":469,"props":501,"children":502},{},[503,505,510],{"type":164,"value":504},"Otherwise ",{"type":154,"tag":159,"props":506,"children":508},{"className":507},[],[509],{"type":164,"value":424},{"type":164,"value":499},{"type":154,"tag":292,"props":512,"children":514},{"id":513},"imgattrs",[515],{"type":154,"tag":159,"props":516,"children":518},{"className":517},[],[519],{"type":164,"value":520},"imgAttrs",{"type":154,"tag":155,"props":522,"children":523},{},[524,526,532],{"type":164,"value":525},"Allows you to set additional HTML-attributes on the ",{"type":154,"tag":159,"props":527,"children":529},{"className":528},[],[530],{"type":164,"value":531},"img",{"type":164,"value":533}," element.",{"type":154,"tag":155,"props":535,"children":536},{},[537],{"type":154,"tag":538,"props":539,"children":540},"strong",{},[541],{"type":164,"value":542},"Example:",{"type":154,"tag":307,"props":544,"children":546},{"className":309,"code":545,"language":311,"meta":142,"style":142},"\u003CNuxtPicture\n src=\"/nuxt-icon.png\"\n :imgAttrs=\"{\n id: 'my-id',\n class: 'my-class',\n style: 'display: block',\n 'data-my-data': 'my-value'\n }\"\n/>\n",[547],{"type":154,"tag":159,"props":548,"children":549},{"__ignoreMap":142},[550,561,584,609,642,672,702,738,751],{"type":154,"tag":317,"props":551,"children":552},{"class":319,"line":320},[553,557],{"type":154,"tag":317,"props":554,"children":555},{"style":324},[556],{"type":164,"value":327},{"type":154,"tag":317,"props":558,"children":559},{"style":330},[560],{"type":164,"value":333},{"type":154,"tag":317,"props":562,"children":563},{"class":319,"line":336},[564,568,572,576,580],{"type":154,"tag":317,"props":565,"children":566},{"style":340},[567],{"type":164,"value":373},{"type":154,"tag":317,"props":569,"children":570},{"style":324},[571],{"type":164,"value":348},{"type":154,"tag":317,"props":573,"children":574},{"style":324},[575],{"type":164,"value":353},{"type":154,"tag":317,"props":577,"children":578},{"style":356},[579],{"type":164,"value":386},{"type":154,"tag":317,"props":581,"children":582},{"style":324},[583],{"type":164,"value":364},{"type":154,"tag":317,"props":585,"children":586},{"class":319,"line":367},[587,592,596,600,604],{"type":154,"tag":317,"props":588,"children":589},{"style":324},[590],{"type":164,"value":591}," :",{"type":154,"tag":317,"props":593,"children":594},{"style":340},[595],{"type":164,"value":520},{"type":154,"tag":317,"props":597,"children":598},{"style":324},[599],{"type":164,"value":348},{"type":154,"tag":317,"props":601,"children":602},{"style":324},[603],{"type":164,"value":353},{"type":154,"tag":317,"props":605,"children":606},{"style":324},[607],{"type":164,"value":608},"{\n",{"type":154,"tag":317,"props":610,"children":611},{"class":319,"line":393},[612,617,622,627,632,637],{"type":154,"tag":317,"props":613,"children":614},{"style":330},[615],{"type":164,"value":616}," id",{"type":154,"tag":317,"props":618,"children":619},{"style":324},[620],{"type":164,"value":621},":",{"type":154,"tag":317,"props":623,"children":624},{"style":324},[625],{"type":164,"value":626}," '",{"type":154,"tag":317,"props":628,"children":629},{"style":356},[630],{"type":164,"value":631},"my-id",{"type":154,"tag":317,"props":633,"children":634},{"style":324},[635],{"type":164,"value":636},"'",{"type":154,"tag":317,"props":638,"children":639},{"style":324},[640],{"type":164,"value":641},",\n",{"type":154,"tag":317,"props":643,"children":645},{"class":319,"line":644},5,[646,651,655,659,664,668],{"type":154,"tag":317,"props":647,"children":648},{"style":330},[649],{"type":164,"value":650}," class",{"type":154,"tag":317,"props":652,"children":653},{"style":324},[654],{"type":164,"value":621},{"type":154,"tag":317,"props":656,"children":657},{"style":324},[658],{"type":164,"value":626},{"type":154,"tag":317,"props":660,"children":661},{"style":356},[662],{"type":164,"value":663},"my-class",{"type":154,"tag":317,"props":665,"children":666},{"style":324},[667],{"type":164,"value":636},{"type":154,"tag":317,"props":669,"children":670},{"style":324},[671],{"type":164,"value":641},{"type":154,"tag":317,"props":673,"children":675},{"class":319,"line":674},6,[676,681,685,689,694,698],{"type":154,"tag":317,"props":677,"children":678},{"style":330},[679],{"type":164,"value":680}," style",{"type":154,"tag":317,"props":682,"children":683},{"style":324},[684],{"type":164,"value":621},{"type":154,"tag":317,"props":686,"children":687},{"style":324},[688],{"type":164,"value":626},{"type":154,"tag":317,"props":690,"children":691},{"style":356},[692],{"type":164,"value":693},"display: block",{"type":154,"tag":317,"props":695,"children":696},{"style":324},[697],{"type":164,"value":636},{"type":154,"tag":317,"props":699,"children":700},{"style":324},[701],{"type":164,"value":641},{"type":154,"tag":317,"props":703,"children":705},{"class":319,"line":704},7,[706,711,716,720,724,728,733],{"type":154,"tag":317,"props":707,"children":708},{"style":324},[709],{"type":164,"value":710}," '",{"type":154,"tag":317,"props":712,"children":713},{"style":330},[714],{"type":164,"value":715},"data-my-data",{"type":154,"tag":317,"props":717,"children":718},{"style":324},[719],{"type":164,"value":636},{"type":154,"tag":317,"props":721,"children":722},{"style":324},[723],{"type":164,"value":621},{"type":154,"tag":317,"props":725,"children":726},{"style":324},[727],{"type":164,"value":626},{"type":154,"tag":317,"props":729,"children":730},{"style":356},[731],{"type":164,"value":732},"my-value",{"type":154,"tag":317,"props":734,"children":735},{"style":324},[736],{"type":164,"value":737},"'\n",{"type":154,"tag":317,"props":739,"children":741},{"class":319,"line":740},8,[742,747],{"type":154,"tag":317,"props":743,"children":744},{"style":324},[745],{"type":164,"value":746}," }",{"type":154,"tag":317,"props":748,"children":749},{"style":324},[750],{"type":164,"value":364},{"type":154,"tag":317,"props":752,"children":754},{"class":319,"line":753},9,[755],{"type":154,"tag":317,"props":756,"children":757},{"style":397},[758],{"type":164,"value":400},{"type":154,"tag":760,"props":761,"children":762},"style",{},[763],{"type":164,"value":764},"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 .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);}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":142,"searchDepth":336,"depth":336,"links":766},[767],{"id":270,"depth":336,"text":273,"children":768},[769,770,771],{"id":294,"depth":367,"text":294},{"id":451,"depth":367,"text":458},{"id":513,"depth":367,"text":520},"markdown","content:2.usage:2.nuxt-picture.md","content","2.usage/2.nuxt-picture.md","2.usage/2.nuxt-picture","md",[779,5156],{"_path":26,"_dir":140,"_draft":141,"_partial":141,"_locale":142,"title":25,"description":780,"links":781,"body":784,"_type":772,"_id":5153,"_source":774,"_file":5154,"_stem":5155,"_extension":777},"Discover how to use and configure the Nuxt Image component.",[782],{"label":146,"icon":147,"to":783,"size":149},"https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-img.ts",{"type":151,"children":785,"toc":5129},[786,802,867,871,895,940,945,990,1020,1024,1033,1067,1094,1177,1184,1521,1533,1541,1546,1571,1614,1638,1654,1659,1683,1691,1712,1725,1758,1830,1838,1843,1855,1867,1918,1925,1999,2008,2013,2020,2171,2180,2185,2198,2203,2608,2623,2931,2940,2959,3100,3176,3185,3204,3211,3491,3500,3505,3526,3851,3859,3864,3935,3982,3991,3996,4118,4127,4138,4195,4313,4321,4330,4335,4347,4354,4526,4535,4548,4595,4604,4626,4639,4703,4712,4739,4946,4952,4977,4999,5125],{"type":154,"tag":155,"props":787,"children":788},{},[789,794,795,801],{"type":154,"tag":159,"props":790,"children":792},{"className":791},[],[793],{"type":164,"value":25},{"type":164,"value":166},{"type":154,"tag":159,"props":796,"children":798},{"className":797},[],[799],{"type":164,"value":800},"\u003Cimg>",{"type":164,"value":174},{"type":154,"tag":465,"props":803,"children":804},{},[805,810,823,842,855],{"type":154,"tag":469,"props":806,"children":807},{},[808],{"type":164,"value":809},"Uses built-in provider to optimize local and remote images",{"type":154,"tag":469,"props":811,"children":812},{},[813,815,821],{"type":164,"value":814},"Converts ",{"type":154,"tag":159,"props":816,"children":818},{"className":817},[],[819],{"type":164,"value":820},"src",{"type":164,"value":822}," to provider optimized URLs",{"type":154,"tag":469,"props":824,"children":825},{},[826,828,834,836],{"type":164,"value":827},"Automatically resizes images based on ",{"type":154,"tag":159,"props":829,"children":831},{"className":830},[],[832],{"type":164,"value":833},"width",{"type":164,"value":835}," and ",{"type":154,"tag":159,"props":837,"children":839},{"className":838},[],[840],{"type":164,"value":841},"height",{"type":154,"tag":469,"props":843,"children":844},{},[845,847,853],{"type":164,"value":846},"Generates responsive sizes when providing ",{"type":154,"tag":159,"props":848,"children":850},{"className":849},[],[851],{"type":164,"value":852},"sizes",{"type":164,"value":854}," option",{"type":154,"tag":469,"props":856,"children":857},{},[858,860,865],{"type":164,"value":859},"Supports native lazy loading as well as other ",{"type":154,"tag":159,"props":861,"children":863},{"className":862},[],[864],{"type":164,"value":800},{"type":164,"value":866}," attributes",{"type":154,"tag":268,"props":868,"children":869},{"id":140},[870],{"type":164,"value":21},{"type":154,"tag":155,"props":872,"children":873},{},[874,879,881,886,888,893],{"type":154,"tag":159,"props":875,"children":877},{"className":876},[],[878],{"type":164,"value":25},{"type":164,"value":880}," outputs a native ",{"type":154,"tag":159,"props":882,"children":884},{"className":883},[],[885],{"type":164,"value":531},{"type":164,"value":887}," tag directly (without any wrapper around it). Use it like you would use the ",{"type":154,"tag":159,"props":889,"children":891},{"className":890},[],[892],{"type":164,"value":800},{"type":164,"value":894}," tag:",{"type":154,"tag":307,"props":896,"children":898},{"className":309,"code":897,"language":311,"meta":142,"style":142},"\u003CNuxtImg src=\"/nuxt-icon.png\" />\n",[899],{"type":154,"tag":159,"props":900,"children":901},{"__ignoreMap":142},[902],{"type":154,"tag":317,"props":903,"children":904},{"class":319,"line":320},[905,909,914,919,923,927,931,935],{"type":154,"tag":317,"props":906,"children":907},{"style":324},[908],{"type":164,"value":327},{"type":154,"tag":317,"props":910,"children":911},{"style":330},[912],{"type":164,"value":913},"NuxtImg",{"type":154,"tag":317,"props":915,"children":916},{"style":340},[917],{"type":164,"value":918}," src",{"type":154,"tag":317,"props":920,"children":921},{"style":324},[922],{"type":164,"value":348},{"type":154,"tag":317,"props":924,"children":925},{"style":324},[926],{"type":164,"value":353},{"type":154,"tag":317,"props":928,"children":929},{"style":356},[930],{"type":164,"value":386},{"type":154,"tag":317,"props":932,"children":933},{"style":324},[934],{"type":164,"value":353},{"type":154,"tag":317,"props":936,"children":937},{"style":324},[938],{"type":164,"value":939}," />\n",{"type":154,"tag":155,"props":941,"children":942},{},[943],{"type":164,"value":944},"Will result in:",{"type":154,"tag":307,"props":946,"children":950},{"className":947,"code":948,"language":949,"meta":142,"style":142},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cimg src=\"/nuxt-icon.png\">\n","html",[951],{"type":154,"tag":159,"props":952,"children":953},{"__ignoreMap":142},[954],{"type":154,"tag":317,"props":955,"children":956},{"class":319,"line":320},[957,961,965,969,973,977,981,985],{"type":154,"tag":317,"props":958,"children":959},{"style":324},[960],{"type":164,"value":327},{"type":154,"tag":317,"props":962,"children":963},{"style":330},[964],{"type":164,"value":531},{"type":154,"tag":317,"props":966,"children":967},{"style":340},[968],{"type":164,"value":918},{"type":154,"tag":317,"props":970,"children":971},{"style":324},[972],{"type":164,"value":348},{"type":154,"tag":317,"props":974,"children":975},{"style":324},[976],{"type":164,"value":353},{"type":154,"tag":317,"props":978,"children":979},{"style":356},[980],{"type":164,"value":386},{"type":154,"tag":317,"props":982,"children":983},{"style":324},[984],{"type":164,"value":353},{"type":154,"tag":317,"props":986,"children":987},{"style":324},[988],{"type":164,"value":989},">\n",{"type":154,"tag":228,"props":991,"children":992},{},[993],{"type":154,"tag":155,"props":994,"children":995},{},[996,998,1003,1005,1010,1012,1018],{"type":164,"value":997},"With ",{"type":154,"tag":188,"props":999,"children":1000},{"href":16},[1001],{"type":164,"value":1002},"default provider",{"type":164,"value":1004},", you should put ",{"type":154,"tag":159,"props":1006,"children":1008},{"className":1007},[],[1009],{"type":164,"value":386},{"type":164,"value":1011}," inside ",{"type":154,"tag":159,"props":1013,"children":1015},{"className":1014},[],[1016],{"type":164,"value":1017},"public/",{"type":164,"value":1019}," directory for Nuxt 3 make the above example work.",{"type":154,"tag":268,"props":1021,"children":1022},{"id":270},[1023],{"type":164,"value":273},{"type":154,"tag":292,"props":1025,"children":1027},{"id":1026},"custom",[1028],{"type":154,"tag":159,"props":1029,"children":1031},{"className":1030},[],[1032],{"type":164,"value":1026},{"type":154,"tag":155,"props":1034,"children":1035},{},[1036,1038,1043,1045,1050,1052,1057,1059,1065],{"type":164,"value":1037},"The ",{"type":154,"tag":159,"props":1039,"children":1041},{"className":1040},[],[1042],{"type":164,"value":1026},{"type":164,"value":1044}," prop determines whether ",{"type":154,"tag":159,"props":1046,"children":1048},{"className":1047},[],[1049],{"type":164,"value":25},{"type":164,"value":1051}," should render as a simple ",{"type":154,"tag":159,"props":1053,"children":1055},{"className":1054},[],[1056],{"type":164,"value":800},{"type":164,"value":1058}," element or only serve as a provider for custom rendering. When set to ",{"type":154,"tag":159,"props":1060,"children":1062},{"className":1061},[],[1063],{"type":164,"value":1064},"true",{"type":164,"value":1066},", it disables the default rendering behavior, allowing full control over how the image is displayed. This is useful for implementing custom functionalities, such as placeholders.",{"type":154,"tag":155,"props":1068,"children":1069},{},[1070,1072,1077,1079,1084,1086,1092],{"type":164,"value":1071},"When using the ",{"type":154,"tag":159,"props":1073,"children":1075},{"className":1074},[],[1076],{"type":164,"value":1026},{"type":164,"value":1078}," prop, ",{"type":154,"tag":159,"props":1080,"children":1082},{"className":1081},[],[1083],{"type":164,"value":25},{"type":164,"value":1085}," passes necessary data and attributes to its default slot. You can access the following values via the ",{"type":154,"tag":159,"props":1087,"children":1089},{"className":1088},[],[1090],{"type":164,"value":1091},"v-slot",{"type":164,"value":1093}," directive:",{"type":154,"tag":465,"props":1095,"children":1096},{},[1097,1150,1163],{"type":154,"tag":469,"props":1098,"children":1099},{},[1100,1108,1110,1115,1117,1123,1124,1129,1130,1135,1136,1142,1143,1148],{"type":154,"tag":538,"props":1101,"children":1102},{},[1103],{"type":154,"tag":159,"props":1104,"children":1106},{"className":1105},[],[1107],{"type":164,"value":520},{"type":164,"value":1109},": Attributes for the ",{"type":154,"tag":159,"props":1111,"children":1113},{"className":1112},[],[1114],{"type":164,"value":800},{"type":164,"value":1116}," element (e.g., ",{"type":154,"tag":159,"props":1118,"children":1120},{"className":1119},[],[1121],{"type":164,"value":1122},"alt",{"type":164,"value":250},{"type":154,"tag":159,"props":1125,"children":1127},{"className":1126},[],[1128],{"type":164,"value":833},{"type":164,"value":250},{"type":154,"tag":159,"props":1131,"children":1133},{"className":1132},[],[1134],{"type":164,"value":841},{"type":164,"value":250},{"type":154,"tag":159,"props":1137,"children":1139},{"className":1138},[],[1140],{"type":164,"value":1141},"srcset",{"type":164,"value":250},{"type":154,"tag":159,"props":1144,"children":1146},{"className":1145},[],[1147],{"type":164,"value":852},{"type":164,"value":1149},").",{"type":154,"tag":469,"props":1151,"children":1152},{},[1153,1161],{"type":154,"tag":538,"props":1154,"children":1155},{},[1156],{"type":154,"tag":159,"props":1157,"children":1159},{"className":1158},[],[1160],{"type":164,"value":820},{"type":164,"value":1162},": The computed image source URL.",{"type":154,"tag":469,"props":1164,"children":1165},{},[1166,1175],{"type":154,"tag":538,"props":1167,"children":1168},{},[1169],{"type":154,"tag":159,"props":1170,"children":1172},{"className":1171},[],[1173],{"type":164,"value":1174},"isLoaded",{"type":164,"value":1176},": A boolean indicating whether the image has been loaded.",{"type":154,"tag":1178,"props":1179,"children":1181},"h4",{"id":1180},"example-usage",[1182],{"type":164,"value":1183},"Example Usage",{"type":154,"tag":307,"props":1185,"children":1187},{"className":309,"code":1186,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/images/nuxt.png\"\n alt=\"image\"\n width=\"400\"\n height=\"400\"\n :custom=\"true\"\n v-slot=\"{ src, isLoaded, imgAttrs }\"\n>\n \u003C!-- Show the actual image when loaded -->\n \u003Cimg\n v-if=\"isLoaded\"\n v-bind=\"imgAttrs\"\n :src=\"src\"\n >\n\n \u003C!-- Show a placeholder while loading -->\n \u003Cimg\n v-else\n src=\"https://placehold.co/400x400\"\n alt=\"placeholder\"\n >\n\u003C/NuxtImg>\n",[1188],{"type":154,"tag":159,"props":1189,"children":1190},{"__ignoreMap":142},[1191,1203,1227,1252,1277,1301,1329,1382,1389,1397,1406,1415,1424,1433,1442,1452,1461,1469,1478,1487,1496,1504],{"type":154,"tag":317,"props":1192,"children":1193},{"class":319,"line":320},[1194,1198],{"type":154,"tag":317,"props":1195,"children":1196},{"style":324},[1197],{"type":164,"value":327},{"type":154,"tag":317,"props":1199,"children":1200},{"style":330},[1201],{"type":164,"value":1202},"NuxtImg\n",{"type":154,"tag":317,"props":1204,"children":1205},{"class":319,"line":336},[1206,1210,1214,1218,1223],{"type":154,"tag":317,"props":1207,"children":1208},{"style":340},[1209],{"type":164,"value":373},{"type":154,"tag":317,"props":1211,"children":1212},{"style":324},[1213],{"type":164,"value":348},{"type":154,"tag":317,"props":1215,"children":1216},{"style":324},[1217],{"type":164,"value":353},{"type":154,"tag":317,"props":1219,"children":1220},{"style":356},[1221],{"type":164,"value":1222},"/images/nuxt.png",{"type":154,"tag":317,"props":1224,"children":1225},{"style":324},[1226],{"type":164,"value":364},{"type":154,"tag":317,"props":1228,"children":1229},{"class":319,"line":367},[1230,1235,1239,1243,1248],{"type":154,"tag":317,"props":1231,"children":1232},{"style":340},[1233],{"type":164,"value":1234}," alt",{"type":154,"tag":317,"props":1236,"children":1237},{"style":324},[1238],{"type":164,"value":348},{"type":154,"tag":317,"props":1240,"children":1241},{"style":324},[1242],{"type":164,"value":353},{"type":154,"tag":317,"props":1244,"children":1245},{"style":356},[1246],{"type":164,"value":1247},"image",{"type":154,"tag":317,"props":1249,"children":1250},{"style":324},[1251],{"type":164,"value":364},{"type":154,"tag":317,"props":1253,"children":1254},{"class":319,"line":393},[1255,1260,1264,1268,1273],{"type":154,"tag":317,"props":1256,"children":1257},{"style":340},[1258],{"type":164,"value":1259}," width",{"type":154,"tag":317,"props":1261,"children":1262},{"style":324},[1263],{"type":164,"value":348},{"type":154,"tag":317,"props":1265,"children":1266},{"style":324},[1267],{"type":164,"value":353},{"type":154,"tag":317,"props":1269,"children":1270},{"style":356},[1271],{"type":164,"value":1272},"400",{"type":154,"tag":317,"props":1274,"children":1275},{"style":324},[1276],{"type":164,"value":364},{"type":154,"tag":317,"props":1278,"children":1279},{"class":319,"line":644},[1280,1285,1289,1293,1297],{"type":154,"tag":317,"props":1281,"children":1282},{"style":340},[1283],{"type":164,"value":1284}," height",{"type":154,"tag":317,"props":1286,"children":1287},{"style":324},[1288],{"type":164,"value":348},{"type":154,"tag":317,"props":1290,"children":1291},{"style":324},[1292],{"type":164,"value":353},{"type":154,"tag":317,"props":1294,"children":1295},{"style":356},[1296],{"type":164,"value":1272},{"type":154,"tag":317,"props":1298,"children":1299},{"style":324},[1300],{"type":164,"value":364},{"type":154,"tag":317,"props":1302,"children":1303},{"class":319,"line":674},[1304,1308,1312,1316,1320,1325],{"type":154,"tag":317,"props":1305,"children":1306},{"style":324},[1307],{"type":164,"value":591},{"type":154,"tag":317,"props":1309,"children":1310},{"style":340},[1311],{"type":164,"value":1026},{"type":154,"tag":317,"props":1313,"children":1314},{"style":324},[1315],{"type":164,"value":348},{"type":154,"tag":317,"props":1317,"children":1318},{"style":324},[1319],{"type":164,"value":353},{"type":154,"tag":317,"props":1321,"children":1323},{"style":1322},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[1324],{"type":164,"value":1064},{"type":154,"tag":317,"props":1326,"children":1327},{"style":324},[1328],{"type":164,"value":364},{"type":154,"tag":317,"props":1330,"children":1331},{"class":319,"line":704},[1332,1337,1341,1345,1350,1354,1359,1364,1368,1373,1378],{"type":154,"tag":317,"props":1333,"children":1334},{"style":340},[1335],{"type":164,"value":1336}," v-slot",{"type":154,"tag":317,"props":1338,"children":1339},{"style":324},[1340],{"type":164,"value":348},{"type":154,"tag":317,"props":1342,"children":1343},{"style":324},[1344],{"type":164,"value":353},{"type":154,"tag":317,"props":1346,"children":1347},{"style":324},[1348],{"type":164,"value":1349},"{",{"type":154,"tag":317,"props":1351,"children":1352},{"style":397},[1353],{"type":164,"value":918},{"type":154,"tag":317,"props":1355,"children":1356},{"style":324},[1357],{"type":164,"value":1358},",",{"type":154,"tag":317,"props":1360,"children":1361},{"style":397},[1362],{"type":164,"value":1363}," isLoaded",{"type":154,"tag":317,"props":1365,"children":1366},{"style":324},[1367],{"type":164,"value":1358},{"type":154,"tag":317,"props":1369,"children":1370},{"style":397},[1371],{"type":164,"value":1372}," imgAttrs ",{"type":154,"tag":317,"props":1374,"children":1375},{"style":324},[1376],{"type":164,"value":1377},"}",{"type":154,"tag":317,"props":1379,"children":1380},{"style":324},[1381],{"type":164,"value":364},{"type":154,"tag":317,"props":1383,"children":1384},{"class":319,"line":740},[1385],{"type":154,"tag":317,"props":1386,"children":1387},{"style":324},[1388],{"type":164,"value":989},{"type":154,"tag":317,"props":1390,"children":1391},{"class":319,"line":753},[1392],{"type":154,"tag":317,"props":1393,"children":1394},{"style":397},[1395],{"type":164,"value":1396}," \u003C!-- Show the actual image when loaded -->\n",{"type":154,"tag":317,"props":1398,"children":1400},{"class":319,"line":1399},10,[1401],{"type":154,"tag":317,"props":1402,"children":1403},{"style":397},[1404],{"type":164,"value":1405}," \u003Cimg\n",{"type":154,"tag":317,"props":1407,"children":1409},{"class":319,"line":1408},11,[1410],{"type":154,"tag":317,"props":1411,"children":1412},{"style":397},[1413],{"type":164,"value":1414}," v-if=\"isLoaded\"\n",{"type":154,"tag":317,"props":1416,"children":1418},{"class":319,"line":1417},12,[1419],{"type":154,"tag":317,"props":1420,"children":1421},{"style":397},[1422],{"type":164,"value":1423}," v-bind=\"imgAttrs\"\n",{"type":154,"tag":317,"props":1425,"children":1427},{"class":319,"line":1426},13,[1428],{"type":154,"tag":317,"props":1429,"children":1430},{"style":397},[1431],{"type":164,"value":1432}," :src=\"src\"\n",{"type":154,"tag":317,"props":1434,"children":1436},{"class":319,"line":1435},14,[1437],{"type":154,"tag":317,"props":1438,"children":1439},{"style":397},[1440],{"type":164,"value":1441}," >\n",{"type":154,"tag":317,"props":1443,"children":1445},{"class":319,"line":1444},15,[1446],{"type":154,"tag":317,"props":1447,"children":1449},{"emptyLinePlaceholder":1448},true,[1450],{"type":164,"value":1451},"\n",{"type":154,"tag":317,"props":1453,"children":1455},{"class":319,"line":1454},16,[1456],{"type":154,"tag":317,"props":1457,"children":1458},{"style":397},[1459],{"type":164,"value":1460}," \u003C!-- Show a placeholder while loading -->\n",{"type":154,"tag":317,"props":1462,"children":1464},{"class":319,"line":1463},17,[1465],{"type":154,"tag":317,"props":1466,"children":1467},{"style":397},[1468],{"type":164,"value":1405},{"type":154,"tag":317,"props":1470,"children":1472},{"class":319,"line":1471},18,[1473],{"type":154,"tag":317,"props":1474,"children":1475},{"style":397},[1476],{"type":164,"value":1477}," v-else\n",{"type":154,"tag":317,"props":1479,"children":1481},{"class":319,"line":1480},19,[1482],{"type":154,"tag":317,"props":1483,"children":1484},{"style":397},[1485],{"type":164,"value":1486}," src=\"https://placehold.co/400x400\"\n",{"type":154,"tag":317,"props":1488,"children":1490},{"class":319,"line":1489},20,[1491],{"type":154,"tag":317,"props":1492,"children":1493},{"style":397},[1494],{"type":164,"value":1495}," alt=\"placeholder\"\n",{"type":154,"tag":317,"props":1497,"children":1499},{"class":319,"line":1498},21,[1500],{"type":154,"tag":317,"props":1501,"children":1502},{"style":397},[1503],{"type":164,"value":1441},{"type":154,"tag":317,"props":1505,"children":1507},{"class":319,"line":1506},22,[1508,1513,1517],{"type":154,"tag":317,"props":1509,"children":1510},{"style":324},[1511],{"type":164,"value":1512},"\u003C/",{"type":154,"tag":317,"props":1514,"children":1515},{"style":330},[1516],{"type":164,"value":913},{"type":154,"tag":317,"props":1518,"children":1519},{"style":324},[1520],{"type":164,"value":989},{"type":154,"tag":155,"props":1522,"children":1523},{},[1524,1526,1531],{"type":164,"value":1525},"This approach ensures flexibility for custom rendering scenarios, while ",{"type":154,"tag":159,"props":1527,"children":1529},{"className":1528},[],[1530],{"type":164,"value":25},{"type":164,"value":1532}," continues to handle image optimization and data provisioning behind the scenes.",{"type":154,"tag":292,"props":1534,"children":1535},{"id":820},[1536],{"type":154,"tag":159,"props":1537,"children":1539},{"className":1538},[],[1540],{"type":164,"value":820},{"type":154,"tag":155,"props":1542,"children":1543},{},[1544],{"type":164,"value":1545},"Path to image file",{"type":154,"tag":155,"props":1547,"children":1548},{},[1549,1554,1556,1561,1563,1569],{"type":154,"tag":159,"props":1550,"children":1552},{"className":1551},[],[1553],{"type":164,"value":820},{"type":164,"value":1555}," should be in the form of an absolute path for static images in ",{"type":154,"tag":159,"props":1557,"children":1559},{"className":1558},[],[1560],{"type":164,"value":1017},{"type":164,"value":1562}," directory.\nOtherwise path that is expected by provider that starts with ",{"type":154,"tag":159,"props":1564,"children":1566},{"className":1565},[],[1567],{"type":164,"value":1568},"/",{"type":164,"value":1570}," or a URL.",{"type":154,"tag":307,"props":1572,"children":1574},{"className":309,"code":1573,"language":311,"meta":142,"style":142},"\u003CNuxtImg src=\"/nuxt.png\" />\n",[1575],{"type":154,"tag":159,"props":1576,"children":1577},{"__ignoreMap":142},[1578],{"type":154,"tag":317,"props":1579,"children":1580},{"class":319,"line":320},[1581,1585,1589,1593,1597,1601,1606,1610],{"type":154,"tag":317,"props":1582,"children":1583},{"style":324},[1584],{"type":164,"value":327},{"type":154,"tag":317,"props":1586,"children":1587},{"style":330},[1588],{"type":164,"value":913},{"type":154,"tag":317,"props":1590,"children":1591},{"style":340},[1592],{"type":164,"value":918},{"type":154,"tag":317,"props":1594,"children":1595},{"style":324},[1596],{"type":164,"value":348},{"type":154,"tag":317,"props":1598,"children":1599},{"style":324},[1600],{"type":164,"value":353},{"type":154,"tag":317,"props":1602,"children":1603},{"style":356},[1604],{"type":164,"value":1605},"/nuxt.png",{"type":154,"tag":317,"props":1607,"children":1608},{"style":324},[1609],{"type":164,"value":353},{"type":154,"tag":317,"props":1611,"children":1612},{"style":324},[1613],{"type":164,"value":939},{"type":154,"tag":155,"props":1615,"children":1616},{},[1617,1619,1624,1626,1636],{"type":164,"value":1618},"For image optimization when using external URLs in ",{"type":154,"tag":159,"props":1620,"children":1622},{"className":1621},[],[1623],{"type":164,"value":820},{"type":164,"value":1625},", we need to whitelist them using ",{"type":154,"tag":188,"props":1627,"children":1629},{"href":1628},"/get-started/configuration#domains",[1630],{"type":154,"tag":159,"props":1631,"children":1633},{"className":1632},[],[1634],{"type":164,"value":1635},"domains",{"type":164,"value":1637}," option.",{"type":154,"tag":292,"props":1639,"children":1641},{"id":1640},"width-height",[1642,1647,1649],{"type":154,"tag":159,"props":1643,"children":1645},{"className":1644},[],[1646],{"type":164,"value":833},{"type":164,"value":1648}," / ",{"type":154,"tag":159,"props":1650,"children":1652},{"className":1651},[],[1653],{"type":164,"value":841},{"type":154,"tag":155,"props":1655,"children":1656},{},[1657],{"type":164,"value":1658},"Specify width/height of the image.",{"type":154,"tag":465,"props":1660,"children":1661},{},[1662,1667],{"type":154,"tag":469,"props":1663,"children":1664},{},[1665],{"type":164,"value":1666},"Use desired width/height for static sized images like icons or avatars",{"type":154,"tag":469,"props":1668,"children":1669},{},[1670,1672,1681],{"type":164,"value":1671},"Use original image width/height for responsive images (when using ",{"type":154,"tag":188,"props":1673,"children":1675},{"href":1674},"#sizes",[1676],{"type":154,"tag":159,"props":1677,"children":1679},{"className":1678},[],[1680],{"type":164,"value":852},{"type":164,"value":1682},")",{"type":154,"tag":292,"props":1684,"children":1685},{"id":1122},[1686],{"type":154,"tag":159,"props":1687,"children":1689},{"className":1688},[],[1690],{"type":164,"value":1122},{"type":154,"tag":155,"props":1692,"children":1693},{},[1694,1696,1701,1703,1710],{"type":164,"value":1695},"Although Nuxt Image does not apply any special handling, it's worth mentioning the ",{"type":154,"tag":159,"props":1697,"children":1699},{"className":1698},[],[1700],{"type":164,"value":1122},{"type":164,"value":1702}," attribute. It is a ",{"type":154,"tag":188,"props":1704,"children":1707},{"href":1705,"rel":1706},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt",[216],[1708],{"type":164,"value":1709},"native",{"type":164,"value":1711}," global attribute that specifies an alternate text for an image, if the image cannot be displayed.",{"type":154,"tag":155,"props":1713,"children":1714},{},[1715,1717,1723],{"type":164,"value":1716},"It ",{"type":154,"tag":1718,"props":1719,"children":1720},"em",{},[1721],{"type":164,"value":1722},"should always",{"type":164,"value":1724}," be provided.",{"type":154,"tag":465,"props":1726,"children":1727},{},[1728,1733,1745],{"type":154,"tag":469,"props":1729,"children":1730},{},[1731],{"type":164,"value":1732},"The text should describe the image if the image contains information",{"type":154,"tag":469,"props":1734,"children":1735},{},[1736,1738,1744],{"type":164,"value":1737},"The text should explain where the link goes if the image is inside an ",{"type":154,"tag":159,"props":1739,"children":1741},{"className":1740},[],[1742],{"type":164,"value":1743},"\u003Ca>",{"type":164,"value":248},{"type":154,"tag":469,"props":1746,"children":1747},{},[1748,1750,1756],{"type":164,"value":1749},"Use ",{"type":154,"tag":159,"props":1751,"children":1753},{"className":1752},[],[1754],{"type":164,"value":1755},"alt=\"\"",{"type":164,"value":1757}," if the image is only for decoration",{"type":154,"tag":307,"props":1759,"children":1761},{"className":309,"code":1760,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/nuxt.png\"\n alt=\"My image file description\"\n/>\n",[1762],{"type":154,"tag":159,"props":1763,"children":1764},{"__ignoreMap":142},[1765,1776,1799,1823],{"type":154,"tag":317,"props":1766,"children":1767},{"class":319,"line":320},[1768,1772],{"type":154,"tag":317,"props":1769,"children":1770},{"style":324},[1771],{"type":164,"value":327},{"type":154,"tag":317,"props":1773,"children":1774},{"style":330},[1775],{"type":164,"value":1202},{"type":154,"tag":317,"props":1777,"children":1778},{"class":319,"line":336},[1779,1783,1787,1791,1795],{"type":154,"tag":317,"props":1780,"children":1781},{"style":340},[1782],{"type":164,"value":373},{"type":154,"tag":317,"props":1784,"children":1785},{"style":324},[1786],{"type":164,"value":348},{"type":154,"tag":317,"props":1788,"children":1789},{"style":324},[1790],{"type":164,"value":353},{"type":154,"tag":317,"props":1792,"children":1793},{"style":356},[1794],{"type":164,"value":1605},{"type":154,"tag":317,"props":1796,"children":1797},{"style":324},[1798],{"type":164,"value":364},{"type":154,"tag":317,"props":1800,"children":1801},{"class":319,"line":367},[1802,1806,1810,1814,1819],{"type":154,"tag":317,"props":1803,"children":1804},{"style":340},[1805],{"type":164,"value":1234},{"type":154,"tag":317,"props":1807,"children":1808},{"style":324},[1809],{"type":164,"value":348},{"type":154,"tag":317,"props":1811,"children":1812},{"style":324},[1813],{"type":164,"value":353},{"type":154,"tag":317,"props":1815,"children":1816},{"style":356},[1817],{"type":164,"value":1818},"My image file description",{"type":154,"tag":317,"props":1820,"children":1821},{"style":324},[1822],{"type":164,"value":364},{"type":154,"tag":317,"props":1824,"children":1825},{"class":319,"line":393},[1826],{"type":154,"tag":317,"props":1827,"children":1828},{"style":397},[1829],{"type":164,"value":400},{"type":154,"tag":292,"props":1831,"children":1832},{"id":852},[1833],{"type":154,"tag":159,"props":1834,"children":1836},{"className":1835},[],[1837],{"type":164,"value":852},{"type":154,"tag":155,"props":1839,"children":1840},{},[1841],{"type":164,"value":1842},"Specify responsive sizes.",{"type":154,"tag":155,"props":1844,"children":1845},{},[1846,1848,1854],{"type":164,"value":1847},"This is a space-separated list of screen size/width pairs. You can ",{"type":154,"tag":188,"props":1849,"children":1851},{"href":1850},"/get-started/configuration#screens",[1852],{"type":164,"value":1853},"see a list of the defined screen sizes here",{"type":164,"value":226},{"type":154,"tag":155,"props":1856,"children":1857},{},[1858,1860,1865],{"type":164,"value":1859},"By default Nuxt generates ",{"type":154,"tag":1718,"props":1861,"children":1862},{},[1863],{"type":164,"value":1864},"responsive-first",{"type":164,"value":1866}," sizing.",{"type":154,"tag":465,"props":1868,"children":1869},{},[1870,1883],{"type":154,"tag":469,"props":1871,"children":1872},{},[1873,1875,1881],{"type":164,"value":1874},"If you omit a screen size prefix (like ",{"type":154,"tag":159,"props":1876,"children":1878},{"className":1877},[],[1879],{"type":164,"value":1880},"sm:",{"type":164,"value":1882},") 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":154,"tag":469,"props":1884,"children":1885},{},[1886,1888,1893,1895,1901,1903,1909,1911,1916],{"type":164,"value":1887},"This default size is used up until the next specified screen width, and so on. Each specified size pair applies ",{"type":154,"tag":1718,"props":1889,"children":1890},{},[1891],{"type":164,"value":1892},"up",{"type":164,"value":1894}," - so ",{"type":154,"tag":159,"props":1896,"children":1898},{"className":1897},[],[1899],{"type":164,"value":1900},"md:400px",{"type":164,"value":1902}," means that the image will be sized ",{"type":154,"tag":159,"props":1904,"children":1906},{"className":1905},[],[1907],{"type":164,"value":1908},"400px",{"type":164,"value":1910}," on ",{"type":154,"tag":159,"props":1912,"children":1914},{"className":1913},[],[1915],{"type":164,"value":777},{"type":164,"value":1917}," screens and up.",{"type":154,"tag":155,"props":1919,"children":1920},{},[1921],{"type":154,"tag":538,"props":1922,"children":1923},{},[1924],{"type":164,"value":542},{"type":154,"tag":307,"props":1926,"children":1928},{"className":309,"code":1927,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/logos/nuxt.png\"\n sizes=\"100vw sm:50vw md:400px\"\n/>\n",[1929],{"type":154,"tag":159,"props":1930,"children":1931},{"__ignoreMap":142},[1932,1943,1967,1992],{"type":154,"tag":317,"props":1933,"children":1934},{"class":319,"line":320},[1935,1939],{"type":154,"tag":317,"props":1936,"children":1937},{"style":324},[1938],{"type":164,"value":327},{"type":154,"tag":317,"props":1940,"children":1941},{"style":330},[1942],{"type":164,"value":1202},{"type":154,"tag":317,"props":1944,"children":1945},{"class":319,"line":336},[1946,1950,1954,1958,1963],{"type":154,"tag":317,"props":1947,"children":1948},{"style":340},[1949],{"type":164,"value":373},{"type":154,"tag":317,"props":1951,"children":1952},{"style":324},[1953],{"type":164,"value":348},{"type":154,"tag":317,"props":1955,"children":1956},{"style":324},[1957],{"type":164,"value":353},{"type":154,"tag":317,"props":1959,"children":1960},{"style":356},[1961],{"type":164,"value":1962},"/logos/nuxt.png",{"type":154,"tag":317,"props":1964,"children":1965},{"style":324},[1966],{"type":164,"value":364},{"type":154,"tag":317,"props":1968,"children":1969},{"class":319,"line":367},[1970,1975,1979,1983,1988],{"type":154,"tag":317,"props":1971,"children":1972},{"style":340},[1973],{"type":164,"value":1974}," sizes",{"type":154,"tag":317,"props":1976,"children":1977},{"style":324},[1978],{"type":164,"value":348},{"type":154,"tag":317,"props":1980,"children":1981},{"style":324},[1982],{"type":164,"value":353},{"type":154,"tag":317,"props":1984,"children":1985},{"style":356},[1986],{"type":164,"value":1987},"100vw sm:50vw md:400px",{"type":154,"tag":317,"props":1989,"children":1990},{"style":324},[1991],{"type":164,"value":364},{"type":154,"tag":317,"props":1993,"children":1994},{"class":319,"line":393},[1995],{"type":154,"tag":317,"props":1996,"children":1997},{"style":397},[1998],{"type":164,"value":400},{"type":154,"tag":292,"props":2000,"children":2002},{"id":2001},"densities",[2003],{"type":154,"tag":159,"props":2004,"children":2006},{"className":2005},[],[2007],{"type":164,"value":2001},{"type":154,"tag":155,"props":2009,"children":2010},{},[2011],{"type":164,"value":2012},"To generate special versions of images for screens with increased pixel density.",{"type":154,"tag":155,"props":2014,"children":2015},{},[2016],{"type":154,"tag":538,"props":2017,"children":2018},{},[2019],{"type":164,"value":542},{"type":154,"tag":307,"props":2021,"children":2023},{"className":309,"code":2022,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/logos/nuxt.png\"\n height=\"50\"\n densities=\"x1 x2\"\n/>\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",[2024],{"type":154,"tag":159,"props":2025,"children":2026},{"__ignoreMap":142},[2027,2038,2061,2085,2110,2117,2124,2132,2140,2148,2156,2163],{"type":154,"tag":317,"props":2028,"children":2029},{"class":319,"line":320},[2030,2034],{"type":154,"tag":317,"props":2031,"children":2032},{"style":324},[2033],{"type":164,"value":327},{"type":154,"tag":317,"props":2035,"children":2036},{"style":330},[2037],{"type":164,"value":1202},{"type":154,"tag":317,"props":2039,"children":2040},{"class":319,"line":336},[2041,2045,2049,2053,2057],{"type":154,"tag":317,"props":2042,"children":2043},{"style":340},[2044],{"type":164,"value":373},{"type":154,"tag":317,"props":2046,"children":2047},{"style":324},[2048],{"type":164,"value":348},{"type":154,"tag":317,"props":2050,"children":2051},{"style":324},[2052],{"type":164,"value":353},{"type":154,"tag":317,"props":2054,"children":2055},{"style":356},[2056],{"type":164,"value":1962},{"type":154,"tag":317,"props":2058,"children":2059},{"style":324},[2060],{"type":164,"value":364},{"type":154,"tag":317,"props":2062,"children":2063},{"class":319,"line":367},[2064,2068,2072,2076,2081],{"type":154,"tag":317,"props":2065,"children":2066},{"style":340},[2067],{"type":164,"value":1284},{"type":154,"tag":317,"props":2069,"children":2070},{"style":324},[2071],{"type":164,"value":348},{"type":154,"tag":317,"props":2073,"children":2074},{"style":324},[2075],{"type":164,"value":353},{"type":154,"tag":317,"props":2077,"children":2078},{"style":356},[2079],{"type":164,"value":2080},"50",{"type":154,"tag":317,"props":2082,"children":2083},{"style":324},[2084],{"type":164,"value":364},{"type":154,"tag":317,"props":2086,"children":2087},{"class":319,"line":393},[2088,2093,2097,2101,2106],{"type":154,"tag":317,"props":2089,"children":2090},{"style":340},[2091],{"type":164,"value":2092}," densities",{"type":154,"tag":317,"props":2094,"children":2095},{"style":324},[2096],{"type":164,"value":348},{"type":154,"tag":317,"props":2098,"children":2099},{"style":324},[2100],{"type":164,"value":353},{"type":154,"tag":317,"props":2102,"children":2103},{"style":356},[2104],{"type":164,"value":2105},"x1 x2",{"type":154,"tag":317,"props":2107,"children":2108},{"style":324},[2109],{"type":164,"value":364},{"type":154,"tag":317,"props":2111,"children":2112},{"class":319,"line":644},[2113],{"type":154,"tag":317,"props":2114,"children":2115},{"style":397},[2116],{"type":164,"value":400},{"type":154,"tag":317,"props":2118,"children":2119},{"class":319,"line":674},[2120],{"type":154,"tag":317,"props":2121,"children":2122},{"emptyLinePlaceholder":1448},[2123],{"type":164,"value":1451},{"type":154,"tag":317,"props":2125,"children":2126},{"class":319,"line":704},[2127],{"type":154,"tag":317,"props":2128,"children":2129},{"style":397},[2130],{"type":164,"value":2131},"\u003C!--\n",{"type":154,"tag":317,"props":2133,"children":2134},{"class":319,"line":740},[2135],{"type":154,"tag":317,"props":2136,"children":2137},{"style":397},[2138],{"type":164,"value":2139},"\u003Cimg\n",{"type":154,"tag":317,"props":2141,"children":2142},{"class":319,"line":753},[2143],{"type":154,"tag":317,"props":2144,"children":2145},{"style":397},[2146],{"type":164,"value":2147}," src=\"/_ipx/w_50/logos/nuxt.png\" \n",{"type":154,"tag":317,"props":2149,"children":2150},{"class":319,"line":1399},[2151],{"type":154,"tag":317,"props":2152,"children":2153},{"style":397},[2154],{"type":164,"value":2155}," srcset=\"/_ipx/w_100/logos/nuxt.png x2\"\n",{"type":154,"tag":317,"props":2157,"children":2158},{"class":319,"line":1408},[2159],{"type":154,"tag":317,"props":2160,"children":2161},{"style":397},[2162],{"type":164,"value":400},{"type":154,"tag":317,"props":2164,"children":2165},{"class":319,"line":1417},[2166],{"type":154,"tag":317,"props":2167,"children":2168},{"style":397},[2169],{"type":164,"value":2170},"-->\n",{"type":154,"tag":292,"props":2172,"children":2174},{"id":2173},"placeholder",[2175],{"type":154,"tag":159,"props":2176,"children":2178},{"className":2177},[],[2179],{"type":164,"value":2173},{"type":154,"tag":155,"props":2181,"children":2182},{},[2183],{"type":164,"value":2184},"Display a placeholder image before the actual image is fully loaded.",{"type":154,"tag":155,"props":2186,"children":2187},{},[2188,2190,2196],{"type":164,"value":2189},"You can also use the ",{"type":154,"tag":188,"props":2191,"children":2193},{"href":2192},"/usage/nuxt-img#custom",[2194],{"type":164,"value":2195},"custom prop",{"type":164,"value":2197}," to make any placeholder you want.",{"type":154,"tag":155,"props":2199,"children":2200},{},[2201],{"type":164,"value":2202},"The placeholder prop can be either a string, a boolean, a number, or an array. The usage is shown below for each case.",{"type":154,"tag":307,"props":2204,"children":2206},{"className":309,"code":2205,"language":311,"meta":142,"style":142},"\u003C!-- Automatically generate a placeholder based on the original image -->\n\u003CNuxtImg src=\"/nuxt.png\" placeholder />\n\n\u003C!-- Set a width, height for the automatically generated placeholder -->\n\u003CNuxtImg src=\"/nuxt.png\" :placeholder=\"[50, 25]\" />\n\n\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder -->\n\u003CNuxtImg 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\u003CNuxtImg src=\"/nuxt.png\" :placeholder=\"15\" />\n\n\u003C!-- Provide your own image -->\n\u003CNuxtImg src=\"/nuxt.png\" placeholder=\"./placeholder.png\" />\n",[2207],{"type":154,"tag":159,"props":2208,"children":2209},{"__ignoreMap":142},[2210,2219,2259,2266,2274,2354,2361,2369,2462,2469,2477,2537,2544,2552],{"type":154,"tag":317,"props":2211,"children":2212},{"class":319,"line":320},[2213],{"type":154,"tag":317,"props":2214,"children":2216},{"style":2215},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[2217],{"type":164,"value":2218},"\u003C!-- Automatically generate a placeholder based on the original image -->\n",{"type":154,"tag":317,"props":2220,"children":2221},{"class":319,"line":336},[2222,2226,2230,2234,2238,2242,2246,2250,2255],{"type":154,"tag":317,"props":2223,"children":2224},{"style":324},[2225],{"type":164,"value":327},{"type":154,"tag":317,"props":2227,"children":2228},{"style":330},[2229],{"type":164,"value":913},{"type":154,"tag":317,"props":2231,"children":2232},{"style":340},[2233],{"type":164,"value":918},{"type":154,"tag":317,"props":2235,"children":2236},{"style":324},[2237],{"type":164,"value":348},{"type":154,"tag":317,"props":2239,"children":2240},{"style":324},[2241],{"type":164,"value":353},{"type":154,"tag":317,"props":2243,"children":2244},{"style":356},[2245],{"type":164,"value":1605},{"type":154,"tag":317,"props":2247,"children":2248},{"style":324},[2249],{"type":164,"value":353},{"type":154,"tag":317,"props":2251,"children":2252},{"style":340},[2253],{"type":164,"value":2254}," placeholder",{"type":154,"tag":317,"props":2256,"children":2257},{"style":324},[2258],{"type":164,"value":939},{"type":154,"tag":317,"props":2260,"children":2261},{"class":319,"line":367},[2262],{"type":154,"tag":317,"props":2263,"children":2264},{"emptyLinePlaceholder":1448},[2265],{"type":164,"value":1451},{"type":154,"tag":317,"props":2267,"children":2268},{"class":319,"line":393},[2269],{"type":154,"tag":317,"props":2270,"children":2271},{"style":2215},[2272],{"type":164,"value":2273},"\u003C!-- Set a width, height for the automatically generated placeholder -->\n",{"type":154,"tag":317,"props":2275,"children":2276},{"class":319,"line":644},[2277,2281,2285,2289,2293,2297,2301,2305,2310,2314,2318,2322,2327,2332,2336,2341,2346,2350],{"type":154,"tag":317,"props":2278,"children":2279},{"style":324},[2280],{"type":164,"value":327},{"type":154,"tag":317,"props":2282,"children":2283},{"style":330},[2284],{"type":164,"value":913},{"type":154,"tag":317,"props":2286,"children":2287},{"style":340},[2288],{"type":164,"value":918},{"type":154,"tag":317,"props":2290,"children":2291},{"style":324},[2292],{"type":164,"value":348},{"type":154,"tag":317,"props":2294,"children":2295},{"style":324},[2296],{"type":164,"value":353},{"type":154,"tag":317,"props":2298,"children":2299},{"style":356},[2300],{"type":164,"value":1605},{"type":154,"tag":317,"props":2302,"children":2303},{"style":324},[2304],{"type":164,"value":353},{"type":154,"tag":317,"props":2306,"children":2307},{"style":324},[2308],{"type":164,"value":2309}," :",{"type":154,"tag":317,"props":2311,"children":2312},{"style":340},[2313],{"type":164,"value":2173},{"type":154,"tag":317,"props":2315,"children":2316},{"style":324},[2317],{"type":164,"value":348},{"type":154,"tag":317,"props":2319,"children":2320},{"style":324},[2321],{"type":164,"value":353},{"type":154,"tag":317,"props":2323,"children":2324},{"style":397},[2325],{"type":164,"value":2326},"[",{"type":154,"tag":317,"props":2328,"children":2330},{"style":2329},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[2331],{"type":164,"value":2080},{"type":154,"tag":317,"props":2333,"children":2334},{"style":324},[2335],{"type":164,"value":1358},{"type":154,"tag":317,"props":2337,"children":2338},{"style":2329},[2339],{"type":164,"value":2340}," 25",{"type":154,"tag":317,"props":2342,"children":2343},{"style":397},[2344],{"type":164,"value":2345},"]",{"type":154,"tag":317,"props":2347,"children":2348},{"style":324},[2349],{"type":164,"value":353},{"type":154,"tag":317,"props":2351,"children":2352},{"style":324},[2353],{"type":164,"value":939},{"type":154,"tag":317,"props":2355,"children":2356},{"class":319,"line":674},[2357],{"type":154,"tag":317,"props":2358,"children":2359},{"emptyLinePlaceholder":1448},[2360],{"type":164,"value":1451},{"type":154,"tag":317,"props":2362,"children":2363},{"class":319,"line":704},[2364],{"type":154,"tag":317,"props":2365,"children":2366},{"style":2215},[2367],{"type":164,"value":2368},"\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder -->\n",{"type":154,"tag":317,"props":2370,"children":2371},{"class":319,"line":740},[2372,2376,2380,2384,2388,2392,2396,2400,2404,2408,2412,2416,2420,2424,2428,2432,2436,2441,2445,2450,2454,2458],{"type":154,"tag":317,"props":2373,"children":2374},{"style":324},[2375],{"type":164,"value":327},{"type":154,"tag":317,"props":2377,"children":2378},{"style":330},[2379],{"type":164,"value":913},{"type":154,"tag":317,"props":2381,"children":2382},{"style":340},[2383],{"type":164,"value":918},{"type":154,"tag":317,"props":2385,"children":2386},{"style":324},[2387],{"type":164,"value":348},{"type":154,"tag":317,"props":2389,"children":2390},{"style":324},[2391],{"type":164,"value":353},{"type":154,"tag":317,"props":2393,"children":2394},{"style":356},[2395],{"type":164,"value":1605},{"type":154,"tag":317,"props":2397,"children":2398},{"style":324},[2399],{"type":164,"value":353},{"type":154,"tag":317,"props":2401,"children":2402},{"style":324},[2403],{"type":164,"value":2309},{"type":154,"tag":317,"props":2405,"children":2406},{"style":340},[2407],{"type":164,"value":2173},{"type":154,"tag":317,"props":2409,"children":2410},{"style":324},[2411],{"type":164,"value":348},{"type":154,"tag":317,"props":2413,"children":2414},{"style":324},[2415],{"type":164,"value":353},{"type":154,"tag":317,"props":2417,"children":2418},{"style":397},[2419],{"type":164,"value":2326},{"type":154,"tag":317,"props":2421,"children":2422},{"style":2329},[2423],{"type":164,"value":2080},{"type":154,"tag":317,"props":2425,"children":2426},{"style":324},[2427],{"type":164,"value":1358},{"type":154,"tag":317,"props":2429,"children":2430},{"style":2329},[2431],{"type":164,"value":2340},{"type":154,"tag":317,"props":2433,"children":2434},{"style":324},[2435],{"type":164,"value":1358},{"type":154,"tag":317,"props":2437,"children":2438},{"style":2329},[2439],{"type":164,"value":2440}," 75",{"type":154,"tag":317,"props":2442,"children":2443},{"style":324},[2444],{"type":164,"value":1358},{"type":154,"tag":317,"props":2446,"children":2447},{"style":2329},[2448],{"type":164,"value":2449}," 5",{"type":154,"tag":317,"props":2451,"children":2452},{"style":397},[2453],{"type":164,"value":2345},{"type":154,"tag":317,"props":2455,"children":2456},{"style":324},[2457],{"type":164,"value":353},{"type":154,"tag":317,"props":2459,"children":2460},{"style":324},[2461],{"type":164,"value":939},{"type":154,"tag":317,"props":2463,"children":2464},{"class":319,"line":753},[2465],{"type":154,"tag":317,"props":2466,"children":2467},{"emptyLinePlaceholder":1448},[2468],{"type":164,"value":1451},{"type":154,"tag":317,"props":2470,"children":2471},{"class":319,"line":1399},[2472],{"type":154,"tag":317,"props":2473,"children":2474},{"style":2215},[2475],{"type":164,"value":2476},"\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n",{"type":154,"tag":317,"props":2478,"children":2479},{"class":319,"line":1408},[2480,2484,2488,2492,2496,2500,2504,2508,2512,2516,2520,2524,2529,2533],{"type":154,"tag":317,"props":2481,"children":2482},{"style":324},[2483],{"type":164,"value":327},{"type":154,"tag":317,"props":2485,"children":2486},{"style":330},[2487],{"type":164,"value":913},{"type":154,"tag":317,"props":2489,"children":2490},{"style":340},[2491],{"type":164,"value":918},{"type":154,"tag":317,"props":2493,"children":2494},{"style":324},[2495],{"type":164,"value":348},{"type":154,"tag":317,"props":2497,"children":2498},{"style":324},[2499],{"type":164,"value":353},{"type":154,"tag":317,"props":2501,"children":2502},{"style":356},[2503],{"type":164,"value":1605},{"type":154,"tag":317,"props":2505,"children":2506},{"style":324},[2507],{"type":164,"value":353},{"type":154,"tag":317,"props":2509,"children":2510},{"style":324},[2511],{"type":164,"value":2309},{"type":154,"tag":317,"props":2513,"children":2514},{"style":340},[2515],{"type":164,"value":2173},{"type":154,"tag":317,"props":2517,"children":2518},{"style":324},[2519],{"type":164,"value":348},{"type":154,"tag":317,"props":2521,"children":2522},{"style":324},[2523],{"type":164,"value":353},{"type":154,"tag":317,"props":2525,"children":2526},{"style":2329},[2527],{"type":164,"value":2528},"15",{"type":154,"tag":317,"props":2530,"children":2531},{"style":324},[2532],{"type":164,"value":353},{"type":154,"tag":317,"props":2534,"children":2535},{"style":324},[2536],{"type":164,"value":939},{"type":154,"tag":317,"props":2538,"children":2539},{"class":319,"line":1417},[2540],{"type":154,"tag":317,"props":2541,"children":2542},{"emptyLinePlaceholder":1448},[2543],{"type":164,"value":1451},{"type":154,"tag":317,"props":2545,"children":2546},{"class":319,"line":1426},[2547],{"type":154,"tag":317,"props":2548,"children":2549},{"style":2215},[2550],{"type":164,"value":2551},"\u003C!-- Provide your own image -->\n",{"type":154,"tag":317,"props":2553,"children":2554},{"class":319,"line":1435},[2555,2559,2563,2567,2571,2575,2579,2583,2587,2591,2595,2600,2604],{"type":154,"tag":317,"props":2556,"children":2557},{"style":324},[2558],{"type":164,"value":327},{"type":154,"tag":317,"props":2560,"children":2561},{"style":330},[2562],{"type":164,"value":913},{"type":154,"tag":317,"props":2564,"children":2565},{"style":340},[2566],{"type":164,"value":918},{"type":154,"tag":317,"props":2568,"children":2569},{"style":324},[2570],{"type":164,"value":348},{"type":154,"tag":317,"props":2572,"children":2573},{"style":324},[2574],{"type":164,"value":353},{"type":154,"tag":317,"props":2576,"children":2577},{"style":356},[2578],{"type":164,"value":1605},{"type":154,"tag":317,"props":2580,"children":2581},{"style":324},[2582],{"type":164,"value":353},{"type":154,"tag":317,"props":2584,"children":2585},{"style":340},[2586],{"type":164,"value":2254},{"type":154,"tag":317,"props":2588,"children":2589},{"style":324},[2590],{"type":164,"value":348},{"type":154,"tag":317,"props":2592,"children":2593},{"style":324},[2594],{"type":164,"value":353},{"type":154,"tag":317,"props":2596,"children":2597},{"style":356},[2598],{"type":164,"value":2599},"./placeholder.png",{"type":154,"tag":317,"props":2601,"children":2602},{"style":324},[2603],{"type":164,"value":353},{"type":154,"tag":317,"props":2605,"children":2606},{"style":324},[2607],{"type":164,"value":939},{"type":154,"tag":155,"props":2609,"children":2610},{},[2611,2613,2621],{"type":164,"value":2612},"You can also leverage ",{"type":154,"tag":188,"props":2614,"children":2615},{"href":32},[2616],{"type":154,"tag":159,"props":2617,"children":2619},{"className":2618},[],[2620],{"type":164,"value":31},{"type":164,"value":2622}," 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":154,"tag":307,"props":2624,"children":2626},{"className":309,"code":2625,"language":311,"meta":142,"style":142},"\u003Ctemplate>\n \u003CNuxtImg\n src=\"/nuxt.svg`\"\n :placeholder=\"img(`/nuxt.svg`, { h: 10, f: 'png', blur: 2, q: 50 })\"\n />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nconst img = useImage()\n\u003C/script>\n",[2627],{"type":154,"tag":159,"props":2628,"children":2629},{"__ignoreMap":142},[2630,2646,2658,2683,2816,2824,2839,2846,2889,2916],{"type":154,"tag":317,"props":2631,"children":2632},{"class":319,"line":320},[2633,2637,2642],{"type":154,"tag":317,"props":2634,"children":2635},{"style":324},[2636],{"type":164,"value":327},{"type":154,"tag":317,"props":2638,"children":2639},{"style":330},[2640],{"type":164,"value":2641},"template",{"type":154,"tag":317,"props":2643,"children":2644},{"style":324},[2645],{"type":164,"value":989},{"type":154,"tag":317,"props":2647,"children":2648},{"class":319,"line":336},[2649,2654],{"type":154,"tag":317,"props":2650,"children":2651},{"style":324},[2652],{"type":164,"value":2653}," \u003C",{"type":154,"tag":317,"props":2655,"children":2656},{"style":330},[2657],{"type":164,"value":1202},{"type":154,"tag":317,"props":2659,"children":2660},{"class":319,"line":367},[2661,2666,2670,2674,2679],{"type":154,"tag":317,"props":2662,"children":2663},{"style":340},[2664],{"type":164,"value":2665}," src",{"type":154,"tag":317,"props":2667,"children":2668},{"style":324},[2669],{"type":164,"value":348},{"type":154,"tag":317,"props":2671,"children":2672},{"style":324},[2673],{"type":164,"value":353},{"type":154,"tag":317,"props":2675,"children":2676},{"style":356},[2677],{"type":164,"value":2678},"/nuxt.svg`",{"type":154,"tag":317,"props":2680,"children":2681},{"style":324},[2682],{"type":164,"value":364},{"type":154,"tag":317,"props":2684,"children":2685},{"class":319,"line":393},[2686,2691,2695,2699,2703,2708,2713,2718,2723,2727,2732,2737,2742,2747,2751,2756,2760,2764,2768,2772,2776,2781,2785,2790,2794,2799,2803,2807,2812],{"type":154,"tag":317,"props":2687,"children":2688},{"style":324},[2689],{"type":164,"value":2690}," :",{"type":154,"tag":317,"props":2692,"children":2693},{"style":340},[2694],{"type":164,"value":2173},{"type":154,"tag":317,"props":2696,"children":2697},{"style":324},[2698],{"type":164,"value":348},{"type":154,"tag":317,"props":2700,"children":2701},{"style":324},[2702],{"type":164,"value":353},{"type":154,"tag":317,"props":2704,"children":2706},{"style":2705},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[2707],{"type":164,"value":531},{"type":154,"tag":317,"props":2709,"children":2710},{"style":324},[2711],{"type":164,"value":2712},"(",{"type":154,"tag":317,"props":2714,"children":2715},{"style":324},[2716],{"type":164,"value":2717},"`",{"type":154,"tag":317,"props":2719,"children":2720},{"style":356},[2721],{"type":164,"value":2722},"/nuxt.svg",{"type":154,"tag":317,"props":2724,"children":2725},{"style":324},[2726],{"type":164,"value":2717},{"type":154,"tag":317,"props":2728,"children":2729},{"style":324},[2730],{"type":164,"value":2731},", { ",{"type":154,"tag":317,"props":2733,"children":2734},{"style":330},[2735],{"type":164,"value":2736},"h",{"type":154,"tag":317,"props":2738,"children":2739},{"style":324},[2740],{"type":164,"value":2741},": ",{"type":154,"tag":317,"props":2743,"children":2744},{"style":2329},[2745],{"type":164,"value":2746},"10",{"type":154,"tag":317,"props":2748,"children":2749},{"style":324},[2750],{"type":164,"value":250},{"type":154,"tag":317,"props":2752,"children":2753},{"style":330},[2754],{"type":164,"value":2755},"f",{"type":154,"tag":317,"props":2757,"children":2758},{"style":324},[2759],{"type":164,"value":2741},{"type":154,"tag":317,"props":2761,"children":2762},{"style":324},[2763],{"type":164,"value":636},{"type":154,"tag":317,"props":2765,"children":2766},{"style":356},[2767],{"type":164,"value":438},{"type":154,"tag":317,"props":2769,"children":2770},{"style":324},[2771],{"type":164,"value":636},{"type":154,"tag":317,"props":2773,"children":2774},{"style":324},[2775],{"type":164,"value":250},{"type":154,"tag":317,"props":2777,"children":2778},{"style":330},[2779],{"type":164,"value":2780},"blur",{"type":154,"tag":317,"props":2782,"children":2783},{"style":324},[2784],{"type":164,"value":2741},{"type":154,"tag":317,"props":2786,"children":2787},{"style":2329},[2788],{"type":164,"value":2789},"2",{"type":154,"tag":317,"props":2791,"children":2792},{"style":324},[2793],{"type":164,"value":250},{"type":154,"tag":317,"props":2795,"children":2796},{"style":330},[2797],{"type":164,"value":2798},"q",{"type":154,"tag":317,"props":2800,"children":2801},{"style":324},[2802],{"type":164,"value":2741},{"type":154,"tag":317,"props":2804,"children":2805},{"style":2329},[2806],{"type":164,"value":2080},{"type":154,"tag":317,"props":2808,"children":2809},{"style":324},[2810],{"type":164,"value":2811}," })",{"type":154,"tag":317,"props":2813,"children":2814},{"style":324},[2815],{"type":164,"value":364},{"type":154,"tag":317,"props":2817,"children":2818},{"class":319,"line":644},[2819],{"type":154,"tag":317,"props":2820,"children":2821},{"style":324},[2822],{"type":164,"value":2823}," />\n",{"type":154,"tag":317,"props":2825,"children":2826},{"class":319,"line":674},[2827,2831,2835],{"type":154,"tag":317,"props":2828,"children":2829},{"style":324},[2830],{"type":164,"value":1512},{"type":154,"tag":317,"props":2832,"children":2833},{"style":330},[2834],{"type":164,"value":2641},{"type":154,"tag":317,"props":2836,"children":2837},{"style":324},[2838],{"type":164,"value":989},{"type":154,"tag":317,"props":2840,"children":2841},{"class":319,"line":704},[2842],{"type":154,"tag":317,"props":2843,"children":2844},{"emptyLinePlaceholder":1448},[2845],{"type":164,"value":1451},{"type":154,"tag":317,"props":2847,"children":2848},{"class":319,"line":740},[2849,2853,2858,2863,2868,2872,2876,2881,2885],{"type":154,"tag":317,"props":2850,"children":2851},{"style":324},[2852],{"type":164,"value":327},{"type":154,"tag":317,"props":2854,"children":2855},{"style":330},[2856],{"type":164,"value":2857},"script",{"type":154,"tag":317,"props":2859,"children":2860},{"style":340},[2861],{"type":164,"value":2862}," setup",{"type":154,"tag":317,"props":2864,"children":2865},{"style":340},[2866],{"type":164,"value":2867}," lang",{"type":154,"tag":317,"props":2869,"children":2870},{"style":324},[2871],{"type":164,"value":348},{"type":154,"tag":317,"props":2873,"children":2874},{"style":324},[2875],{"type":164,"value":353},{"type":154,"tag":317,"props":2877,"children":2878},{"style":356},[2879],{"type":164,"value":2880},"ts",{"type":154,"tag":317,"props":2882,"children":2883},{"style":324},[2884],{"type":164,"value":353},{"type":154,"tag":317,"props":2886,"children":2887},{"style":324},[2888],{"type":164,"value":989},{"type":154,"tag":317,"props":2890,"children":2891},{"class":319,"line":753},[2892,2897,2902,2906,2911],{"type":154,"tag":317,"props":2893,"children":2894},{"style":340},[2895],{"type":164,"value":2896},"const",{"type":154,"tag":317,"props":2898,"children":2899},{"style":397},[2900],{"type":164,"value":2901}," img ",{"type":154,"tag":317,"props":2903,"children":2904},{"style":324},[2905],{"type":164,"value":348},{"type":154,"tag":317,"props":2907,"children":2908},{"style":2705},[2909],{"type":164,"value":2910}," useImage",{"type":154,"tag":317,"props":2912,"children":2913},{"style":397},[2914],{"type":164,"value":2915},"()\n",{"type":154,"tag":317,"props":2917,"children":2918},{"class":319,"line":1399},[2919,2923,2927],{"type":154,"tag":317,"props":2920,"children":2921},{"style":324},[2922],{"type":164,"value":1512},{"type":154,"tag":317,"props":2924,"children":2925},{"style":330},[2926],{"type":164,"value":2857},{"type":154,"tag":317,"props":2928,"children":2929},{"style":324},[2930],{"type":164,"value":989},{"type":154,"tag":292,"props":2932,"children":2934},{"id":2933},"placeholder-class",[2935],{"type":154,"tag":159,"props":2936,"children":2938},{"className":2937},[],[2939],{"type":164,"value":2933},{"type":154,"tag":155,"props":2941,"children":2942},{},[2943,2945,2950,2952,2957],{"type":164,"value":2944},"When using a placeholder, you can use ",{"type":154,"tag":159,"props":2946,"children":2948},{"className":2947},[],[2949],{"type":164,"value":2933},{"type":164,"value":2951}," to apply a class to the original underlying ",{"type":154,"tag":159,"props":2953,"children":2955},{"className":2954},[],[2956],{"type":164,"value":800},{"type":164,"value":2958}," element (while the placeholder is being rendered).",{"type":154,"tag":307,"props":2960,"children":2962},{"className":309,"code":2961,"language":311,"meta":142,"style":142},"\u003C!-- Apply a static class to the original image -->\n\u003CNuxtImg\n src=\"/nuxt.png\"\n placeholder\n placeholder-class=\"custom\"\n/>\n\n\u003C!-- Apply a dynamic class to the original image -->\n\u003CNuxtImg\n src=\"/nuxt.png\"\n placeholder\n :placeholder-class=\"custom\"\n/>\n",[2963],{"type":154,"tag":159,"props":2964,"children":2965},{"__ignoreMap":142},[2966,2974,2985,3008,3016,3040,3047,3054,3062,3070,3078,3085,3093],{"type":154,"tag":317,"props":2967,"children":2968},{"class":319,"line":320},[2969],{"type":154,"tag":317,"props":2970,"children":2971},{"style":2215},[2972],{"type":164,"value":2973},"\u003C!-- Apply a static class to the original image -->\n",{"type":154,"tag":317,"props":2975,"children":2976},{"class":319,"line":336},[2977,2981],{"type":154,"tag":317,"props":2978,"children":2979},{"style":324},[2980],{"type":164,"value":327},{"type":154,"tag":317,"props":2982,"children":2983},{"style":330},[2984],{"type":164,"value":1202},{"type":154,"tag":317,"props":2986,"children":2987},{"class":319,"line":367},[2988,2992,2996,3000,3004],{"type":154,"tag":317,"props":2989,"children":2990},{"style":340},[2991],{"type":164,"value":373},{"type":154,"tag":317,"props":2993,"children":2994},{"style":324},[2995],{"type":164,"value":348},{"type":154,"tag":317,"props":2997,"children":2998},{"style":324},[2999],{"type":164,"value":353},{"type":154,"tag":317,"props":3001,"children":3002},{"style":356},[3003],{"type":164,"value":1605},{"type":154,"tag":317,"props":3005,"children":3006},{"style":324},[3007],{"type":164,"value":364},{"type":154,"tag":317,"props":3009,"children":3010},{"class":319,"line":393},[3011],{"type":154,"tag":317,"props":3012,"children":3013},{"style":340},[3014],{"type":164,"value":3015}," placeholder\n",{"type":154,"tag":317,"props":3017,"children":3018},{"class":319,"line":644},[3019,3024,3028,3032,3036],{"type":154,"tag":317,"props":3020,"children":3021},{"style":340},[3022],{"type":164,"value":3023}," placeholder-class",{"type":154,"tag":317,"props":3025,"children":3026},{"style":324},[3027],{"type":164,"value":348},{"type":154,"tag":317,"props":3029,"children":3030},{"style":324},[3031],{"type":164,"value":353},{"type":154,"tag":317,"props":3033,"children":3034},{"style":356},[3035],{"type":164,"value":1026},{"type":154,"tag":317,"props":3037,"children":3038},{"style":324},[3039],{"type":164,"value":364},{"type":154,"tag":317,"props":3041,"children":3042},{"class":319,"line":674},[3043],{"type":154,"tag":317,"props":3044,"children":3045},{"style":397},[3046],{"type":164,"value":400},{"type":154,"tag":317,"props":3048,"children":3049},{"class":319,"line":704},[3050],{"type":154,"tag":317,"props":3051,"children":3052},{"emptyLinePlaceholder":1448},[3053],{"type":164,"value":1451},{"type":154,"tag":317,"props":3055,"children":3056},{"class":319,"line":740},[3057],{"type":154,"tag":317,"props":3058,"children":3059},{"style":397},[3060],{"type":164,"value":3061},"\u003C!-- Apply a dynamic class to the original image -->\n",{"type":154,"tag":317,"props":3063,"children":3064},{"class":319,"line":753},[3065],{"type":154,"tag":317,"props":3066,"children":3067},{"style":397},[3068],{"type":164,"value":3069},"\u003CNuxtImg\n",{"type":154,"tag":317,"props":3071,"children":3072},{"class":319,"line":1399},[3073],{"type":154,"tag":317,"props":3074,"children":3075},{"style":397},[3076],{"type":164,"value":3077}," src=\"/nuxt.png\"\n",{"type":154,"tag":317,"props":3079,"children":3080},{"class":319,"line":1408},[3081],{"type":154,"tag":317,"props":3082,"children":3083},{"style":397},[3084],{"type":164,"value":3015},{"type":154,"tag":317,"props":3086,"children":3087},{"class":319,"line":1417},[3088],{"type":154,"tag":317,"props":3089,"children":3090},{"style":397},[3091],{"type":164,"value":3092}," :placeholder-class=\"custom\"\n",{"type":154,"tag":317,"props":3094,"children":3095},{"class":319,"line":1426},[3096],{"type":154,"tag":317,"props":3097,"children":3098},{"style":397},[3099],{"type":164,"value":400},{"type":154,"tag":228,"props":3101,"children":3102},{},[3103,3115],{"type":154,"tag":155,"props":3104,"children":3105},{},[3106,3108,3113],{"type":164,"value":3107},"If you need to apply some CSS to only the ",{"type":154,"tag":1718,"props":3109,"children":3110},{},[3111],{"type":164,"value":3112},"loaded",{"type":164,"value":3114}," image you can do so with something like:",{"type":154,"tag":307,"props":3116,"children":3120},{"className":3117,"code":3118,"language":3119,"meta":142,"style":142},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","img:not(.my-placeholder-class) {\n /* styles here */\n}\n","css",[3121],{"type":154,"tag":159,"props":3122,"children":3123},{"__ignoreMap":142},[3124,3160,3168],{"type":154,"tag":317,"props":3125,"children":3126},{"class":319,"line":320},[3127,3132,3136,3141,3146,3151,3155],{"type":154,"tag":317,"props":3128,"children":3130},{"style":3129},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[3131],{"type":164,"value":531},{"type":154,"tag":317,"props":3133,"children":3134},{"style":324},[3135],{"type":164,"value":621},{"type":154,"tag":317,"props":3137,"children":3138},{"style":340},[3139],{"type":164,"value":3140},"not",{"type":154,"tag":317,"props":3142,"children":3143},{"style":324},[3144],{"type":164,"value":3145},"(.",{"type":154,"tag":317,"props":3147,"children":3148},{"style":3129},[3149],{"type":164,"value":3150},"my-placeholder-class",{"type":154,"tag":317,"props":3152,"children":3153},{"style":324},[3154],{"type":164,"value":1682},{"type":154,"tag":317,"props":3156,"children":3157},{"style":324},[3158],{"type":164,"value":3159}," {\n",{"type":154,"tag":317,"props":3161,"children":3162},{"class":319,"line":336},[3163],{"type":154,"tag":317,"props":3164,"children":3165},{"style":2215},[3166],{"type":164,"value":3167}," /* styles here */\n",{"type":154,"tag":317,"props":3169,"children":3170},{"class":319,"line":367},[3171],{"type":154,"tag":317,"props":3172,"children":3173},{"style":324},[3174],{"type":164,"value":3175},"}\n",{"type":154,"tag":292,"props":3177,"children":3179},{"id":3178},"provider",[3180],{"type":154,"tag":159,"props":3181,"children":3183},{"className":3182},[],[3184],{"type":164,"value":3178},{"type":154,"tag":155,"props":3186,"children":3187},{},[3188,3190,3196,3198],{"type":164,"value":3189},"Use other provider instead of default ",{"type":154,"tag":188,"props":3191,"children":3193},{"href":3192},"/get-started/configuration#provider",[3194],{"type":164,"value":3195},"provider option",{"type":164,"value":3197}," specified in ",{"type":154,"tag":159,"props":3199,"children":3201},{"className":3200},[],[3202],{"type":164,"value":3203},"nuxt.config",{"type":154,"tag":155,"props":3205,"children":3206},{},[3207],{"type":154,"tag":538,"props":3208,"children":3209},{},[3210],{"type":164,"value":542},{"type":154,"tag":3212,"props":3213,"children":3214},"code-group",{},[3215,3370],{"type":154,"tag":307,"props":3216,"children":3219},{"className":309,"code":3217,"filename":3218,"language":311,"meta":142,"style":142},"\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",[3220],{"type":154,"tag":159,"props":3221,"children":3222},{"__ignoreMap":142},[3223,3238,3249,3274,3298,3323,3348,3355],{"type":154,"tag":317,"props":3224,"children":3225},{"class":319,"line":320},[3226,3230,3234],{"type":154,"tag":317,"props":3227,"children":3228},{"style":324},[3229],{"type":164,"value":327},{"type":154,"tag":317,"props":3231,"children":3232},{"style":330},[3233],{"type":164,"value":2641},{"type":154,"tag":317,"props":3235,"children":3236},{"style":324},[3237],{"type":164,"value":989},{"type":154,"tag":317,"props":3239,"children":3240},{"class":319,"line":336},[3241,3245],{"type":154,"tag":317,"props":3242,"children":3243},{"style":324},[3244],{"type":164,"value":2653},{"type":154,"tag":317,"props":3246,"children":3247},{"style":330},[3248],{"type":164,"value":1202},{"type":154,"tag":317,"props":3250,"children":3251},{"class":319,"line":367},[3252,3257,3261,3265,3270],{"type":154,"tag":317,"props":3253,"children":3254},{"style":340},[3255],{"type":164,"value":3256}," provider",{"type":154,"tag":317,"props":3258,"children":3259},{"style":324},[3260],{"type":164,"value":348},{"type":154,"tag":317,"props":3262,"children":3263},{"style":324},[3264],{"type":164,"value":353},{"type":154,"tag":317,"props":3266,"children":3267},{"style":356},[3268],{"type":164,"value":3269},"cloudinary",{"type":154,"tag":317,"props":3271,"children":3272},{"style":324},[3273],{"type":164,"value":364},{"type":154,"tag":317,"props":3275,"children":3276},{"class":319,"line":393},[3277,3281,3285,3289,3294],{"type":154,"tag":317,"props":3278,"children":3279},{"style":340},[3280],{"type":164,"value":2665},{"type":154,"tag":317,"props":3282,"children":3283},{"style":324},[3284],{"type":164,"value":348},{"type":154,"tag":317,"props":3286,"children":3287},{"style":324},[3288],{"type":164,"value":353},{"type":154,"tag":317,"props":3290,"children":3291},{"style":356},[3292],{"type":164,"value":3293},"/remote/nuxt-org/blog/going-full-static/main.png",{"type":154,"tag":317,"props":3295,"children":3296},{"style":324},[3297],{"type":164,"value":364},{"type":154,"tag":317,"props":3299,"children":3300},{"class":319,"line":644},[3301,3306,3310,3314,3319],{"type":154,"tag":317,"props":3302,"children":3303},{"style":340},[3304],{"type":164,"value":3305}," width",{"type":154,"tag":317,"props":3307,"children":3308},{"style":324},[3309],{"type":164,"value":348},{"type":154,"tag":317,"props":3311,"children":3312},{"style":324},[3313],{"type":164,"value":353},{"type":154,"tag":317,"props":3315,"children":3316},{"style":356},[3317],{"type":164,"value":3318},"300",{"type":154,"tag":317,"props":3320,"children":3321},{"style":324},[3322],{"type":164,"value":364},{"type":154,"tag":317,"props":3324,"children":3325},{"class":319,"line":674},[3326,3331,3335,3339,3344],{"type":154,"tag":317,"props":3327,"children":3328},{"style":340},[3329],{"type":164,"value":3330}," height",{"type":154,"tag":317,"props":3332,"children":3333},{"style":324},[3334],{"type":164,"value":348},{"type":154,"tag":317,"props":3336,"children":3337},{"style":324},[3338],{"type":164,"value":353},{"type":154,"tag":317,"props":3340,"children":3341},{"style":356},[3342],{"type":164,"value":3343},"169",{"type":154,"tag":317,"props":3345,"children":3346},{"style":324},[3347],{"type":164,"value":364},{"type":154,"tag":317,"props":3349,"children":3350},{"class":319,"line":704},[3351],{"type":154,"tag":317,"props":3352,"children":3353},{"style":324},[3354],{"type":164,"value":2823},{"type":154,"tag":317,"props":3356,"children":3357},{"class":319,"line":740},[3358,3362,3366],{"type":154,"tag":317,"props":3359,"children":3360},{"style":324},[3361],{"type":164,"value":1512},{"type":154,"tag":317,"props":3363,"children":3364},{"style":330},[3365],{"type":164,"value":2641},{"type":154,"tag":317,"props":3367,"children":3368},{"style":324},[3369],{"type":164,"value":989},{"type":154,"tag":307,"props":3371,"children":3375},{"className":3372,"code":3373,"filename":3374,"language":2880,"meta":142,"style":142},"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",[3376],{"type":154,"tag":159,"props":3377,"children":3378},{"__ignoreMap":142},[3379,3406,3422,3438,3463,3471,3479],{"type":154,"tag":317,"props":3380,"children":3381},{"class":319,"line":320},[3382,3388,3393,3398,3402],{"type":154,"tag":317,"props":3383,"children":3385},{"style":3384},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[3386],{"type":164,"value":3387},"export",{"type":154,"tag":317,"props":3389,"children":3390},{"style":3384},[3391],{"type":164,"value":3392}," default",{"type":154,"tag":317,"props":3394,"children":3395},{"style":2705},[3396],{"type":164,"value":3397}," defineNuxtConfig",{"type":154,"tag":317,"props":3399,"children":3400},{"style":397},[3401],{"type":164,"value":2712},{"type":154,"tag":317,"props":3403,"children":3404},{"style":324},[3405],{"type":164,"value":608},{"type":154,"tag":317,"props":3407,"children":3408},{"class":319,"line":336},[3409,3414,3418],{"type":154,"tag":317,"props":3410,"children":3411},{"style":330},[3412],{"type":164,"value":3413}," image",{"type":154,"tag":317,"props":3415,"children":3416},{"style":324},[3417],{"type":164,"value":621},{"type":154,"tag":317,"props":3419,"children":3420},{"style":324},[3421],{"type":164,"value":3159},{"type":154,"tag":317,"props":3423,"children":3424},{"class":319,"line":367},[3425,3430,3434],{"type":154,"tag":317,"props":3426,"children":3427},{"style":330},[3428],{"type":164,"value":3429}," cloudinary",{"type":154,"tag":317,"props":3431,"children":3432},{"style":324},[3433],{"type":164,"value":621},{"type":154,"tag":317,"props":3435,"children":3436},{"style":324},[3437],{"type":164,"value":3159},{"type":154,"tag":317,"props":3439,"children":3440},{"class":319,"line":393},[3441,3446,3450,3454,3459],{"type":154,"tag":317,"props":3442,"children":3443},{"style":330},[3444],{"type":164,"value":3445}," baseURL",{"type":154,"tag":317,"props":3447,"children":3448},{"style":324},[3449],{"type":164,"value":621},{"type":154,"tag":317,"props":3451,"children":3452},{"style":324},[3453],{"type":164,"value":626},{"type":154,"tag":317,"props":3455,"children":3456},{"style":356},[3457],{"type":164,"value":3458},"https://res.cloudinary.com/nuxt/image/upload",{"type":154,"tag":317,"props":3460,"children":3461},{"style":324},[3462],{"type":164,"value":737},{"type":154,"tag":317,"props":3464,"children":3465},{"class":319,"line":644},[3466],{"type":154,"tag":317,"props":3467,"children":3468},{"style":324},[3469],{"type":164,"value":3470}," }\n",{"type":154,"tag":317,"props":3472,"children":3473},{"class":319,"line":674},[3474],{"type":154,"tag":317,"props":3475,"children":3476},{"style":324},[3477],{"type":164,"value":3478}," }\n",{"type":154,"tag":317,"props":3480,"children":3481},{"class":319,"line":704},[3482,3486],{"type":154,"tag":317,"props":3483,"children":3484},{"style":324},[3485],{"type":164,"value":1377},{"type":154,"tag":317,"props":3487,"children":3488},{"style":397},[3489],{"type":164,"value":3490},")\n",{"type":154,"tag":292,"props":3492,"children":3494},{"id":3493},"preset",[3495],{"type":154,"tag":159,"props":3496,"children":3498},{"className":3497},[],[3499],{"type":164,"value":3493},{"type":154,"tag":155,"props":3501,"children":3502},{},[3503],{"type":164,"value":3504},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",{"type":154,"tag":228,"props":3506,"children":3507},{},[3508],{"type":154,"tag":155,"props":3509,"children":3510},{},[3511,3513,3519,3521],{"type":164,"value":3512},"We can define presets using ",{"type":154,"tag":188,"props":3514,"children":3516},{"href":3515},"/get-started/configuration#presets",[3517],{"type":164,"value":3518},"presets options",{"type":164,"value":3520}," in ",{"type":154,"tag":159,"props":3522,"children":3524},{"className":3523},[],[3525],{"type":164,"value":3203},{"type":154,"tag":3212,"props":3527,"children":3528},{},[3529,3623],{"type":154,"tag":307,"props":3530,"children":3532},{"className":309,"code":3531,"filename":3218,"language":311,"meta":142,"style":142},"\u003Ctemplate>\n \u003CNuxtImg preset=\"cover\" src=\"/nuxt-icon.png\" />\n\u003C/template>\n",[3533],{"type":154,"tag":159,"props":3534,"children":3535},{"__ignoreMap":142},[3536,3551,3608],{"type":154,"tag":317,"props":3537,"children":3538},{"class":319,"line":320},[3539,3543,3547],{"type":154,"tag":317,"props":3540,"children":3541},{"style":324},[3542],{"type":164,"value":327},{"type":154,"tag":317,"props":3544,"children":3545},{"style":330},[3546],{"type":164,"value":2641},{"type":154,"tag":317,"props":3548,"children":3549},{"style":324},[3550],{"type":164,"value":989},{"type":154,"tag":317,"props":3552,"children":3553},{"class":319,"line":336},[3554,3558,3562,3567,3571,3575,3580,3584,3588,3592,3596,3600,3604],{"type":154,"tag":317,"props":3555,"children":3556},{"style":324},[3557],{"type":164,"value":2653},{"type":154,"tag":317,"props":3559,"children":3560},{"style":330},[3561],{"type":164,"value":913},{"type":154,"tag":317,"props":3563,"children":3564},{"style":340},[3565],{"type":164,"value":3566}," preset",{"type":154,"tag":317,"props":3568,"children":3569},{"style":324},[3570],{"type":164,"value":348},{"type":154,"tag":317,"props":3572,"children":3573},{"style":324},[3574],{"type":164,"value":353},{"type":154,"tag":317,"props":3576,"children":3577},{"style":356},[3578],{"type":164,"value":3579},"cover",{"type":154,"tag":317,"props":3581,"children":3582},{"style":324},[3583],{"type":164,"value":353},{"type":154,"tag":317,"props":3585,"children":3586},{"style":340},[3587],{"type":164,"value":918},{"type":154,"tag":317,"props":3589,"children":3590},{"style":324},[3591],{"type":164,"value":348},{"type":154,"tag":317,"props":3593,"children":3594},{"style":324},[3595],{"type":164,"value":353},{"type":154,"tag":317,"props":3597,"children":3598},{"style":356},[3599],{"type":164,"value":386},{"type":154,"tag":317,"props":3601,"children":3602},{"style":324},[3603],{"type":164,"value":353},{"type":154,"tag":317,"props":3605,"children":3606},{"style":324},[3607],{"type":164,"value":939},{"type":154,"tag":317,"props":3609,"children":3610},{"class":319,"line":367},[3611,3615,3619],{"type":154,"tag":317,"props":3612,"children":3613},{"style":324},[3614],{"type":164,"value":1512},{"type":154,"tag":317,"props":3616,"children":3617},{"style":330},[3618],{"type":164,"value":2641},{"type":154,"tag":317,"props":3620,"children":3621},{"style":324},[3622],{"type":164,"value":989},{"type":154,"tag":307,"props":3624,"children":3626},{"className":3372,"code":3625,"filename":3374,"language":2880,"meta":142,"style":142},"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",[3627],{"type":154,"tag":159,"props":3628,"children":3629},{"__ignoreMap":142},[3630,3653,3668,3684,3700,3716,3744,3772,3793,3810,3818,3826,3833,3840],{"type":154,"tag":317,"props":3631,"children":3632},{"class":319,"line":320},[3633,3637,3641,3645,3649],{"type":154,"tag":317,"props":3634,"children":3635},{"style":3384},[3636],{"type":164,"value":3387},{"type":154,"tag":317,"props":3638,"children":3639},{"style":3384},[3640],{"type":164,"value":3392},{"type":154,"tag":317,"props":3642,"children":3643},{"style":2705},[3644],{"type":164,"value":3397},{"type":154,"tag":317,"props":3646,"children":3647},{"style":397},[3648],{"type":164,"value":2712},{"type":154,"tag":317,"props":3650,"children":3651},{"style":324},[3652],{"type":164,"value":608},{"type":154,"tag":317,"props":3654,"children":3655},{"class":319,"line":336},[3656,3660,3664],{"type":154,"tag":317,"props":3657,"children":3658},{"style":330},[3659],{"type":164,"value":3413},{"type":154,"tag":317,"props":3661,"children":3662},{"style":324},[3663],{"type":164,"value":621},{"type":154,"tag":317,"props":3665,"children":3666},{"style":324},[3667],{"type":164,"value":3159},{"type":154,"tag":317,"props":3669,"children":3670},{"class":319,"line":367},[3671,3676,3680],{"type":154,"tag":317,"props":3672,"children":3673},{"style":330},[3674],{"type":164,"value":3675}," presets",{"type":154,"tag":317,"props":3677,"children":3678},{"style":324},[3679],{"type":164,"value":621},{"type":154,"tag":317,"props":3681,"children":3682},{"style":324},[3683],{"type":164,"value":3159},{"type":154,"tag":317,"props":3685,"children":3686},{"class":319,"line":393},[3687,3692,3696],{"type":154,"tag":317,"props":3688,"children":3689},{"style":330},[3690],{"type":164,"value":3691}," cover",{"type":154,"tag":317,"props":3693,"children":3694},{"style":324},[3695],{"type":164,"value":621},{"type":154,"tag":317,"props":3697,"children":3698},{"style":324},[3699],{"type":164,"value":3159},{"type":154,"tag":317,"props":3701,"children":3702},{"class":319,"line":644},[3703,3708,3712],{"type":154,"tag":317,"props":3704,"children":3705},{"style":330},[3706],{"type":164,"value":3707}," modifiers",{"type":154,"tag":317,"props":3709,"children":3710},{"style":324},[3711],{"type":164,"value":621},{"type":154,"tag":317,"props":3713,"children":3714},{"style":324},[3715],{"type":164,"value":3159},{"type":154,"tag":317,"props":3717,"children":3718},{"class":319,"line":674},[3719,3724,3728,3732,3736,3740],{"type":154,"tag":317,"props":3720,"children":3721},{"style":330},[3722],{"type":164,"value":3723}," fit",{"type":154,"tag":317,"props":3725,"children":3726},{"style":324},[3727],{"type":164,"value":621},{"type":154,"tag":317,"props":3729,"children":3730},{"style":324},[3731],{"type":164,"value":626},{"type":154,"tag":317,"props":3733,"children":3734},{"style":356},[3735],{"type":164,"value":3579},{"type":154,"tag":317,"props":3737,"children":3738},{"style":324},[3739],{"type":164,"value":636},{"type":154,"tag":317,"props":3741,"children":3742},{"style":324},[3743],{"type":164,"value":641},{"type":154,"tag":317,"props":3745,"children":3746},{"class":319,"line":704},[3747,3752,3756,3760,3764,3768],{"type":154,"tag":317,"props":3748,"children":3749},{"style":330},[3750],{"type":164,"value":3751}," format",{"type":154,"tag":317,"props":3753,"children":3754},{"style":324},[3755],{"type":164,"value":621},{"type":154,"tag":317,"props":3757,"children":3758},{"style":324},[3759],{"type":164,"value":626},{"type":154,"tag":317,"props":3761,"children":3762},{"style":356},[3763],{"type":164,"value":431},{"type":154,"tag":317,"props":3765,"children":3766},{"style":324},[3767],{"type":164,"value":636},{"type":154,"tag":317,"props":3769,"children":3770},{"style":324},[3771],{"type":164,"value":641},{"type":154,"tag":317,"props":3773,"children":3774},{"class":319,"line":740},[3775,3780,3784,3789],{"type":154,"tag":317,"props":3776,"children":3777},{"style":330},[3778],{"type":164,"value":3779}," width",{"type":154,"tag":317,"props":3781,"children":3782},{"style":324},[3783],{"type":164,"value":621},{"type":154,"tag":317,"props":3785,"children":3786},{"style":2329},[3787],{"type":164,"value":3788}," 300",{"type":154,"tag":317,"props":3790,"children":3791},{"style":324},[3792],{"type":164,"value":641},{"type":154,"tag":317,"props":3794,"children":3795},{"class":319,"line":753},[3796,3801,3805],{"type":154,"tag":317,"props":3797,"children":3798},{"style":330},[3799],{"type":164,"value":3800}," height",{"type":154,"tag":317,"props":3802,"children":3803},{"style":324},[3804],{"type":164,"value":621},{"type":154,"tag":317,"props":3806,"children":3807},{"style":2329},[3808],{"type":164,"value":3809}," 300\n",{"type":154,"tag":317,"props":3811,"children":3812},{"class":319,"line":1399},[3813],{"type":154,"tag":317,"props":3814,"children":3815},{"style":324},[3816],{"type":164,"value":3817}," }\n",{"type":154,"tag":317,"props":3819,"children":3820},{"class":319,"line":1408},[3821],{"type":154,"tag":317,"props":3822,"children":3823},{"style":324},[3824],{"type":164,"value":3825}," }\n",{"type":154,"tag":317,"props":3827,"children":3828},{"class":319,"line":1417},[3829],{"type":154,"tag":317,"props":3830,"children":3831},{"style":324},[3832],{"type":164,"value":3470},{"type":154,"tag":317,"props":3834,"children":3835},{"class":319,"line":1426},[3836],{"type":154,"tag":317,"props":3837,"children":3838},{"style":324},[3839],{"type":164,"value":3478},{"type":154,"tag":317,"props":3841,"children":3842},{"class":319,"line":1435},[3843,3847],{"type":154,"tag":317,"props":3844,"children":3845},{"style":324},[3846],{"type":164,"value":1377},{"type":154,"tag":317,"props":3848,"children":3849},{"style":397},[3850],{"type":164,"value":3490},{"type":154,"tag":292,"props":3852,"children":3853},{"id":294},[3854],{"type":154,"tag":159,"props":3855,"children":3857},{"className":3856},[],[3858],{"type":164,"value":294},{"type":154,"tag":155,"props":3860,"children":3861},{},[3862],{"type":164,"value":3863},"In case you want to serve images in a specific format, use this prop.",{"type":154,"tag":307,"props":3865,"children":3867},{"className":309,"code":3866,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n format=\"webp\"\n src=\"/nuxt-icon.png\"\n/>\n",[3868],{"type":154,"tag":159,"props":3869,"children":3870},{"__ignoreMap":142},[3871,3882,3905,3928],{"type":154,"tag":317,"props":3872,"children":3873},{"class":319,"line":320},[3874,3878],{"type":154,"tag":317,"props":3875,"children":3876},{"style":324},[3877],{"type":164,"value":327},{"type":154,"tag":317,"props":3879,"children":3880},{"style":330},[3881],{"type":164,"value":1202},{"type":154,"tag":317,"props":3883,"children":3884},{"class":319,"line":336},[3885,3889,3893,3897,3901],{"type":154,"tag":317,"props":3886,"children":3887},{"style":340},[3888],{"type":164,"value":343},{"type":154,"tag":317,"props":3890,"children":3891},{"style":324},[3892],{"type":164,"value":348},{"type":154,"tag":317,"props":3894,"children":3895},{"style":324},[3896],{"type":164,"value":353},{"type":154,"tag":317,"props":3898,"children":3899},{"style":356},[3900],{"type":164,"value":204},{"type":154,"tag":317,"props":3902,"children":3903},{"style":324},[3904],{"type":164,"value":364},{"type":154,"tag":317,"props":3906,"children":3907},{"class":319,"line":367},[3908,3912,3916,3920,3924],{"type":154,"tag":317,"props":3909,"children":3910},{"style":340},[3911],{"type":164,"value":373},{"type":154,"tag":317,"props":3913,"children":3914},{"style":324},[3915],{"type":164,"value":348},{"type":154,"tag":317,"props":3917,"children":3918},{"style":324},[3919],{"type":164,"value":353},{"type":154,"tag":317,"props":3921,"children":3922},{"style":356},[3923],{"type":164,"value":386},{"type":154,"tag":317,"props":3925,"children":3926},{"style":324},[3927],{"type":164,"value":364},{"type":154,"tag":317,"props":3929,"children":3930},{"class":319,"line":393},[3931],{"type":154,"tag":317,"props":3932,"children":3933},{"style":397},[3934],{"type":164,"value":400},{"type":154,"tag":155,"props":3936,"children":3937},{},[3938,3939,3944,3945,3950,3951,3956,3957,3962,3963,3968,3969,3974,3975,3981],{"type":164,"value":405},{"type":154,"tag":159,"props":3940,"children":3942},{"className":3941},[],[3943],{"type":164,"value":204},{"type":164,"value":250},{"type":154,"tag":159,"props":3946,"children":3948},{"className":3947},[],[3949],{"type":164,"value":417},{"type":164,"value":250},{"type":154,"tag":159,"props":3952,"children":3954},{"className":3953},[],[3955],{"type":164,"value":424},{"type":164,"value":250},{"type":154,"tag":159,"props":3958,"children":3960},{"className":3959},[],[3961],{"type":164,"value":431},{"type":164,"value":250},{"type":154,"tag":159,"props":3964,"children":3966},{"className":3965},[],[3967],{"type":164,"value":438},{"type":164,"value":250},{"type":154,"tag":159,"props":3970,"children":3972},{"className":3971},[],[3973],{"type":164,"value":446},{"type":164,"value":835},{"type":154,"tag":159,"props":3976,"children":3978},{"className":3977},[],[3979],{"type":164,"value":3980},"svg",{"type":164,"value":448},{"type":154,"tag":292,"props":3983,"children":3985},{"id":3984},"quality",[3986],{"type":154,"tag":159,"props":3987,"children":3989},{"className":3988},[],[3990],{"type":164,"value":3984},{"type":154,"tag":155,"props":3992,"children":3993},{},[3994],{"type":164,"value":3995},"The quality for the generated image(s).",{"type":154,"tag":307,"props":3997,"children":3999},{"className":309,"code":3998,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/nuxt.jpg\"\n quality=\"80\"\n width=\"200\"\n height=\"100\"\n/>\n",[4000],{"type":154,"tag":159,"props":4001,"children":4002},{"__ignoreMap":142},[4003,4014,4038,4063,4087,4111],{"type":154,"tag":317,"props":4004,"children":4005},{"class":319,"line":320},[4006,4010],{"type":154,"tag":317,"props":4007,"children":4008},{"style":324},[4009],{"type":164,"value":327},{"type":154,"tag":317,"props":4011,"children":4012},{"style":330},[4013],{"type":164,"value":1202},{"type":154,"tag":317,"props":4015,"children":4016},{"class":319,"line":336},[4017,4021,4025,4029,4034],{"type":154,"tag":317,"props":4018,"children":4019},{"style":340},[4020],{"type":164,"value":373},{"type":154,"tag":317,"props":4022,"children":4023},{"style":324},[4024],{"type":164,"value":348},{"type":154,"tag":317,"props":4026,"children":4027},{"style":324},[4028],{"type":164,"value":353},{"type":154,"tag":317,"props":4030,"children":4031},{"style":356},[4032],{"type":164,"value":4033},"/nuxt.jpg",{"type":154,"tag":317,"props":4035,"children":4036},{"style":324},[4037],{"type":164,"value":364},{"type":154,"tag":317,"props":4039,"children":4040},{"class":319,"line":367},[4041,4046,4050,4054,4059],{"type":154,"tag":317,"props":4042,"children":4043},{"style":340},[4044],{"type":164,"value":4045}," quality",{"type":154,"tag":317,"props":4047,"children":4048},{"style":324},[4049],{"type":164,"value":348},{"type":154,"tag":317,"props":4051,"children":4052},{"style":324},[4053],{"type":164,"value":353},{"type":154,"tag":317,"props":4055,"children":4056},{"style":356},[4057],{"type":164,"value":4058},"80",{"type":154,"tag":317,"props":4060,"children":4061},{"style":324},[4062],{"type":164,"value":364},{"type":154,"tag":317,"props":4064,"children":4065},{"class":319,"line":393},[4066,4070,4074,4078,4083],{"type":154,"tag":317,"props":4067,"children":4068},{"style":340},[4069],{"type":164,"value":1259},{"type":154,"tag":317,"props":4071,"children":4072},{"style":324},[4073],{"type":164,"value":348},{"type":154,"tag":317,"props":4075,"children":4076},{"style":324},[4077],{"type":164,"value":353},{"type":154,"tag":317,"props":4079,"children":4080},{"style":356},[4081],{"type":164,"value":4082},"200",{"type":154,"tag":317,"props":4084,"children":4085},{"style":324},[4086],{"type":164,"value":364},{"type":154,"tag":317,"props":4088,"children":4089},{"class":319,"line":644},[4090,4094,4098,4102,4107],{"type":154,"tag":317,"props":4091,"children":4092},{"style":340},[4093],{"type":164,"value":1284},{"type":154,"tag":317,"props":4095,"children":4096},{"style":324},[4097],{"type":164,"value":348},{"type":154,"tag":317,"props":4099,"children":4100},{"style":324},[4101],{"type":164,"value":353},{"type":154,"tag":317,"props":4103,"children":4104},{"style":356},[4105],{"type":164,"value":4106},"100",{"type":154,"tag":317,"props":4108,"children":4109},{"style":324},[4110],{"type":164,"value":364},{"type":154,"tag":317,"props":4112,"children":4113},{"class":319,"line":674},[4114],{"type":154,"tag":317,"props":4115,"children":4116},{"style":397},[4117],{"type":164,"value":400},{"type":154,"tag":292,"props":4119,"children":4121},{"id":4120},"fit",[4122],{"type":154,"tag":159,"props":4123,"children":4125},{"className":4124},[],[4126],{"type":164,"value":4120},{"type":154,"tag":155,"props":4128,"children":4129},{},[4130,4131,4136],{"type":164,"value":1037},{"type":154,"tag":159,"props":4132,"children":4134},{"className":4133},[],[4135],{"type":164,"value":4120},{"type":164,"value":4137}," property specifies the size of the images.\nThere are five standard values you can use with this property.",{"type":154,"tag":465,"props":4139,"children":4140},{},[4141,4151,4162,4173,4184],{"type":154,"tag":469,"props":4142,"children":4143},{},[4144,4149],{"type":154,"tag":159,"props":4145,"children":4147},{"className":4146},[],[4148],{"type":164,"value":3579},{"type":164,"value":4150},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping/clipping to fit",{"type":154,"tag":469,"props":4152,"children":4153},{},[4154,4160],{"type":154,"tag":159,"props":4155,"children":4157},{"className":4156},[],[4158],{"type":164,"value":4159},"contain",{"type":164,"value":4161},": Preserving aspect ratio, contain within both provided dimensions using 'letterboxing' where necessary.",{"type":154,"tag":469,"props":4163,"children":4164},{},[4165,4171],{"type":154,"tag":159,"props":4166,"children":4168},{"className":4167},[],[4169],{"type":164,"value":4170},"fill",{"type":164,"value":4172},": Ignore the aspect ratio of the input and stretch to both provided dimensions.",{"type":154,"tag":469,"props":4174,"children":4175},{},[4176,4182],{"type":154,"tag":159,"props":4177,"children":4179},{"className":4178},[],[4180],{"type":164,"value":4181},"inside",{"type":164,"value":4183},": 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":154,"tag":469,"props":4185,"children":4186},{},[4187,4193],{"type":154,"tag":159,"props":4188,"children":4190},{"className":4189},[],[4191],{"type":164,"value":4192},"outside",{"type":164,"value":4194},": 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":154,"tag":307,"props":4196,"children":4198},{"className":309,"code":4197,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n fit=\"cover\"\n src=\"/nuxt-icon.png\"\n width=\"200\"\n height=\"100\"\n/>\n",[4199],{"type":154,"tag":159,"props":4200,"children":4201},{"__ignoreMap":142},[4202,4213,4237,4260,4283,4306],{"type":154,"tag":317,"props":4203,"children":4204},{"class":319,"line":320},[4205,4209],{"type":154,"tag":317,"props":4206,"children":4207},{"style":324},[4208],{"type":164,"value":327},{"type":154,"tag":317,"props":4210,"children":4211},{"style":330},[4212],{"type":164,"value":1202},{"type":154,"tag":317,"props":4214,"children":4215},{"class":319,"line":336},[4216,4221,4225,4229,4233],{"type":154,"tag":317,"props":4217,"children":4218},{"style":340},[4219],{"type":164,"value":4220}," fit",{"type":154,"tag":317,"props":4222,"children":4223},{"style":324},[4224],{"type":164,"value":348},{"type":154,"tag":317,"props":4226,"children":4227},{"style":324},[4228],{"type":164,"value":353},{"type":154,"tag":317,"props":4230,"children":4231},{"style":356},[4232],{"type":164,"value":3579},{"type":154,"tag":317,"props":4234,"children":4235},{"style":324},[4236],{"type":164,"value":364},{"type":154,"tag":317,"props":4238,"children":4239},{"class":319,"line":367},[4240,4244,4248,4252,4256],{"type":154,"tag":317,"props":4241,"children":4242},{"style":340},[4243],{"type":164,"value":373},{"type":154,"tag":317,"props":4245,"children":4246},{"style":324},[4247],{"type":164,"value":348},{"type":154,"tag":317,"props":4249,"children":4250},{"style":324},[4251],{"type":164,"value":353},{"type":154,"tag":317,"props":4253,"children":4254},{"style":356},[4255],{"type":164,"value":386},{"type":154,"tag":317,"props":4257,"children":4258},{"style":324},[4259],{"type":164,"value":364},{"type":154,"tag":317,"props":4261,"children":4262},{"class":319,"line":393},[4263,4267,4271,4275,4279],{"type":154,"tag":317,"props":4264,"children":4265},{"style":340},[4266],{"type":164,"value":1259},{"type":154,"tag":317,"props":4268,"children":4269},{"style":324},[4270],{"type":164,"value":348},{"type":154,"tag":317,"props":4272,"children":4273},{"style":324},[4274],{"type":164,"value":353},{"type":154,"tag":317,"props":4276,"children":4277},{"style":356},[4278],{"type":164,"value":4082},{"type":154,"tag":317,"props":4280,"children":4281},{"style":324},[4282],{"type":164,"value":364},{"type":154,"tag":317,"props":4284,"children":4285},{"class":319,"line":644},[4286,4290,4294,4298,4302],{"type":154,"tag":317,"props":4287,"children":4288},{"style":340},[4289],{"type":164,"value":1284},{"type":154,"tag":317,"props":4291,"children":4292},{"style":324},[4293],{"type":164,"value":348},{"type":154,"tag":317,"props":4295,"children":4296},{"style":324},[4297],{"type":164,"value":353},{"type":154,"tag":317,"props":4299,"children":4300},{"style":356},[4301],{"type":164,"value":4106},{"type":154,"tag":317,"props":4303,"children":4304},{"style":324},[4305],{"type":164,"value":364},{"type":154,"tag":317,"props":4307,"children":4308},{"class":319,"line":674},[4309],{"type":154,"tag":317,"props":4310,"children":4311},{"style":397},[4312],{"type":164,"value":400},{"type":154,"tag":228,"props":4314,"children":4315},{},[4316],{"type":154,"tag":155,"props":4317,"children":4318},{},[4319],{"type":164,"value":4320},"Some providers support other values.",{"type":154,"tag":292,"props":4322,"children":4324},{"id":4323},"modifiers",[4325],{"type":154,"tag":159,"props":4326,"children":4328},{"className":4327},[],[4329],{"type":164,"value":4323},{"type":154,"tag":155,"props":4331,"children":4332},{},[4333],{"type":164,"value":4334},"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":154,"tag":155,"props":4336,"children":4337},{},[4338,4340,4345],{"type":164,"value":4339},"Using the ",{"type":154,"tag":159,"props":4341,"children":4343},{"className":4342},[],[4344],{"type":164,"value":4323},{"type":164,"value":4346}," prop lets you use any of these transformations.",{"type":154,"tag":155,"props":4348,"children":4349},{},[4350],{"type":154,"tag":538,"props":4351,"children":4352},{},[4353],{"type":164,"value":542},{"type":154,"tag":307,"props":4355,"children":4357},{"className":309,"code":4356,"language":311,"meta":142,"style":142},"\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",[4358],{"type":154,"tag":159,"props":4359,"children":4360},{"__ignoreMap":142},[4361,4372,4396,4419,4442,4465,4519],{"type":154,"tag":317,"props":4362,"children":4363},{"class":319,"line":320},[4364,4368],{"type":154,"tag":317,"props":4365,"children":4366},{"style":324},[4367],{"type":164,"value":327},{"type":154,"tag":317,"props":4369,"children":4370},{"style":330},[4371],{"type":164,"value":1202},{"type":154,"tag":317,"props":4373,"children":4374},{"class":319,"line":336},[4375,4380,4384,4388,4392],{"type":154,"tag":317,"props":4376,"children":4377},{"style":340},[4378],{"type":164,"value":4379}," provider",{"type":154,"tag":317,"props":4381,"children":4382},{"style":324},[4383],{"type":164,"value":348},{"type":154,"tag":317,"props":4385,"children":4386},{"style":324},[4387],{"type":164,"value":353},{"type":154,"tag":317,"props":4389,"children":4390},{"style":356},[4391],{"type":164,"value":3269},{"type":154,"tag":317,"props":4393,"children":4394},{"style":324},[4395],{"type":164,"value":364},{"type":154,"tag":317,"props":4397,"children":4398},{"class":319,"line":367},[4399,4403,4407,4411,4415],{"type":154,"tag":317,"props":4400,"children":4401},{"style":340},[4402],{"type":164,"value":373},{"type":154,"tag":317,"props":4404,"children":4405},{"style":324},[4406],{"type":164,"value":348},{"type":154,"tag":317,"props":4408,"children":4409},{"style":324},[4410],{"type":164,"value":353},{"type":154,"tag":317,"props":4412,"children":4413},{"style":356},[4414],{"type":164,"value":3293},{"type":154,"tag":317,"props":4416,"children":4417},{"style":324},[4418],{"type":164,"value":364},{"type":154,"tag":317,"props":4420,"children":4421},{"class":319,"line":393},[4422,4426,4430,4434,4438],{"type":154,"tag":317,"props":4423,"children":4424},{"style":340},[4425],{"type":164,"value":1259},{"type":154,"tag":317,"props":4427,"children":4428},{"style":324},[4429],{"type":164,"value":348},{"type":154,"tag":317,"props":4431,"children":4432},{"style":324},[4433],{"type":164,"value":353},{"type":154,"tag":317,"props":4435,"children":4436},{"style":356},[4437],{"type":164,"value":3318},{"type":154,"tag":317,"props":4439,"children":4440},{"style":324},[4441],{"type":164,"value":364},{"type":154,"tag":317,"props":4443,"children":4444},{"class":319,"line":644},[4445,4449,4453,4457,4461],{"type":154,"tag":317,"props":4446,"children":4447},{"style":340},[4448],{"type":164,"value":1284},{"type":154,"tag":317,"props":4450,"children":4451},{"style":324},[4452],{"type":164,"value":348},{"type":154,"tag":317,"props":4454,"children":4455},{"style":324},[4456],{"type":164,"value":353},{"type":154,"tag":317,"props":4458,"children":4459},{"style":356},[4460],{"type":164,"value":3343},{"type":154,"tag":317,"props":4462,"children":4463},{"style":324},[4464],{"type":164,"value":364},{"type":154,"tag":317,"props":4466,"children":4467},{"class":319,"line":674},[4468,4472,4476,4480,4484,4488,4493,4497,4501,4506,4510,4515],{"type":154,"tag":317,"props":4469,"children":4470},{"style":324},[4471],{"type":164,"value":591},{"type":154,"tag":317,"props":4473,"children":4474},{"style":340},[4475],{"type":164,"value":4323},{"type":154,"tag":317,"props":4477,"children":4478},{"style":324},[4479],{"type":164,"value":348},{"type":154,"tag":317,"props":4481,"children":4482},{"style":324},[4483],{"type":164,"value":353},{"type":154,"tag":317,"props":4485,"children":4486},{"style":324},[4487],{"type":164,"value":1349},{"type":154,"tag":317,"props":4489,"children":4490},{"style":330},[4491],{"type":164,"value":4492}," roundCorner",{"type":154,"tag":317,"props":4494,"children":4495},{"style":324},[4496],{"type":164,"value":621},{"type":154,"tag":317,"props":4498,"children":4499},{"style":324},[4500],{"type":164,"value":626},{"type":154,"tag":317,"props":4502,"children":4503},{"style":356},[4504],{"type":164,"value":4505},"0:100",{"type":154,"tag":317,"props":4507,"children":4508},{"style":324},[4509],{"type":164,"value":636},{"type":154,"tag":317,"props":4511,"children":4512},{"style":324},[4513],{"type":164,"value":4514}," }",{"type":154,"tag":317,"props":4516,"children":4517},{"style":324},[4518],{"type":164,"value":364},{"type":154,"tag":317,"props":4520,"children":4521},{"class":319,"line":704},[4522],{"type":154,"tag":317,"props":4523,"children":4524},{"style":397},[4525],{"type":164,"value":400},{"type":154,"tag":292,"props":4527,"children":4529},{"id":4528},"preload",[4530],{"type":154,"tag":159,"props":4531,"children":4533},{"className":4532},[],[4534],{"type":164,"value":4528},{"type":154,"tag":155,"props":4536,"children":4537},{},[4538,4540,4546],{"type":164,"value":4539},"In case you want to preload the image, use this prop. This will place a corresponding ",{"type":154,"tag":159,"props":4541,"children":4543},{"className":4542},[],[4544],{"type":164,"value":4545},"link",{"type":164,"value":4547}," tag in the page's head.",{"type":154,"tag":307,"props":4549,"children":4551},{"className":309,"code":4550,"language":311,"meta":142,"style":142},"\u003CNuxtImg src=\"/nuxt-icon.png\" preload />\n",[4552],{"type":154,"tag":159,"props":4553,"children":4554},{"__ignoreMap":142},[4555],{"type":154,"tag":317,"props":4556,"children":4557},{"class":319,"line":320},[4558,4562,4566,4570,4574,4578,4582,4586,4591],{"type":154,"tag":317,"props":4559,"children":4560},{"style":324},[4561],{"type":164,"value":327},{"type":154,"tag":317,"props":4563,"children":4564},{"style":330},[4565],{"type":164,"value":913},{"type":154,"tag":317,"props":4567,"children":4568},{"style":340},[4569],{"type":164,"value":918},{"type":154,"tag":317,"props":4571,"children":4572},{"style":324},[4573],{"type":164,"value":348},{"type":154,"tag":317,"props":4575,"children":4576},{"style":324},[4577],{"type":164,"value":353},{"type":154,"tag":317,"props":4579,"children":4580},{"style":356},[4581],{"type":164,"value":386},{"type":154,"tag":317,"props":4583,"children":4584},{"style":324},[4585],{"type":164,"value":353},{"type":154,"tag":317,"props":4587,"children":4588},{"style":340},[4589],{"type":164,"value":4590}," preload",{"type":154,"tag":317,"props":4592,"children":4593},{"style":324},[4594],{"type":164,"value":939},{"type":154,"tag":292,"props":4596,"children":4598},{"id":4597},"loading",[4599],{"type":154,"tag":159,"props":4600,"children":4602},{"className":4601},[],[4603],{"type":164,"value":4597},{"type":154,"tag":155,"props":4605,"children":4606},{},[4607,4609,4615,4617,4624],{"type":164,"value":4608},"This is a ",{"type":154,"tag":188,"props":4610,"children":4613},{"href":4611,"rel":4612},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading",[216],[4614],{"type":164,"value":1709},{"type":164,"value":4616}," 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":154,"tag":188,"props":4618,"children":4621},{"href":4619,"rel":4620},"https://caniuse.com/loading-lazy-attr",[216],[4622],{"type":164,"value":4623},"supported",{"type":164,"value":4625}," by the latest version of all major browsers since March 2022.",{"type":154,"tag":155,"props":4627,"children":4628},{},[4629,4631,4637],{"type":164,"value":4630},"Set ",{"type":154,"tag":159,"props":4632,"children":4634},{"className":4633},[],[4635],{"type":164,"value":4636},"loading=\"lazy\"",{"type":164,"value":4638}," to defer loading of an image until it appears in the viewport.",{"type":154,"tag":307,"props":4640,"children":4642},{"className":309,"code":4641,"language":311,"meta":142,"style":142},"\u003CNuxtImg src=\"/nuxt-icon.png\" loading=\"lazy\" />\n",[4643],{"type":154,"tag":159,"props":4644,"children":4645},{"__ignoreMap":142},[4646],{"type":154,"tag":317,"props":4647,"children":4648},{"class":319,"line":320},[4649,4653,4657,4661,4665,4669,4673,4677,4682,4686,4690,4695,4699],{"type":154,"tag":317,"props":4650,"children":4651},{"style":324},[4652],{"type":164,"value":327},{"type":154,"tag":317,"props":4654,"children":4655},{"style":330},[4656],{"type":164,"value":913},{"type":154,"tag":317,"props":4658,"children":4659},{"style":340},[4660],{"type":164,"value":918},{"type":154,"tag":317,"props":4662,"children":4663},{"style":324},[4664],{"type":164,"value":348},{"type":154,"tag":317,"props":4666,"children":4667},{"style":324},[4668],{"type":164,"value":353},{"type":154,"tag":317,"props":4670,"children":4671},{"style":356},[4672],{"type":164,"value":386},{"type":154,"tag":317,"props":4674,"children":4675},{"style":324},[4676],{"type":164,"value":353},{"type":154,"tag":317,"props":4678,"children":4679},{"style":340},[4680],{"type":164,"value":4681}," loading",{"type":154,"tag":317,"props":4683,"children":4684},{"style":324},[4685],{"type":164,"value":348},{"type":154,"tag":317,"props":4687,"children":4688},{"style":324},[4689],{"type":164,"value":353},{"type":154,"tag":317,"props":4691,"children":4692},{"style":356},[4693],{"type":164,"value":4694},"lazy",{"type":154,"tag":317,"props":4696,"children":4697},{"style":324},[4698],{"type":164,"value":353},{"type":154,"tag":317,"props":4700,"children":4701},{"style":324},[4702],{"type":164,"value":939},{"type":154,"tag":292,"props":4704,"children":4706},{"id":4705},"nonce",[4707],{"type":154,"tag":159,"props":4708,"children":4710},{"className":4709},[],[4711],{"type":164,"value":4705},{"type":154,"tag":155,"props":4713,"children":4714},{},[4715,4716,4722,4724,4730,4732,4737],{"type":164,"value":4608},{"type":154,"tag":188,"props":4717,"children":4720},{"href":4718,"rel":4719},"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce",[216],[4721],{"type":164,"value":1709},{"type":164,"value":4723}," 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":154,"tag":159,"props":4725,"children":4727},{"className":4726},[],[4728],{"type":164,"value":4729},"unsafe-inline",{"type":164,"value":4731}," directive, which would allowlist ",{"type":154,"tag":1718,"props":4733,"children":4734},{},[4735],{"type":164,"value":4736},"all",{"type":164,"value":4738}," inline script or styles.",{"type":154,"tag":307,"props":4740,"children":4742},{"className":309,"code":4741,"language":311,"meta":142,"style":142},"\u003Ctemplate>\n \u003CNuxtImg\n src=\"/nuxt-icon.png\"\n :nonce=\"nonce\"\n />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\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",[4743],{"type":154,"tag":159,"props":4744,"children":4745},{"__ignoreMap":142},[4746,4761,4772,4795,4822,4829,4844,4851,4890,4898,4906,4931],{"type":154,"tag":317,"props":4747,"children":4748},{"class":319,"line":320},[4749,4753,4757],{"type":154,"tag":317,"props":4750,"children":4751},{"style":324},[4752],{"type":164,"value":327},{"type":154,"tag":317,"props":4754,"children":4755},{"style":330},[4756],{"type":164,"value":2641},{"type":154,"tag":317,"props":4758,"children":4759},{"style":324},[4760],{"type":164,"value":989},{"type":154,"tag":317,"props":4762,"children":4763},{"class":319,"line":336},[4764,4768],{"type":154,"tag":317,"props":4765,"children":4766},{"style":324},[4767],{"type":164,"value":2653},{"type":154,"tag":317,"props":4769,"children":4770},{"style":330},[4771],{"type":164,"value":1202},{"type":154,"tag":317,"props":4773,"children":4774},{"class":319,"line":367},[4775,4779,4783,4787,4791],{"type":154,"tag":317,"props":4776,"children":4777},{"style":340},[4778],{"type":164,"value":2665},{"type":154,"tag":317,"props":4780,"children":4781},{"style":324},[4782],{"type":164,"value":348},{"type":154,"tag":317,"props":4784,"children":4785},{"style":324},[4786],{"type":164,"value":353},{"type":154,"tag":317,"props":4788,"children":4789},{"style":356},[4790],{"type":164,"value":386},{"type":154,"tag":317,"props":4792,"children":4793},{"style":324},[4794],{"type":164,"value":364},{"type":154,"tag":317,"props":4796,"children":4797},{"class":319,"line":393},[4798,4802,4806,4810,4814,4818],{"type":154,"tag":317,"props":4799,"children":4800},{"style":324},[4801],{"type":164,"value":2690},{"type":154,"tag":317,"props":4803,"children":4804},{"style":340},[4805],{"type":164,"value":4705},{"type":154,"tag":317,"props":4807,"children":4808},{"style":324},[4809],{"type":164,"value":348},{"type":154,"tag":317,"props":4811,"children":4812},{"style":324},[4813],{"type":164,"value":353},{"type":154,"tag":317,"props":4815,"children":4816},{"style":397},[4817],{"type":164,"value":4705},{"type":154,"tag":317,"props":4819,"children":4820},{"style":324},[4821],{"type":164,"value":364},{"type":154,"tag":317,"props":4823,"children":4824},{"class":319,"line":644},[4825],{"type":154,"tag":317,"props":4826,"children":4827},{"style":324},[4828],{"type":164,"value":2823},{"type":154,"tag":317,"props":4830,"children":4831},{"class":319,"line":674},[4832,4836,4840],{"type":154,"tag":317,"props":4833,"children":4834},{"style":324},[4835],{"type":164,"value":1512},{"type":154,"tag":317,"props":4837,"children":4838},{"style":330},[4839],{"type":164,"value":2641},{"type":154,"tag":317,"props":4841,"children":4842},{"style":324},[4843],{"type":164,"value":989},{"type":154,"tag":317,"props":4845,"children":4846},{"class":319,"line":704},[4847],{"type":154,"tag":317,"props":4848,"children":4849},{"emptyLinePlaceholder":1448},[4850],{"type":164,"value":1451},{"type":154,"tag":317,"props":4852,"children":4853},{"class":319,"line":740},[4854,4858,4862,4866,4870,4874,4878,4882,4886],{"type":154,"tag":317,"props":4855,"children":4856},{"style":324},[4857],{"type":164,"value":327},{"type":154,"tag":317,"props":4859,"children":4860},{"style":330},[4861],{"type":164,"value":2857},{"type":154,"tag":317,"props":4863,"children":4864},{"style":340},[4865],{"type":164,"value":2862},{"type":154,"tag":317,"props":4867,"children":4868},{"style":340},[4869],{"type":164,"value":2867},{"type":154,"tag":317,"props":4871,"children":4872},{"style":324},[4873],{"type":164,"value":348},{"type":154,"tag":317,"props":4875,"children":4876},{"style":324},[4877],{"type":164,"value":353},{"type":154,"tag":317,"props":4879,"children":4880},{"style":356},[4881],{"type":164,"value":2880},{"type":154,"tag":317,"props":4883,"children":4884},{"style":324},[4885],{"type":164,"value":353},{"type":154,"tag":317,"props":4887,"children":4888},{"style":324},[4889],{"type":164,"value":989},{"type":154,"tag":317,"props":4891,"children":4892},{"class":319,"line":753},[4893],{"type":154,"tag":317,"props":4894,"children":4895},{"style":2215},[4896],{"type":164,"value":4897},"// useNonce is not provided by @nuxt/image but might be\n",{"type":154,"tag":317,"props":4899,"children":4900},{"class":319,"line":1399},[4901],{"type":154,"tag":317,"props":4902,"children":4903},{"style":2215},[4904],{"type":164,"value":4905},"// provided by another module, for example nuxt-security\n",{"type":154,"tag":317,"props":4907,"children":4908},{"class":319,"line":1408},[4909,4913,4918,4922,4927],{"type":154,"tag":317,"props":4910,"children":4911},{"style":340},[4912],{"type":164,"value":2896},{"type":154,"tag":317,"props":4914,"children":4915},{"style":397},[4916],{"type":164,"value":4917}," nonce ",{"type":154,"tag":317,"props":4919,"children":4920},{"style":324},[4921],{"type":164,"value":348},{"type":154,"tag":317,"props":4923,"children":4924},{"style":2705},[4925],{"type":164,"value":4926}," useNonce",{"type":154,"tag":317,"props":4928,"children":4929},{"style":397},[4930],{"type":164,"value":2915},{"type":154,"tag":317,"props":4932,"children":4933},{"class":319,"line":1417},[4934,4938,4942],{"type":154,"tag":317,"props":4935,"children":4936},{"style":324},[4937],{"type":164,"value":1512},{"type":154,"tag":317,"props":4939,"children":4940},{"style":330},[4941],{"type":164,"value":2857},{"type":154,"tag":317,"props":4943,"children":4944},{"style":324},[4945],{"type":164,"value":989},{"type":154,"tag":268,"props":4947,"children":4949},{"id":4948},"events",[4950],{"type":164,"value":4951},"Events",{"type":154,"tag":155,"props":4953,"children":4954},{},[4955,4957,4962,4964,4969,4970,4975],{"type":164,"value":4956},"Native events emitted by the ",{"type":154,"tag":159,"props":4958,"children":4960},{"className":4959},[],[4961],{"type":164,"value":800},{"type":164,"value":4963}," element contained by ",{"type":154,"tag":159,"props":4965,"children":4967},{"className":4966},[],[4968],{"type":164,"value":25},{"type":164,"value":835},{"type":154,"tag":159,"props":4971,"children":4973},{"className":4972},[],[4974],{"type":164,"value":28},{"type":164,"value":4976}," components are re-emitted and can be listened to.",{"type":154,"tag":155,"props":4978,"children":4979},{},[4980,4984,4986,4992,4994],{"type":154,"tag":538,"props":4981,"children":4982},{},[4983],{"type":164,"value":542},{"type":164,"value":4985}," Listen to the native ",{"type":154,"tag":159,"props":4987,"children":4989},{"className":4988},[],[4990],{"type":164,"value":4991},"onLoad",{"type":164,"value":4993}," event from ",{"type":154,"tag":159,"props":4995,"children":4997},{"className":4996},[],[4998],{"type":164,"value":25},{"type":154,"tag":307,"props":5000,"children":5002},{"className":309,"code":5001,"language":311,"meta":142,"style":142},"\u003CNuxtImg\n src=\"/images/colors.jpg\"\n width=\"500\"\n height=\"500\"\n @load=\"doSomethingOnLoad\"\n/>\n",[5003],{"type":154,"tag":159,"props":5004,"children":5005},{"__ignoreMap":142},[5006,5017,5041,5065,5088,5118],{"type":154,"tag":317,"props":5007,"children":5008},{"class":319,"line":320},[5009,5013],{"type":154,"tag":317,"props":5010,"children":5011},{"style":324},[5012],{"type":164,"value":327},{"type":154,"tag":317,"props":5014,"children":5015},{"style":330},[5016],{"type":164,"value":1202},{"type":154,"tag":317,"props":5018,"children":5019},{"class":319,"line":336},[5020,5024,5028,5032,5037],{"type":154,"tag":317,"props":5021,"children":5022},{"style":340},[5023],{"type":164,"value":373},{"type":154,"tag":317,"props":5025,"children":5026},{"style":324},[5027],{"type":164,"value":348},{"type":154,"tag":317,"props":5029,"children":5030},{"style":324},[5031],{"type":164,"value":353},{"type":154,"tag":317,"props":5033,"children":5034},{"style":356},[5035],{"type":164,"value":5036},"/images/colors.jpg",{"type":154,"tag":317,"props":5038,"children":5039},{"style":324},[5040],{"type":164,"value":364},{"type":154,"tag":317,"props":5042,"children":5043},{"class":319,"line":367},[5044,5048,5052,5056,5061],{"type":154,"tag":317,"props":5045,"children":5046},{"style":340},[5047],{"type":164,"value":1259},{"type":154,"tag":317,"props":5049,"children":5050},{"style":324},[5051],{"type":164,"value":348},{"type":154,"tag":317,"props":5053,"children":5054},{"style":324},[5055],{"type":164,"value":353},{"type":154,"tag":317,"props":5057,"children":5058},{"style":356},[5059],{"type":164,"value":5060},"500",{"type":154,"tag":317,"props":5062,"children":5063},{"style":324},[5064],{"type":164,"value":364},{"type":154,"tag":317,"props":5066,"children":5067},{"class":319,"line":393},[5068,5072,5076,5080,5084],{"type":154,"tag":317,"props":5069,"children":5070},{"style":340},[5071],{"type":164,"value":1284},{"type":154,"tag":317,"props":5073,"children":5074},{"style":324},[5075],{"type":164,"value":348},{"type":154,"tag":317,"props":5077,"children":5078},{"style":324},[5079],{"type":164,"value":353},{"type":154,"tag":317,"props":5081,"children":5082},{"style":356},[5083],{"type":164,"value":5060},{"type":154,"tag":317,"props":5085,"children":5086},{"style":324},[5087],{"type":164,"value":364},{"type":154,"tag":317,"props":5089,"children":5090},{"class":319,"line":644},[5091,5096,5101,5105,5109,5114],{"type":154,"tag":317,"props":5092,"children":5093},{"style":324},[5094],{"type":164,"value":5095}," @",{"type":154,"tag":317,"props":5097,"children":5098},{"style":340},[5099],{"type":164,"value":5100},"load",{"type":154,"tag":317,"props":5102,"children":5103},{"style":324},[5104],{"type":164,"value":348},{"type":154,"tag":317,"props":5106,"children":5107},{"style":324},[5108],{"type":164,"value":353},{"type":154,"tag":317,"props":5110,"children":5111},{"style":397},[5112],{"type":164,"value":5113},"doSomethingOnLoad",{"type":154,"tag":317,"props":5115,"children":5116},{"style":324},[5117],{"type":164,"value":364},{"type":154,"tag":317,"props":5119,"children":5120},{"class":319,"line":674},[5121],{"type":154,"tag":317,"props":5122,"children":5123},{"style":397},[5124],{"type":164,"value":400},{"type":154,"tag":760,"props":5126,"children":5127},{},[5128],{"type":164,"value":764},{"title":142,"searchDepth":336,"depth":336,"links":5130},[5131,5132,5152],{"id":140,"depth":336,"text":21},{"id":270,"depth":336,"text":273,"children":5133},[5134,5135,5136,5138,5139,5140,5141,5142,5143,5144,5145,5146,5147,5148,5149,5150,5151],{"id":1026,"depth":367,"text":1026},{"id":820,"depth":367,"text":820},{"id":1640,"depth":367,"text":5137},"width / height",{"id":1122,"depth":367,"text":1122},{"id":852,"depth":367,"text":852},{"id":2001,"depth":367,"text":2001},{"id":2173,"depth":367,"text":2173},{"id":2933,"depth":367,"text":2933},{"id":3178,"depth":367,"text":3178},{"id":3493,"depth":367,"text":3493},{"id":294,"depth":367,"text":294},{"id":3984,"depth":367,"text":3984},{"id":4120,"depth":367,"text":4120},{"id":4323,"depth":367,"text":4323},{"id":4528,"depth":367,"text":4528},{"id":4597,"depth":367,"text":4597},{"id":4705,"depth":367,"text":4705},{"id":4948,"depth":336,"text":4951},"content:2.usage:1.nuxt-img.md","2.usage/1.nuxt-img.md","2.usage/1.nuxt-img",{"_path":32,"_dir":140,"_draft":141,"_partial":141,"_locale":142,"title":31,"description":5157,"links":5158,"body":5161,"_type":772,"_id":6481,"_source":774,"_file":6482,"_stem":6483,"_extension":777},"A Vue composable that returns a helper function to generate optimized image URLs.",[5159],{"label":146,"icon":147,"to":5160,"size":149},"https://github.com/nuxt/image/blob/main/src/runtime/composables.ts",{"type":151,"children":5162,"toc":6476},[5163,5202,5206,5275,5292,5516,5526,5613,5628,5636,5762,5777,6472],{"type":154,"tag":155,"props":5164,"children":5165},{},[5166,5168,5173,5174,5179,5181,5186,5188,5194,5196,5201],{"type":164,"value":5167},"Sometimes you might need to use a generated image URL directly with applied transformations instead of the ",{"type":154,"tag":159,"props":5169,"children":5171},{"className":5170},[],[5172],{"type":164,"value":25},{"type":164,"value":835},{"type":154,"tag":159,"props":5175,"children":5177},{"className":5176},[],[5178],{"type":164,"value":28},{"type":164,"value":5180}," components. This is where ",{"type":154,"tag":159,"props":5182,"children":5184},{"className":5183},[],[5185],{"type":164,"value":31},{"type":164,"value":5187}," comes in (and the helper function it returns, which you will often see referenced directly as ",{"type":154,"tag":159,"props":5189,"children":5191},{"className":5190},[],[5192],{"type":164,"value":5193},"$img",{"type":164,"value":5195}," or ",{"type":154,"tag":159,"props":5197,"children":5199},{"className":5198},[],[5200],{"type":164,"value":531},{"type":164,"value":1149},{"type":154,"tag":268,"props":5203,"children":5204},{"id":140},[5205],{"type":164,"value":21},{"type":154,"tag":307,"props":5207,"children":5211},{"className":5208,"code":5209,"language":5210,"meta":142,"style":142},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","const img = useImage()\n\nimg(src, modifiers, options)\n","js",[5212],{"type":154,"tag":159,"props":5213,"children":5214},{"__ignoreMap":142},[5215,5238,5245],{"type":154,"tag":317,"props":5216,"children":5217},{"class":319,"line":320},[5218,5222,5226,5230,5234],{"type":154,"tag":317,"props":5219,"children":5220},{"style":340},[5221],{"type":164,"value":2896},{"type":154,"tag":317,"props":5223,"children":5224},{"style":397},[5225],{"type":164,"value":2901},{"type":154,"tag":317,"props":5227,"children":5228},{"style":324},[5229],{"type":164,"value":348},{"type":154,"tag":317,"props":5231,"children":5232},{"style":2705},[5233],{"type":164,"value":2910},{"type":154,"tag":317,"props":5235,"children":5236},{"style":397},[5237],{"type":164,"value":2915},{"type":154,"tag":317,"props":5239,"children":5240},{"class":319,"line":336},[5241],{"type":154,"tag":317,"props":5242,"children":5243},{"emptyLinePlaceholder":1448},[5244],{"type":164,"value":1451},{"type":154,"tag":317,"props":5246,"children":5247},{"class":319,"line":367},[5248,5252,5257,5261,5266,5270],{"type":154,"tag":317,"props":5249,"children":5250},{"style":2705},[5251],{"type":164,"value":531},{"type":154,"tag":317,"props":5253,"children":5254},{"style":397},[5255],{"type":164,"value":5256},"(src",{"type":154,"tag":317,"props":5258,"children":5259},{"style":324},[5260],{"type":164,"value":1358},{"type":154,"tag":317,"props":5262,"children":5263},{"style":397},[5264],{"type":164,"value":5265}," modifiers",{"type":154,"tag":317,"props":5267,"children":5268},{"style":324},[5269],{"type":164,"value":1358},{"type":154,"tag":317,"props":5271,"children":5272},{"style":397},[5273],{"type":164,"value":5274}," options)\n",{"type":154,"tag":155,"props":5276,"children":5277},{},[5278,5282,5284,5290],{"type":154,"tag":538,"props":5279,"children":5280},{},[5281],{"type":164,"value":542},{"type":164,"value":5283}," Generate image URL for ",{"type":154,"tag":159,"props":5285,"children":5287},{"className":5286},[],[5288],{"type":164,"value":5289},"backgroundImage",{"type":164,"value":5291}," style.",{"type":154,"tag":307,"props":5293,"children":5295},{"className":5208,"code":5294,"language":5210,"meta":142,"style":142},"const img = useImage()\n\nconst backgroundStyles = computed(() => {\n const imgUrl = img('https://github.com/nuxt.png', { width: 100 })\n\n return { backgroundImage: `url('${imgUrl}')` }\n})\n",[5296],{"type":154,"tag":159,"props":5297,"children":5298},{"__ignoreMap":142},[5299,5322,5329,5368,5439,5446,5505],{"type":154,"tag":317,"props":5300,"children":5301},{"class":319,"line":320},[5302,5306,5310,5314,5318],{"type":154,"tag":317,"props":5303,"children":5304},{"style":340},[5305],{"type":164,"value":2896},{"type":154,"tag":317,"props":5307,"children":5308},{"style":397},[5309],{"type":164,"value":2901},{"type":154,"tag":317,"props":5311,"children":5312},{"style":324},[5313],{"type":164,"value":348},{"type":154,"tag":317,"props":5315,"children":5316},{"style":2705},[5317],{"type":164,"value":2910},{"type":154,"tag":317,"props":5319,"children":5320},{"style":397},[5321],{"type":164,"value":2915},{"type":154,"tag":317,"props":5323,"children":5324},{"class":319,"line":336},[5325],{"type":154,"tag":317,"props":5326,"children":5327},{"emptyLinePlaceholder":1448},[5328],{"type":164,"value":1451},{"type":154,"tag":317,"props":5330,"children":5331},{"class":319,"line":367},[5332,5336,5341,5345,5350,5354,5359,5364],{"type":154,"tag":317,"props":5333,"children":5334},{"style":340},[5335],{"type":164,"value":2896},{"type":154,"tag":317,"props":5337,"children":5338},{"style":397},[5339],{"type":164,"value":5340}," backgroundStyles ",{"type":154,"tag":317,"props":5342,"children":5343},{"style":324},[5344],{"type":164,"value":348},{"type":154,"tag":317,"props":5346,"children":5347},{"style":2705},[5348],{"type":164,"value":5349}," computed",{"type":154,"tag":317,"props":5351,"children":5352},{"style":397},[5353],{"type":164,"value":2712},{"type":154,"tag":317,"props":5355,"children":5356},{"style":324},[5357],{"type":164,"value":5358},"()",{"type":154,"tag":317,"props":5360,"children":5361},{"style":340},[5362],{"type":164,"value":5363}," =>",{"type":154,"tag":317,"props":5365,"children":5366},{"style":324},[5367],{"type":164,"value":3159},{"type":154,"tag":317,"props":5369,"children":5370},{"class":319,"line":393},[5371,5376,5381,5386,5391,5395,5399,5404,5408,5412,5417,5422,5426,5431,5435],{"type":154,"tag":317,"props":5372,"children":5373},{"style":340},[5374],{"type":164,"value":5375}," const",{"type":154,"tag":317,"props":5377,"children":5378},{"style":397},[5379],{"type":164,"value":5380}," imgUrl",{"type":154,"tag":317,"props":5382,"children":5383},{"style":324},[5384],{"type":164,"value":5385}," =",{"type":154,"tag":317,"props":5387,"children":5388},{"style":2705},[5389],{"type":164,"value":5390}," img",{"type":154,"tag":317,"props":5392,"children":5393},{"style":330},[5394],{"type":164,"value":2712},{"type":154,"tag":317,"props":5396,"children":5397},{"style":324},[5398],{"type":164,"value":636},{"type":154,"tag":317,"props":5400,"children":5401},{"style":356},[5402],{"type":164,"value":5403},"https://github.com/nuxt.png",{"type":154,"tag":317,"props":5405,"children":5406},{"style":324},[5407],{"type":164,"value":636},{"type":154,"tag":317,"props":5409,"children":5410},{"style":324},[5411],{"type":164,"value":1358},{"type":154,"tag":317,"props":5413,"children":5414},{"style":324},[5415],{"type":164,"value":5416}," {",{"type":154,"tag":317,"props":5418,"children":5419},{"style":330},[5420],{"type":164,"value":5421}," width",{"type":154,"tag":317,"props":5423,"children":5424},{"style":324},[5425],{"type":164,"value":621},{"type":154,"tag":317,"props":5427,"children":5428},{"style":2329},[5429],{"type":164,"value":5430}," 100",{"type":154,"tag":317,"props":5432,"children":5433},{"style":324},[5434],{"type":164,"value":4514},{"type":154,"tag":317,"props":5436,"children":5437},{"style":330},[5438],{"type":164,"value":3490},{"type":154,"tag":317,"props":5440,"children":5441},{"class":319,"line":644},[5442],{"type":154,"tag":317,"props":5443,"children":5444},{"emptyLinePlaceholder":1448},[5445],{"type":164,"value":1451},{"type":154,"tag":317,"props":5447,"children":5448},{"class":319,"line":674},[5449,5454,5458,5463,5467,5472,5477,5482,5487,5491,5496,5500],{"type":154,"tag":317,"props":5450,"children":5451},{"style":3384},[5452],{"type":164,"value":5453}," return",{"type":154,"tag":317,"props":5455,"children":5456},{"style":324},[5457],{"type":164,"value":5416},{"type":154,"tag":317,"props":5459,"children":5460},{"style":330},[5461],{"type":164,"value":5462}," backgroundImage",{"type":154,"tag":317,"props":5464,"children":5465},{"style":324},[5466],{"type":164,"value":621},{"type":154,"tag":317,"props":5468,"children":5469},{"style":324},[5470],{"type":164,"value":5471}," `",{"type":154,"tag":317,"props":5473,"children":5474},{"style":356},[5475],{"type":164,"value":5476},"url('",{"type":154,"tag":317,"props":5478,"children":5479},{"style":324},[5480],{"type":164,"value":5481},"${",{"type":154,"tag":317,"props":5483,"children":5484},{"style":397},[5485],{"type":164,"value":5486},"imgUrl",{"type":154,"tag":317,"props":5488,"children":5489},{"style":324},[5490],{"type":164,"value":1377},{"type":154,"tag":317,"props":5492,"children":5493},{"style":356},[5494],{"type":164,"value":5495},"')",{"type":154,"tag":317,"props":5497,"children":5498},{"style":324},[5499],{"type":164,"value":2717},{"type":154,"tag":317,"props":5501,"children":5502},{"style":324},[5503],{"type":164,"value":5504}," }\n",{"type":154,"tag":317,"props":5506,"children":5507},{"class":319,"line":704},[5508,5512],{"type":154,"tag":317,"props":5509,"children":5510},{"style":324},[5511],{"type":164,"value":1377},{"type":154,"tag":317,"props":5513,"children":5514},{"style":397},[5515],{"type":164,"value":3490},{"type":154,"tag":292,"props":5517,"children":5519},{"id":5518},"imggetsizes",[5520],{"type":154,"tag":159,"props":5521,"children":5523},{"className":5522},[],[5524],{"type":164,"value":5525},"img.getSizes",{"type":154,"tag":307,"props":5527,"children":5529},{"className":5208,"code":5528,"language":5210,"meta":142,"style":142},"const img = useImage()\n\nimg.getSizes(src, { sizes, modifiers })\n",[5530],{"type":154,"tag":159,"props":5531,"children":5532},{"__ignoreMap":142},[5533,5556,5563],{"type":154,"tag":317,"props":5534,"children":5535},{"class":319,"line":320},[5536,5540,5544,5548,5552],{"type":154,"tag":317,"props":5537,"children":5538},{"style":340},[5539],{"type":164,"value":2896},{"type":154,"tag":317,"props":5541,"children":5542},{"style":397},[5543],{"type":164,"value":2901},{"type":154,"tag":317,"props":5545,"children":5546},{"style":324},[5547],{"type":164,"value":348},{"type":154,"tag":317,"props":5549,"children":5550},{"style":2705},[5551],{"type":164,"value":2910},{"type":154,"tag":317,"props":5553,"children":5554},{"style":397},[5555],{"type":164,"value":2915},{"type":154,"tag":317,"props":5557,"children":5558},{"class":319,"line":336},[5559],{"type":154,"tag":317,"props":5560,"children":5561},{"emptyLinePlaceholder":1448},[5562],{"type":164,"value":1451},{"type":154,"tag":317,"props":5564,"children":5565},{"class":319,"line":367},[5566,5570,5574,5579,5583,5587,5591,5596,5600,5605,5609],{"type":154,"tag":317,"props":5567,"children":5568},{"style":397},[5569],{"type":164,"value":531},{"type":154,"tag":317,"props":5571,"children":5572},{"style":324},[5573],{"type":164,"value":226},{"type":154,"tag":317,"props":5575,"children":5576},{"style":2705},[5577],{"type":164,"value":5578},"getSizes",{"type":154,"tag":317,"props":5580,"children":5581},{"style":397},[5582],{"type":164,"value":5256},{"type":154,"tag":317,"props":5584,"children":5585},{"style":324},[5586],{"type":164,"value":1358},{"type":154,"tag":317,"props":5588,"children":5589},{"style":324},[5590],{"type":164,"value":5416},{"type":154,"tag":317,"props":5592,"children":5593},{"style":397},[5594],{"type":164,"value":5595}," sizes",{"type":154,"tag":317,"props":5597,"children":5598},{"style":324},[5599],{"type":164,"value":1358},{"type":154,"tag":317,"props":5601,"children":5602},{"style":397},[5603],{"type":164,"value":5604}," modifiers ",{"type":154,"tag":317,"props":5606,"children":5607},{"style":324},[5608],{"type":164,"value":1377},{"type":154,"tag":317,"props":5610,"children":5611},{"style":397},[5612],{"type":164,"value":3490},{"type":154,"tag":228,"props":5614,"children":5615},{},[5616],{"type":154,"tag":155,"props":5617,"children":5618},{},[5619,5621,5626],{"type":164,"value":5620},"Unstable: ",{"type":154,"tag":159,"props":5622,"children":5624},{"className":5623},[],[5625],{"type":164,"value":5578},{"type":164,"value":5627}," API might change or be removed.",{"type":154,"tag":155,"props":5629,"children":5630},{},[5631],{"type":154,"tag":538,"props":5632,"children":5633},{},[5634],{"type":164,"value":5635},"Parameters:",{"type":154,"tag":465,"props":5637,"children":5638},{},[5639,5649,5659,5717],{"type":154,"tag":469,"props":5640,"children":5641},{},[5642,5647],{"type":154,"tag":159,"props":5643,"children":5645},{"className":5644},[],[5646],{"type":164,"value":820},{"type":164,"value":5648},": (string) Source to original image id",{"type":154,"tag":469,"props":5650,"children":5651},{},[5652,5657],{"type":154,"tag":159,"props":5653,"children":5655},{"className":5654},[],[5656],{"type":164,"value":852},{"type":164,"value":5658},": (string) List of responsive image sizes ({breakpoint}:{size}{unit})",{"type":154,"tag":469,"props":5660,"children":5661},{},[5662,5667,5669],{"type":154,"tag":159,"props":5663,"children":5665},{"className":5664},[],[5666],{"type":164,"value":4323},{"type":164,"value":5668},": (object) Modifiers passed to provider for resizing and optimizing\n",{"type":154,"tag":465,"props":5670,"children":5671},{},[5672,5682,5692,5702,5712],{"type":154,"tag":469,"props":5673,"children":5674},{},[5675,5680],{"type":154,"tag":159,"props":5676,"children":5678},{"className":5677},[],[5679],{"type":164,"value":833},{"type":164,"value":5681},": resize to the specified width (in pixels)",{"type":154,"tag":469,"props":5683,"children":5684},{},[5685,5690],{"type":154,"tag":159,"props":5686,"children":5688},{"className":5687},[],[5689],{"type":164,"value":841},{"type":164,"value":5691},": resize to specified height (in pixels)",{"type":154,"tag":469,"props":5693,"children":5694},{},[5695,5700],{"type":154,"tag":159,"props":5696,"children":5698},{"className":5697},[],[5699],{"type":164,"value":3984},{"type":164,"value":5701},": Change image quality (0 to 100)",{"type":154,"tag":469,"props":5703,"children":5704},{},[5705,5710],{"type":154,"tag":159,"props":5706,"children":5708},{"className":5707},[],[5709],{"type":164,"value":294},{"type":164,"value":5711},": Change the image format",{"type":154,"tag":469,"props":5713,"children":5714},{},[5715],{"type":164,"value":5716},"(any other custom provider modifier)",{"type":154,"tag":469,"props":5718,"children":5719},{},[5720,5726,5728],{"type":154,"tag":159,"props":5721,"children":5723},{"className":5722},[],[5724],{"type":164,"value":5725},"options",{"type":164,"value":5727},": (object)\n",{"type":154,"tag":465,"props":5729,"children":5730},{},[5731,5748],{"type":154,"tag":469,"props":5732,"children":5733},{},[5734,5739,5741,5747],{"type":154,"tag":159,"props":5735,"children":5737},{"className":5736},[],[5738],{"type":164,"value":3178},{"type":164,"value":5740},": (string) Provider name other than default (see ",{"type":154,"tag":188,"props":5742,"children":5744},{"href":5743},"/get-started/configuration#providers",[5745],{"type":164,"value":5746},"providers",{"type":164,"value":1682},{"type":154,"tag":469,"props":5749,"children":5750},{},[5751,5756,5758],{"type":154,"tag":159,"props":5752,"children":5754},{"className":5753},[],[5755],{"type":164,"value":3493},{"type":164,"value":5757},": Use a ",{"type":154,"tag":188,"props":5759,"children":5760},{"href":3515},[5761],{"type":164,"value":3493},{"type":154,"tag":155,"props":5763,"children":5764},{},[5765,5769,5771],{"type":154,"tag":538,"props":5766,"children":5767},{},[5768],{"type":164,"value":542},{"type":164,"value":5770}," Responsive srcset with Vuetify ",{"type":154,"tag":159,"props":5772,"children":5774},{"className":5773},[],[5775],{"type":164,"value":5776},"v-img",{"type":154,"tag":307,"props":5778,"children":5780},{"className":947,"code":5779,"language":949,"meta":142,"style":142},"\u003Ctemplate>\n \u003Cv-img\n :lazy-src=\"img(src, { width: 10, quality: 70 })\"\n :src=\"img(src, { height, quality: 70 })\"\n :srcset=\"_srcset.srcset\"\n :height=\"height\"\n :sizes=\"_srcset.sizes\"\n />\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nconst props = defineProps({\n height: {\n type: [Number, String],\n default: 500\n },\n src: {\n type: String,\n default: '/img/header-bg.jpg'\n }\n})\n\nconst img = useImage()\n\nconst _srcset = computed(() => {\n return img.getSizes(props.src, {\n sizes: 'xs:100vw sm:100vw md:100vw lg:100vw xl:100vw',\n modifiers: {\n format: 'webp',\n quality: 70,\n height: props.height\n }\n })\n})\n\u003C/script>\n",[5781],{"type":154,"tag":159,"props":5782,"children":5783},{"__ignoreMap":142},[5784,5799,5811,5836,5861,5886,5910,5935,5942,5957,5964,6003,6032,6047,6077,6094,6102,6117,6137,6161,6168,6179,6186,6210,6218,6255,6299,6329,6346,6375,6397,6424,6432,6444,6456],{"type":154,"tag":317,"props":5785,"children":5786},{"class":319,"line":320},[5787,5791,5795],{"type":154,"tag":317,"props":5788,"children":5789},{"style":324},[5790],{"type":164,"value":327},{"type":154,"tag":317,"props":5792,"children":5793},{"style":330},[5794],{"type":164,"value":2641},{"type":154,"tag":317,"props":5796,"children":5797},{"style":324},[5798],{"type":164,"value":989},{"type":154,"tag":317,"props":5800,"children":5801},{"class":319,"line":336},[5802,5806],{"type":154,"tag":317,"props":5803,"children":5804},{"style":324},[5805],{"type":164,"value":2653},{"type":154,"tag":317,"props":5807,"children":5808},{"style":330},[5809],{"type":164,"value":5810},"v-img\n",{"type":154,"tag":317,"props":5812,"children":5813},{"class":319,"line":367},[5814,5819,5823,5827,5832],{"type":154,"tag":317,"props":5815,"children":5816},{"style":340},[5817],{"type":164,"value":5818}," :lazy-src",{"type":154,"tag":317,"props":5820,"children":5821},{"style":324},[5822],{"type":164,"value":348},{"type":154,"tag":317,"props":5824,"children":5825},{"style":324},[5826],{"type":164,"value":353},{"type":154,"tag":317,"props":5828,"children":5829},{"style":356},[5830],{"type":164,"value":5831},"img(src, { width: 10, quality: 70 })",{"type":154,"tag":317,"props":5833,"children":5834},{"style":324},[5835],{"type":164,"value":364},{"type":154,"tag":317,"props":5837,"children":5838},{"class":319,"line":393},[5839,5844,5848,5852,5857],{"type":154,"tag":317,"props":5840,"children":5841},{"style":340},[5842],{"type":164,"value":5843}," :src",{"type":154,"tag":317,"props":5845,"children":5846},{"style":324},[5847],{"type":164,"value":348},{"type":154,"tag":317,"props":5849,"children":5850},{"style":324},[5851],{"type":164,"value":353},{"type":154,"tag":317,"props":5853,"children":5854},{"style":356},[5855],{"type":164,"value":5856},"img(src, { height, quality: 70 })",{"type":154,"tag":317,"props":5858,"children":5859},{"style":324},[5860],{"type":164,"value":364},{"type":154,"tag":317,"props":5862,"children":5863},{"class":319,"line":644},[5864,5869,5873,5877,5882],{"type":154,"tag":317,"props":5865,"children":5866},{"style":340},[5867],{"type":164,"value":5868}," :srcset",{"type":154,"tag":317,"props":5870,"children":5871},{"style":324},[5872],{"type":164,"value":348},{"type":154,"tag":317,"props":5874,"children":5875},{"style":324},[5876],{"type":164,"value":353},{"type":154,"tag":317,"props":5878,"children":5879},{"style":356},[5880],{"type":164,"value":5881},"_srcset.srcset",{"type":154,"tag":317,"props":5883,"children":5884},{"style":324},[5885],{"type":164,"value":364},{"type":154,"tag":317,"props":5887,"children":5888},{"class":319,"line":674},[5889,5894,5898,5902,5906],{"type":154,"tag":317,"props":5890,"children":5891},{"style":340},[5892],{"type":164,"value":5893}," :height",{"type":154,"tag":317,"props":5895,"children":5896},{"style":324},[5897],{"type":164,"value":348},{"type":154,"tag":317,"props":5899,"children":5900},{"style":324},[5901],{"type":164,"value":353},{"type":154,"tag":317,"props":5903,"children":5904},{"style":356},[5905],{"type":164,"value":841},{"type":154,"tag":317,"props":5907,"children":5908},{"style":324},[5909],{"type":164,"value":364},{"type":154,"tag":317,"props":5911,"children":5912},{"class":319,"line":704},[5913,5918,5922,5926,5931],{"type":154,"tag":317,"props":5914,"children":5915},{"style":340},[5916],{"type":164,"value":5917}," :sizes",{"type":154,"tag":317,"props":5919,"children":5920},{"style":324},[5921],{"type":164,"value":348},{"type":154,"tag":317,"props":5923,"children":5924},{"style":324},[5925],{"type":164,"value":353},{"type":154,"tag":317,"props":5927,"children":5928},{"style":356},[5929],{"type":164,"value":5930},"_srcset.sizes",{"type":154,"tag":317,"props":5932,"children":5933},{"style":324},[5934],{"type":164,"value":364},{"type":154,"tag":317,"props":5936,"children":5937},{"class":319,"line":740},[5938],{"type":154,"tag":317,"props":5939,"children":5940},{"style":324},[5941],{"type":164,"value":2823},{"type":154,"tag":317,"props":5943,"children":5944},{"class":319,"line":753},[5945,5949,5953],{"type":154,"tag":317,"props":5946,"children":5947},{"style":324},[5948],{"type":164,"value":1512},{"type":154,"tag":317,"props":5950,"children":5951},{"style":330},[5952],{"type":164,"value":2641},{"type":154,"tag":317,"props":5954,"children":5955},{"style":324},[5956],{"type":164,"value":989},{"type":154,"tag":317,"props":5958,"children":5959},{"class":319,"line":1399},[5960],{"type":154,"tag":317,"props":5961,"children":5962},{"emptyLinePlaceholder":1448},[5963],{"type":164,"value":1451},{"type":154,"tag":317,"props":5965,"children":5966},{"class":319,"line":1408},[5967,5971,5975,5979,5983,5987,5991,5995,5999],{"type":154,"tag":317,"props":5968,"children":5969},{"style":324},[5970],{"type":164,"value":327},{"type":154,"tag":317,"props":5972,"children":5973},{"style":330},[5974],{"type":164,"value":2857},{"type":154,"tag":317,"props":5976,"children":5977},{"style":340},[5978],{"type":164,"value":2862},{"type":154,"tag":317,"props":5980,"children":5981},{"style":340},[5982],{"type":164,"value":2867},{"type":154,"tag":317,"props":5984,"children":5985},{"style":324},[5986],{"type":164,"value":348},{"type":154,"tag":317,"props":5988,"children":5989},{"style":324},[5990],{"type":164,"value":353},{"type":154,"tag":317,"props":5992,"children":5993},{"style":356},[5994],{"type":164,"value":2880},{"type":154,"tag":317,"props":5996,"children":5997},{"style":324},[5998],{"type":164,"value":353},{"type":154,"tag":317,"props":6000,"children":6001},{"style":324},[6002],{"type":164,"value":989},{"type":154,"tag":317,"props":6004,"children":6005},{"class":319,"line":1417},[6006,6010,6015,6019,6024,6028],{"type":154,"tag":317,"props":6007,"children":6008},{"style":340},[6009],{"type":164,"value":2896},{"type":154,"tag":317,"props":6011,"children":6012},{"style":397},[6013],{"type":164,"value":6014}," props ",{"type":154,"tag":317,"props":6016,"children":6017},{"style":324},[6018],{"type":164,"value":348},{"type":154,"tag":317,"props":6020,"children":6021},{"style":2705},[6022],{"type":164,"value":6023}," defineProps",{"type":154,"tag":317,"props":6025,"children":6026},{"style":397},[6027],{"type":164,"value":2712},{"type":154,"tag":317,"props":6029,"children":6030},{"style":324},[6031],{"type":164,"value":608},{"type":154,"tag":317,"props":6033,"children":6034},{"class":319,"line":1426},[6035,6039,6043],{"type":154,"tag":317,"props":6036,"children":6037},{"style":330},[6038],{"type":164,"value":1284},{"type":154,"tag":317,"props":6040,"children":6041},{"style":324},[6042],{"type":164,"value":621},{"type":154,"tag":317,"props":6044,"children":6045},{"style":324},[6046],{"type":164,"value":3159},{"type":154,"tag":317,"props":6048,"children":6049},{"class":319,"line":1435},[6050,6055,6059,6064,6068,6073],{"type":154,"tag":317,"props":6051,"children":6052},{"style":330},[6053],{"type":164,"value":6054}," type",{"type":154,"tag":317,"props":6056,"children":6057},{"style":324},[6058],{"type":164,"value":621},{"type":154,"tag":317,"props":6060,"children":6061},{"style":397},[6062],{"type":164,"value":6063}," [Number",{"type":154,"tag":317,"props":6065,"children":6066},{"style":324},[6067],{"type":164,"value":1358},{"type":154,"tag":317,"props":6069,"children":6070},{"style":397},[6071],{"type":164,"value":6072}," String]",{"type":154,"tag":317,"props":6074,"children":6075},{"style":324},[6076],{"type":164,"value":641},{"type":154,"tag":317,"props":6078,"children":6079},{"class":319,"line":1444},[6080,6085,6089],{"type":154,"tag":317,"props":6081,"children":6082},{"style":330},[6083],{"type":164,"value":6084}," default",{"type":154,"tag":317,"props":6086,"children":6087},{"style":324},[6088],{"type":164,"value":621},{"type":154,"tag":317,"props":6090,"children":6091},{"style":2329},[6092],{"type":164,"value":6093}," 500\n",{"type":154,"tag":317,"props":6095,"children":6096},{"class":319,"line":1454},[6097],{"type":154,"tag":317,"props":6098,"children":6099},{"style":324},[6100],{"type":164,"value":6101}," },\n",{"type":154,"tag":317,"props":6103,"children":6104},{"class":319,"line":1463},[6105,6109,6113],{"type":154,"tag":317,"props":6106,"children":6107},{"style":330},[6108],{"type":164,"value":373},{"type":154,"tag":317,"props":6110,"children":6111},{"style":324},[6112],{"type":164,"value":621},{"type":154,"tag":317,"props":6114,"children":6115},{"style":324},[6116],{"type":164,"value":3159},{"type":154,"tag":317,"props":6118,"children":6119},{"class":319,"line":1471},[6120,6124,6128,6133],{"type":154,"tag":317,"props":6121,"children":6122},{"style":330},[6123],{"type":164,"value":6054},{"type":154,"tag":317,"props":6125,"children":6126},{"style":324},[6127],{"type":164,"value":621},{"type":154,"tag":317,"props":6129,"children":6130},{"style":397},[6131],{"type":164,"value":6132}," String",{"type":154,"tag":317,"props":6134,"children":6135},{"style":324},[6136],{"type":164,"value":641},{"type":154,"tag":317,"props":6138,"children":6139},{"class":319,"line":1480},[6140,6144,6148,6152,6157],{"type":154,"tag":317,"props":6141,"children":6142},{"style":330},[6143],{"type":164,"value":6084},{"type":154,"tag":317,"props":6145,"children":6146},{"style":324},[6147],{"type":164,"value":621},{"type":154,"tag":317,"props":6149,"children":6150},{"style":324},[6151],{"type":164,"value":626},{"type":154,"tag":317,"props":6153,"children":6154},{"style":356},[6155],{"type":164,"value":6156},"/img/header-bg.jpg",{"type":154,"tag":317,"props":6158,"children":6159},{"style":324},[6160],{"type":164,"value":737},{"type":154,"tag":317,"props":6162,"children":6163},{"class":319,"line":1489},[6164],{"type":154,"tag":317,"props":6165,"children":6166},{"style":324},[6167],{"type":164,"value":3478},{"type":154,"tag":317,"props":6169,"children":6170},{"class":319,"line":1498},[6171,6175],{"type":154,"tag":317,"props":6172,"children":6173},{"style":324},[6174],{"type":164,"value":1377},{"type":154,"tag":317,"props":6176,"children":6177},{"style":397},[6178],{"type":164,"value":3490},{"type":154,"tag":317,"props":6180,"children":6181},{"class":319,"line":1506},[6182],{"type":154,"tag":317,"props":6183,"children":6184},{"emptyLinePlaceholder":1448},[6185],{"type":164,"value":1451},{"type":154,"tag":317,"props":6187,"children":6189},{"class":319,"line":6188},23,[6190,6194,6198,6202,6206],{"type":154,"tag":317,"props":6191,"children":6192},{"style":340},[6193],{"type":164,"value":2896},{"type":154,"tag":317,"props":6195,"children":6196},{"style":397},[6197],{"type":164,"value":2901},{"type":154,"tag":317,"props":6199,"children":6200},{"style":324},[6201],{"type":164,"value":348},{"type":154,"tag":317,"props":6203,"children":6204},{"style":2705},[6205],{"type":164,"value":2910},{"type":154,"tag":317,"props":6207,"children":6208},{"style":397},[6209],{"type":164,"value":2915},{"type":154,"tag":317,"props":6211,"children":6213},{"class":319,"line":6212},24,[6214],{"type":154,"tag":317,"props":6215,"children":6216},{"emptyLinePlaceholder":1448},[6217],{"type":164,"value":1451},{"type":154,"tag":317,"props":6219,"children":6221},{"class":319,"line":6220},25,[6222,6226,6231,6235,6239,6243,6247,6251],{"type":154,"tag":317,"props":6223,"children":6224},{"style":340},[6225],{"type":164,"value":2896},{"type":154,"tag":317,"props":6227,"children":6228},{"style":397},[6229],{"type":164,"value":6230}," _srcset ",{"type":154,"tag":317,"props":6232,"children":6233},{"style":324},[6234],{"type":164,"value":348},{"type":154,"tag":317,"props":6236,"children":6237},{"style":2705},[6238],{"type":164,"value":5349},{"type":154,"tag":317,"props":6240,"children":6241},{"style":397},[6242],{"type":164,"value":2712},{"type":154,"tag":317,"props":6244,"children":6245},{"style":324},[6246],{"type":164,"value":5358},{"type":154,"tag":317,"props":6248,"children":6249},{"style":340},[6250],{"type":164,"value":5363},{"type":154,"tag":317,"props":6252,"children":6253},{"style":324},[6254],{"type":164,"value":3159},{"type":154,"tag":317,"props":6256,"children":6258},{"class":319,"line":6257},26,[6259,6263,6267,6271,6275,6279,6283,6287,6291,6295],{"type":154,"tag":317,"props":6260,"children":6261},{"style":3384},[6262],{"type":164,"value":5453},{"type":154,"tag":317,"props":6264,"children":6265},{"style":397},[6266],{"type":164,"value":5390},{"type":154,"tag":317,"props":6268,"children":6269},{"style":324},[6270],{"type":164,"value":226},{"type":154,"tag":317,"props":6272,"children":6273},{"style":2705},[6274],{"type":164,"value":5578},{"type":154,"tag":317,"props":6276,"children":6277},{"style":330},[6278],{"type":164,"value":2712},{"type":154,"tag":317,"props":6280,"children":6281},{"style":397},[6282],{"type":164,"value":270},{"type":154,"tag":317,"props":6284,"children":6285},{"style":324},[6286],{"type":164,"value":226},{"type":154,"tag":317,"props":6288,"children":6289},{"style":397},[6290],{"type":164,"value":820},{"type":154,"tag":317,"props":6292,"children":6293},{"style":324},[6294],{"type":164,"value":1358},{"type":154,"tag":317,"props":6296,"children":6297},{"style":324},[6298],{"type":164,"value":3159},{"type":154,"tag":317,"props":6300,"children":6302},{"class":319,"line":6301},27,[6303,6308,6312,6316,6321,6325],{"type":154,"tag":317,"props":6304,"children":6305},{"style":330},[6306],{"type":164,"value":6307}," sizes",{"type":154,"tag":317,"props":6309,"children":6310},{"style":324},[6311],{"type":164,"value":621},{"type":154,"tag":317,"props":6313,"children":6314},{"style":324},[6315],{"type":164,"value":626},{"type":154,"tag":317,"props":6317,"children":6318},{"style":356},[6319],{"type":164,"value":6320},"xs:100vw sm:100vw md:100vw lg:100vw xl:100vw",{"type":154,"tag":317,"props":6322,"children":6323},{"style":324},[6324],{"type":164,"value":636},{"type":154,"tag":317,"props":6326,"children":6327},{"style":324},[6328],{"type":164,"value":641},{"type":154,"tag":317,"props":6330,"children":6332},{"class":319,"line":6331},28,[6333,6338,6342],{"type":154,"tag":317,"props":6334,"children":6335},{"style":330},[6336],{"type":164,"value":6337}," modifiers",{"type":154,"tag":317,"props":6339,"children":6340},{"style":324},[6341],{"type":164,"value":621},{"type":154,"tag":317,"props":6343,"children":6344},{"style":324},[6345],{"type":164,"value":3159},{"type":154,"tag":317,"props":6347,"children":6349},{"class":319,"line":6348},29,[6350,6355,6359,6363,6367,6371],{"type":154,"tag":317,"props":6351,"children":6352},{"style":330},[6353],{"type":164,"value":6354}," format",{"type":154,"tag":317,"props":6356,"children":6357},{"style":324},[6358],{"type":164,"value":621},{"type":154,"tag":317,"props":6360,"children":6361},{"style":324},[6362],{"type":164,"value":626},{"type":154,"tag":317,"props":6364,"children":6365},{"style":356},[6366],{"type":164,"value":204},{"type":154,"tag":317,"props":6368,"children":6369},{"style":324},[6370],{"type":164,"value":636},{"type":154,"tag":317,"props":6372,"children":6373},{"style":324},[6374],{"type":164,"value":641},{"type":154,"tag":317,"props":6376,"children":6378},{"class":319,"line":6377},30,[6379,6384,6388,6393],{"type":154,"tag":317,"props":6380,"children":6381},{"style":330},[6382],{"type":164,"value":6383}," quality",{"type":154,"tag":317,"props":6385,"children":6386},{"style":324},[6387],{"type":164,"value":621},{"type":154,"tag":317,"props":6389,"children":6390},{"style":2329},[6391],{"type":164,"value":6392}," 70",{"type":154,"tag":317,"props":6394,"children":6395},{"style":324},[6396],{"type":164,"value":641},{"type":154,"tag":317,"props":6398,"children":6400},{"class":319,"line":6399},31,[6401,6406,6410,6415,6419],{"type":154,"tag":317,"props":6402,"children":6403},{"style":330},[6404],{"type":164,"value":6405}," height",{"type":154,"tag":317,"props":6407,"children":6408},{"style":324},[6409],{"type":164,"value":621},{"type":154,"tag":317,"props":6411,"children":6412},{"style":397},[6413],{"type":164,"value":6414}," props",{"type":154,"tag":317,"props":6416,"children":6417},{"style":324},[6418],{"type":164,"value":226},{"type":154,"tag":317,"props":6420,"children":6421},{"style":397},[6422],{"type":164,"value":6423},"height\n",{"type":154,"tag":317,"props":6425,"children":6427},{"class":319,"line":6426},32,[6428],{"type":154,"tag":317,"props":6429,"children":6430},{"style":324},[6431],{"type":164,"value":3470},{"type":154,"tag":317,"props":6433,"children":6435},{"class":319,"line":6434},33,[6436,6440],{"type":154,"tag":317,"props":6437,"children":6438},{"style":324},[6439],{"type":164,"value":746},{"type":154,"tag":317,"props":6441,"children":6442},{"style":330},[6443],{"type":164,"value":3490},{"type":154,"tag":317,"props":6445,"children":6447},{"class":319,"line":6446},34,[6448,6452],{"type":154,"tag":317,"props":6449,"children":6450},{"style":324},[6451],{"type":164,"value":1377},{"type":154,"tag":317,"props":6453,"children":6454},{"style":397},[6455],{"type":164,"value":3490},{"type":154,"tag":317,"props":6457,"children":6459},{"class":319,"line":6458},35,[6460,6464,6468],{"type":154,"tag":317,"props":6461,"children":6462},{"style":324},[6463],{"type":164,"value":1512},{"type":154,"tag":317,"props":6465,"children":6466},{"style":330},[6467],{"type":164,"value":2857},{"type":154,"tag":317,"props":6469,"children":6470},{"style":324},[6471],{"type":164,"value":989},{"type":154,"tag":760,"props":6473,"children":6474},{},[6475],{"type":164,"value":764},{"title":142,"searchDepth":336,"depth":336,"links":6477},[6478],{"id":140,"depth":336,"text":21,"children":6479},[6480],{"id":5518,"depth":367,"text":5525},"content:2.usage:3.use-image.md","2.usage/3.use-image.md","2.usage/3.use-image",1742393728943]