[{"data":1,"prerenderedAt":2847},["ShallowReactive",2],{"navigation_docs":3,"-usage-nuxt-img":228,"-usage-nuxt-img-surround":2842},[4,30,47,215],{"title":5,"path":6,"stem":7,"children":8,"page":29},"Get Started","\u002Fget-started","1.get-started",[9,13,17,21,25],{"title":10,"path":11,"stem":12},"Installation","\u002Fget-started\u002Finstallation","1.get-started\u002F1.installation",{"title":14,"path":15,"stem":16},"Configuration","\u002Fget-started\u002Fconfiguration","1.get-started\u002F2.configuration",{"title":18,"path":19,"stem":20},"Providers","\u002Fget-started\u002Fproviders","1.get-started\u002F3.providers",{"title":22,"path":23,"stem":24},"Contributing","\u002Fget-started\u002Fcontributing","1.get-started\u002F4.contributing",{"title":26,"path":27,"stem":28},"Migration","\u002Fget-started\u002Fmigration","1.get-started\u002F5.migration",false,{"title":31,"path":32,"stem":33,"children":34,"page":29},"Usage","\u002Fusage","2.usage",[35,39,43],{"title":36,"path":37,"stem":38},"\u003CNuxtImg>","\u002Fusage\u002Fnuxt-img","2.usage\u002F1.nuxt-img",{"title":40,"path":41,"stem":42},"\u003CNuxtPicture>","\u002Fusage\u002Fnuxt-picture","2.usage\u002F2.nuxt-picture",{"title":44,"path":45,"stem":46},"useImage()","\u002Fusage\u002Fuse-image","2.usage\u002F3.use-image",{"title":18,"path":48,"stem":49,"children":50,"page":29},"\u002Fproviders","3.providers",[51,55,59,63,67,71,75,79,83,87,91,95,99,103,107,111,115,119,123,127,131,135,139,143,147,151,155,159,163,167,171,175,179,183,187,191,195,199,203,207,211],{"title":52,"path":53,"stem":54},"Aliyun","\u002Fproviders\u002Faliyun","3.providers\u002Faliyun",{"title":56,"path":57,"stem":58},"AWS Amplify","\u002Fproviders\u002Faws-amplify","3.providers\u002Faws-amplify",{"title":60,"path":61,"stem":62},"Builder.io","\u002Fproviders\u002Fbuilderio","3.providers\u002Fbuilderio",{"title":64,"path":65,"stem":66},"Bunny","\u002Fproviders\u002Fbunny","3.providers\u002Fbunny",{"title":68,"path":69,"stem":70},"Caisy","\u002Fproviders\u002Fcaisy","3.providers\u002Fcaisy",{"title":72,"path":73,"stem":74},"Cloudflare","\u002Fproviders\u002Fcloudflare","3.providers\u002Fcloudflare",{"title":76,"path":77,"stem":78},"Cloudflare Images","\u002Fproviders\u002Fcloudflareimages","3.providers\u002Fcloudflareimages",{"title":80,"path":81,"stem":82},"Cloudimage","\u002Fproviders\u002Fcloudimage","3.providers\u002Fcloudimage",{"title":84,"path":85,"stem":86},"Cloudinary","\u002Fproviders\u002Fcloudinary","3.providers\u002Fcloudinary",{"title":88,"path":89,"stem":90},"Contentful","\u002Fproviders\u002Fcontentful","3.providers\u002Fcontentful",{"title":92,"path":93,"stem":94},"Directus","\u002Fproviders\u002Fdirectus","3.providers\u002Fdirectus",{"title":96,"path":97,"stem":98},"EdgeOne Pages","\u002Fproviders\u002Fedgeone-pages","3.providers\u002Fedgeone-pages",{"title":100,"path":101,"stem":102},"Fastly","\u002Fproviders\u002Ffastly","3.providers\u002Ffastly",{"title":104,"path":105,"stem":106},"Filerobot","\u002Fproviders\u002Ffilerobot","3.providers\u002Ffilerobot",{"title":108,"path":109,"stem":110},"Flyimg","\u002Fproviders\u002Fflyimg","3.providers\u002Fflyimg",{"title":112,"path":113,"stem":114},"GitHub","\u002Fproviders\u002Fgithub","3.providers\u002Fgithub",{"title":116,"path":117,"stem":118},"Glide","\u002Fproviders\u002Fglide","3.providers\u002Fglide",{"title":120,"path":121,"stem":122},"Gumlet","\u002Fproviders\u002Fgumlet","3.providers\u002Fgumlet",{"title":124,"path":125,"stem":126},"Hygraph","\u002Fproviders\u002Fhygraph","3.providers\u002Fhygraph",{"title":128,"path":129,"stem":130},"ImageEngine","\u002Fproviders\u002Fimageengine","3.providers\u002Fimageengine",{"title":132,"path":133,"stem":134},"ImageKit","\u002Fproviders\u002Fimagekit","3.providers\u002Fimagekit",{"title":136,"path":137,"stem":138},"Imgix","\u002Fproviders\u002Fimgix","3.providers\u002Fimgix",{"title":140,"path":141,"stem":142},"Imgproxy","\u002Fproviders\u002Fimgproxy","3.providers\u002Fimgproxy",{"title":144,"path":145,"stem":146},"IPX","\u002Fproviders\u002Fipx","3.providers\u002Fipx",{"title":148,"path":149,"stem":150},"Netlify","\u002Fproviders\u002Fnetlify","3.providers\u002Fnetlify",{"title":152,"path":153,"stem":154},"None","\u002Fproviders\u002Fnone","3.providers\u002Fnone",{"title":156,"path":157,"stem":158},"Picsum","\u002Fproviders\u002Fpicsum","3.providers\u002Fpicsum",{"title":160,"path":161,"stem":162},"Prepr","\u002Fproviders\u002Fprepr","3.providers\u002Fprepr",{"title":164,"path":165,"stem":166},"Prismic","\u002Fproviders\u002Fprismic","3.providers\u002Fprismic",{"title":168,"path":169,"stem":170},"Sanity","\u002Fproviders\u002Fsanity","3.providers\u002Fsanity",{"title":172,"path":173,"stem":174},"Shopify","\u002Fproviders\u002Fshopify","3.providers\u002Fshopify",{"title":176,"path":177,"stem":178},"Sirv","\u002Fproviders\u002Fsirv","3.providers\u002Fsirv",{"title":180,"path":181,"stem":182},"Storyblok","\u002Fproviders\u002Fstoryblok","3.providers\u002Fstoryblok",{"title":184,"path":185,"stem":186},"Strapi","\u002Fproviders\u002Fstrapi","3.providers\u002Fstrapi",{"title":188,"path":189,"stem":190},"Supabase","\u002Fproviders\u002Fsupabase","3.providers\u002Fsupabase",{"title":192,"path":193,"stem":194},"Twicpics","\u002Fproviders\u002Ftwicpics","3.providers\u002Ftwicpics",{"title":196,"path":197,"stem":198},"Umbraco","\u002Fproviders\u002Fumbraco","3.providers\u002Fumbraco",{"title":200,"path":201,"stem":202},"Unsplash","\u002Fproviders\u002Funsplash","3.providers\u002Funsplash",{"title":204,"path":205,"stem":206},"Uploadcare","\u002Fproviders\u002Fuploadcare","3.providers\u002Fuploadcare",{"title":208,"path":209,"stem":210},"Vercel","\u002Fproviders\u002Fvercel","3.providers\u002Fvercel",{"title":212,"path":213,"stem":214},"Weserv","\u002Fproviders\u002Fweserv","3.providers\u002Fweserv",{"title":216,"path":217,"stem":218,"children":219,"page":29},"Advanced","\u002Fadvanced","4.advanced",[220,224],{"title":221,"path":222,"stem":223},"Custom Provider","\u002Fadvanced\u002Fcustom-provider","4.advanced\u002F1.custom-provider",{"title":225,"path":226,"stem":227},"Static Images","\u002Fadvanced\u002Fstatic-images","4.advanced\u002F2.static-images",{"id":229,"title":36,"body":230,"description":2832,"extension":896,"links":2833,"meta":2839,"navigation":630,"path":37,"seo":2840,"stem":38,"__hash__":2841},"docs\u002F2.usage\u002F1.nuxt-img.md",{"type":231,"value":232,"toc":2808},"minimark",[233,244,281,285,297,338,341,367,383,387,393,409,422,458,463,676,682,686,689,701,725,738,746,749,763,767,780,788,807,848,852,855,863,870,898,904,946,951,956,961,964,968,1031,1033,1086,1091,1094,1102,1105,1323,1331,1505,1510,1519,1601,1650,1655,1666,1670,1835,1840,1843,1853,2036,2040,2043,2084,2106,2110,2113,2181,2186,2191,2222,2286,2289,2294,2297,2303,2307,2400,2405,2412,2438,2466,2514,2519,2533,2540,2575,2580,2595,2708,2712,2723,2734,2804],[234,235,236,239,240,243],"p",{},[237,238,36],"code",{}," is a drop-in replacement for the native ",[237,241,242],{},"\u003Cimg>"," tag.",[245,246,247,251,258,268,275],"ul",{},[248,249,250],"li",{},"Uses built-in provider to optimize local and remote images",[248,252,253,254,257],{},"Converts ",[237,255,256],{},"src"," to provider optimized URLs",[248,259,260,261,264,265],{},"Automatically resizes images based on ",[237,262,263],{},"width"," and ",[237,266,267],{},"height",[248,269,270,271,274],{},"Generates responsive sizes when providing ",[237,272,273],{},"sizes"," option",[248,276,277,278,280],{},"Supports native lazy loading as well as other ",[237,279,242],{}," attributes",[282,283,31],"h2",{"id":284},"usage",[234,286,287,289,290,293,294,296],{},[237,288,36],{}," outputs a native ",[237,291,292],{},"img"," tag directly (without any wrapper around it). Use it like you would use the ",[237,295,242],{}," tag:",[298,299,304],"pre",{"className":300,"code":301,"language":302,"meta":303,"style":303},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" \u002F>\n","vue","",[237,305,306],{"__ignoreMap":303},[307,308,311,315,319,323,326,329,333,335],"span",{"class":309,"line":310},"line",1,[307,312,314],{"class":313},"sMK4o","\u003C",[307,316,318],{"class":317},"swJcz","NuxtImg",[307,320,322],{"class":321},"spNyl"," src",[307,324,325],{"class":313},"=",[307,327,328],{"class":313},"\"",[307,330,332],{"class":331},"sfazB","\u002Fnuxt-icon.png",[307,334,328],{"class":313},[307,336,337],{"class":313}," \u002F>\n",[234,339,340],{},"Will result in:",[298,342,346],{"className":343,"code":344,"language":345,"meta":303,"style":303},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cimg src=\"\u002Fnuxt-icon.png\">\n","html",[237,347,348],{"__ignoreMap":303},[307,349,350,352,354,356,358,360,362,364],{"class":309,"line":310},[307,351,314],{"class":313},[307,353,292],{"class":317},[307,355,322],{"class":321},[307,357,325],{"class":313},[307,359,328],{"class":313},[307,361,332],{"class":331},[307,363,328],{"class":313},[307,365,366],{"class":313},">\n",[368,369,370,371,375,376,378,379,382],"note",{},"With ",[372,373,374],"a",{"href":19},"default provider",", you should put ",[237,377,332],{}," inside ",[237,380,381],{},"public\u002F"," directory for Nuxt 3 make the above example work.",[282,384,386],{"id":385},"props","Props",[388,389,391],"h3",{"id":390},"custom",[237,392,390],{},[234,394,395,396,398,399,401,402,404,405,408],{},"The ",[237,397,390],{}," prop determines whether ",[237,400,36],{}," should render as a simple ",[237,403,242],{}," element or only serve as a provider for custom rendering. When set to ",[237,406,407],{},"true",", 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.",[234,410,411,412,414,415,417,418,421],{},"When using the ",[237,413,390],{}," prop, ",[237,416,36],{}," passes necessary data and attributes to its default slot. You can access the following values via the ",[237,419,420],{},"v-slot"," directive:",[245,423,424,447,452],{},[248,425,426,429,430,432,433,436,437,436,439,436,441,436,444,446],{},[237,427,428],{},"imgAttrs",": Attributes for the ",[237,431,242],{}," element (e.g., ",[237,434,435],{},"alt",", ",[237,438,263],{},[237,440,267],{},[237,442,443],{},"srcset",[237,445,273],{},").",[248,448,449,451],{},[237,450,256],{},": The computed image source URL.",[248,453,454,457],{},[237,455,456],{},"isLoaded",": A boolean indicating whether the image has been loaded.",[459,460,462],"h4",{"id":461},"example-usage","Example Usage",[298,464,466],{"className":300,"code":465,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Fimages\u002Fnuxt.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:\u002F\u002Fplacehold.co\u002F400x400\"\n    alt=\"placeholder\"\n  >\n\u003C\u002FNuxtImg>\n",[237,467,468,475,491,506,521,535,552,584,589,595,601,607,613,619,625,632,638,643,649,655,661,666],{"__ignoreMap":303},[307,469,470,472],{"class":309,"line":310},[307,471,314],{"class":313},[307,473,474],{"class":317},"NuxtImg\n",[307,476,478,481,483,485,488],{"class":309,"line":477},2,[307,479,480],{"class":321},"  src",[307,482,325],{"class":313},[307,484,328],{"class":313},[307,486,487],{"class":331},"\u002Fimages\u002Fnuxt.png",[307,489,490],{"class":313},"\"\n",[307,492,494,497,499,501,504],{"class":309,"line":493},3,[307,495,496],{"class":321},"  alt",[307,498,325],{"class":313},[307,500,328],{"class":313},[307,502,503],{"class":331},"image",[307,505,490],{"class":313},[307,507,509,512,514,516,519],{"class":309,"line":508},4,[307,510,511],{"class":321},"  width",[307,513,325],{"class":313},[307,515,328],{"class":313},[307,517,518],{"class":331},"400",[307,520,490],{"class":313},[307,522,524,527,529,531,533],{"class":309,"line":523},5,[307,525,526],{"class":321},"  height",[307,528,325],{"class":313},[307,530,328],{"class":313},[307,532,518],{"class":331},[307,534,490],{"class":313},[307,536,538,541,543,545,547,550],{"class":309,"line":537},6,[307,539,540],{"class":313},"  :",[307,542,390],{"class":321},[307,544,325],{"class":313},[307,546,328],{"class":313},[307,548,407],{"class":549},"sfNiH",[307,551,490],{"class":313},[307,553,555,558,560,562,565,568,571,574,576,579,582],{"class":309,"line":554},7,[307,556,557],{"class":321},"  v-slot",[307,559,325],{"class":313},[307,561,328],{"class":313},[307,563,564],{"class":313},"{",[307,566,322],{"class":567},"sTEyZ",[307,569,570],{"class":313},",",[307,572,573],{"class":567}," isLoaded",[307,575,570],{"class":313},[307,577,578],{"class":567}," imgAttrs ",[307,580,581],{"class":313},"}",[307,583,490],{"class":313},[307,585,587],{"class":309,"line":586},8,[307,588,366],{"class":313},[307,590,592],{"class":309,"line":591},9,[307,593,594],{"class":567},"  \u003C!-- Show the actual image when loaded -->\n",[307,596,598],{"class":309,"line":597},10,[307,599,600],{"class":567},"  \u003Cimg\n",[307,602,604],{"class":309,"line":603},11,[307,605,606],{"class":567},"    v-if=\"isLoaded\"\n",[307,608,610],{"class":309,"line":609},12,[307,611,612],{"class":567},"    v-bind=\"imgAttrs\"\n",[307,614,616],{"class":309,"line":615},13,[307,617,618],{"class":567},"    :src=\"src\"\n",[307,620,622],{"class":309,"line":621},14,[307,623,624],{"class":567},"  >\n",[307,626,628],{"class":309,"line":627},15,[307,629,631],{"emptyLinePlaceholder":630},true,"\n",[307,633,635],{"class":309,"line":634},16,[307,636,637],{"class":567},"  \u003C!-- Show a placeholder while loading -->\n",[307,639,641],{"class":309,"line":640},17,[307,642,600],{"class":567},[307,644,646],{"class":309,"line":645},18,[307,647,648],{"class":567},"    v-else\n",[307,650,652],{"class":309,"line":651},19,[307,653,654],{"class":567},"    src=\"https:\u002F\u002Fplacehold.co\u002F400x400\"\n",[307,656,658],{"class":309,"line":657},20,[307,659,660],{"class":567},"    alt=\"placeholder\"\n",[307,662,664],{"class":309,"line":663},21,[307,665,624],{"class":567},[307,667,669,672,674],{"class":309,"line":668},22,[307,670,671],{"class":313},"\u003C\u002F",[307,673,318],{"class":317},[307,675,366],{"class":313},[234,677,678,679,681],{},"This approach ensures flexibility for custom rendering scenarios, while ",[237,680,36],{}," continues to handle image optimization and data provisioning behind the scenes.",[388,683,684],{"id":256},[237,685,256],{},[234,687,688],{},"Path to image file",[234,690,691,693,694,696,697,700],{},[237,692,256],{}," should be in the form of an absolute path for static images in ",[237,695,381],{}," directory.\nOtherwise path that is expected by provider that starts with ",[237,698,699],{},"\u002F"," or a URL.",[298,702,704],{"className":300,"code":703,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt.png\" \u002F>\n",[237,705,706],{"__ignoreMap":303},[307,707,708,710,712,714,716,718,721,723],{"class":309,"line":310},[307,709,314],{"class":313},[307,711,318],{"class":317},[307,713,322],{"class":321},[307,715,325],{"class":313},[307,717,328],{"class":313},[307,719,720],{"class":331},"\u002Fnuxt.png",[307,722,328],{"class":313},[307,724,337],{"class":313},[234,726,727,728,730,731,737],{},"For image optimization when using external URLs in ",[237,729,256],{},", we need to whitelist them using ",[372,732,734],{"href":733},"\u002Fget-started\u002Fconfiguration#domains",[237,735,736],{},"domains"," option.",[388,739,741,743,744],{"id":740},"width-height",[237,742,263],{}," \u002F ",[237,745,267],{},[234,747,748],{},"Specify width\u002Fheight of the image.",[245,750,751,754],{},[248,752,753],{},"Use desired width\u002Fheight for static sized images like icons or avatars",[248,755,756,757,762],{},"Use original image width\u002Fheight for responsive images (when using ",[372,758,760],{"href":759},"#sizes",[237,761,273],{},")",[388,764,765],{"id":435},[237,766,435],{},[234,768,769,770,772,773,779],{},"Although Nuxt Image does not apply any special handling, it's worth mentioning the ",[237,771,435],{}," attribute. It is a ",[372,774,778],{"href":775,"rel":776},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FHTMLImageElement\u002Falt",[777],"nofollow","native"," global attribute that specifies an alternate text for an image, if the image cannot be displayed.",[234,781,782,783,787],{},"It ",[784,785,786],"em",{},"should always"," be provided.",[245,789,790,793,800],{},[248,791,792],{},"The text should describe the image if the image contains information",[248,794,795,796,799],{},"The text should explain where the link goes if the image is inside an ",[237,797,798],{},"\u003Ca>"," element",[248,801,802,803,806],{},"Use ",[237,804,805],{},"alt=\"\""," if the image is only for decoration",[298,808,810],{"className":300,"code":809,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Fnuxt.png\"\n  alt=\"My image file description\"\n\u002F>\n",[237,811,812,818,830,843],{"__ignoreMap":303},[307,813,814,816],{"class":309,"line":310},[307,815,314],{"class":313},[307,817,474],{"class":317},[307,819,820,822,824,826,828],{"class":309,"line":477},[307,821,480],{"class":321},[307,823,325],{"class":313},[307,825,328],{"class":313},[307,827,720],{"class":331},[307,829,490],{"class":313},[307,831,832,834,836,838,841],{"class":309,"line":493},[307,833,496],{"class":321},[307,835,325],{"class":313},[307,837,328],{"class":313},[307,839,840],{"class":331},"My image file description",[307,842,490],{"class":313},[307,844,845],{"class":309,"line":508},[307,846,847],{"class":567},"\u002F>\n",[388,849,850],{"id":273},[237,851,273],{},[234,853,854],{},"Specify responsive sizes.",[234,856,857,858,862],{},"This is a space-separated list of screen size\u002Fwidth pairs. You can ",[372,859,861],{"href":860},"\u002Fget-started\u002Fconfiguration#screens","see a list of the defined screen sizes here",".",[234,864,865,866,869],{},"By default Nuxt generates ",[784,867,868],{},"responsive-first"," sizing.",[245,871,872,879],{},[248,873,874,875,878],{},"If you omit a screen size prefix (like ",[237,876,877],{},"sm:",") then this size is the 'default' size of the image. Otherwise, Nuxt will pick the smallest size as the default size of the image.",[248,880,881,882,885,886,889,890,893,894,897],{},"This default size is used up until the next specified screen width, and so on. Each specified size pair applies ",[784,883,884],{},"up"," - so ",[237,887,888],{},"md:400px"," means that the image will be sized ",[237,891,892],{},"400px"," on ",[237,895,896],{},"md"," screens and up.",[234,899,900],{},[901,902,903],"strong",{},"Example:",[298,905,907],{"className":300,"code":906,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Flogos\u002Fnuxt.png\"\n  sizes=\"100vw sm:50vw md:400px\"\n\u002F>\n",[237,908,909,915,928,942],{"__ignoreMap":303},[307,910,911,913],{"class":309,"line":310},[307,912,314],{"class":313},[307,914,474],{"class":317},[307,916,917,919,921,923,926],{"class":309,"line":477},[307,918,480],{"class":321},[307,920,325],{"class":313},[307,922,328],{"class":313},[307,924,925],{"class":331},"\u002Flogos\u002Fnuxt.png",[307,927,490],{"class":313},[307,929,930,933,935,937,940],{"class":309,"line":493},[307,931,932],{"class":321},"  sizes",[307,934,325],{"class":313},[307,936,328],{"class":313},[307,938,939],{"class":331},"100vw sm:50vw md:400px",[307,941,490],{"class":313},[307,943,944],{"class":309,"line":508},[307,945,847],{"class":567},[388,947,949],{"id":948},"densities",[237,950,948],{},[234,952,395,953,955],{},[237,954,948],{}," prop serves high-resolution images for Retina\u002FHiDPI screens.",[234,957,958,959,862],{},"Nuxt Image generates multiple versions at different pixel densities and creates the appropriate ",[237,960,443],{},[234,962,963],{},"When you specify densities, Nuxt Image multiplies your base dimensions by each density value to generate the corresponding image sizes.",[234,965,966],{},[901,967,903],{},[298,969,971],{"className":300,"code":970,"language":302,"meta":303,"style":303},"\u003C!-- Small icon, sharp on all screen densities -->\n\u003CNuxtImg \n  src=\"\u002Fnuxt.png\"\n  height=\"50\"\n  densities=\"x1 x2\"\n\u002F>\n",[237,972,973,979,988,1000,1013,1027],{"__ignoreMap":303},[307,974,975],{"class":309,"line":310},[307,976,978],{"class":977},"sHwdD","\u003C!-- Small icon, sharp on all screen densities -->\n",[307,980,981,983,985],{"class":309,"line":477},[307,982,314],{"class":313},[307,984,318],{"class":317},[307,986,987],{"class":567}," \n",[307,989,990,992,994,996,998],{"class":309,"line":493},[307,991,480],{"class":321},[307,993,325],{"class":313},[307,995,328],{"class":313},[307,997,720],{"class":331},[307,999,490],{"class":313},[307,1001,1002,1004,1006,1008,1011],{"class":309,"line":508},[307,1003,526],{"class":321},[307,1005,325],{"class":313},[307,1007,328],{"class":313},[307,1009,1010],{"class":331},"50",[307,1012,490],{"class":313},[307,1014,1015,1018,1020,1022,1025],{"class":309,"line":523},[307,1016,1017],{"class":321},"  densities",[307,1019,325],{"class":313},[307,1021,328],{"class":313},[307,1023,1024],{"class":331},"x1 x2",[307,1026,490],{"class":313},[307,1028,1029],{"class":309,"line":537},[307,1030,847],{"class":567},[234,1032,340],{},[298,1034,1036],{"className":343,"code":1035,"language":345,"meta":303,"style":303},"\u003C!-- Rendered HTML -->\n\u003Cimg\n  src=\"\u002F_ipx\u002Fw_50\u002Fnuxt.png\"\n  srcset=\"\u002F_ipx\u002Fw_50\u002Fnuxt.png 1x,\n          \u002F_ipx\u002Fw_100\u002Fnuxt.png 2x\"\n\u002F>\n",[237,1037,1038,1043,1050,1063,1075,1082],{"__ignoreMap":303},[307,1039,1040],{"class":309,"line":310},[307,1041,1042],{"class":977},"\u003C!-- Rendered HTML -->\n",[307,1044,1045,1047],{"class":309,"line":477},[307,1046,314],{"class":313},[307,1048,1049],{"class":317},"img\n",[307,1051,1052,1054,1056,1058,1061],{"class":309,"line":493},[307,1053,480],{"class":321},[307,1055,325],{"class":313},[307,1057,328],{"class":313},[307,1059,1060],{"class":331},"\u002F_ipx\u002Fw_50\u002Fnuxt.png",[307,1062,490],{"class":313},[307,1064,1065,1068,1070,1072],{"class":309,"line":508},[307,1066,1067],{"class":321},"  srcset",[307,1069,325],{"class":313},[307,1071,328],{"class":313},[307,1073,1074],{"class":331},"\u002F_ipx\u002Fw_50\u002Fnuxt.png 1x,\n",[307,1076,1077,1080],{"class":309,"line":523},[307,1078,1079],{"class":331},"          \u002F_ipx\u002Fw_100\u002Fnuxt.png 2x",[307,1081,490],{"class":313},[307,1083,1084],{"class":309,"line":537},[307,1085,847],{"class":313},[388,1087,1089],{"id":1088},"placeholder",[237,1090,1088],{},[234,1092,1093],{},"Display a placeholder image before the actual image is fully loaded.",[234,1095,1096,1097,1101],{},"You can also use the ",[372,1098,1100],{"href":1099},"\u002Fusage\u002Fnuxt-img#custom","custom prop"," to make any placeholder you want.",[234,1103,1104],{},"The placeholder prop can be either a string, a boolean, a number, or an array. The usage is shown below for each case.",[298,1106,1108],{"className":300,"code":1107,"language":302,"meta":303,"style":303},"\u003C!-- Automatically generate a placeholder based on the original image -->\n\u003CNuxtImg src=\"\u002Fnuxt.png\" placeholder \u002F>\n\n\u003C!-- Set a width, height for the automatically generated placeholder  -->\n\u003CNuxtImg src=\"\u002Fnuxt.png\" :placeholder=\"[50, 25]\" \u002F>\n\n\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n\u003CNuxtImg src=\"\u002Fnuxt.png\" :placeholder=\"[50, 25, 75, 5]\" \u002F>\n\n\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n\u003CNuxtImg src=\"\u002Fnuxt.png\" :placeholder=\"15\" \u002F>\n\n\u003C!-- Provide your own image -->\n\u003CNuxtImg src=\"\u002Fnuxt.png\" placeholder=\".\u002Fplaceholder.png\" \u002F>\n",[237,1109,1110,1115,1136,1140,1145,1188,1192,1197,1245,1249,1254,1285,1289,1294],{"__ignoreMap":303},[307,1111,1112],{"class":309,"line":310},[307,1113,1114],{"class":977},"\u003C!-- Automatically generate a placeholder based on the original image -->\n",[307,1116,1117,1119,1121,1123,1125,1127,1129,1131,1134],{"class":309,"line":477},[307,1118,314],{"class":313},[307,1120,318],{"class":317},[307,1122,322],{"class":321},[307,1124,325],{"class":313},[307,1126,328],{"class":313},[307,1128,720],{"class":331},[307,1130,328],{"class":313},[307,1132,1133],{"class":321}," placeholder",[307,1135,337],{"class":313},[307,1137,1138],{"class":309,"line":493},[307,1139,631],{"emptyLinePlaceholder":630},[307,1141,1142],{"class":309,"line":508},[307,1143,1144],{"class":977},"\u003C!-- Set a width, height for the automatically generated placeholder  -->\n",[307,1146,1147,1149,1151,1153,1155,1157,1159,1161,1164,1166,1168,1170,1173,1176,1178,1181,1184,1186],{"class":309,"line":523},[307,1148,314],{"class":313},[307,1150,318],{"class":317},[307,1152,322],{"class":321},[307,1154,325],{"class":313},[307,1156,328],{"class":313},[307,1158,720],{"class":331},[307,1160,328],{"class":313},[307,1162,1163],{"class":313}," :",[307,1165,1088],{"class":321},[307,1167,325],{"class":313},[307,1169,328],{"class":313},[307,1171,1172],{"class":567},"[",[307,1174,1010],{"class":1175},"sbssI",[307,1177,570],{"class":313},[307,1179,1180],{"class":1175}," 25",[307,1182,1183],{"class":567},"]",[307,1185,328],{"class":313},[307,1187,337],{"class":313},[307,1189,1190],{"class":309,"line":537},[307,1191,631],{"emptyLinePlaceholder":630},[307,1193,1194],{"class":309,"line":554},[307,1195,1196],{"class":977},"\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n",[307,1198,1199,1201,1203,1205,1207,1209,1211,1213,1215,1217,1219,1221,1223,1225,1227,1229,1231,1234,1236,1239,1241,1243],{"class":309,"line":586},[307,1200,314],{"class":313},[307,1202,318],{"class":317},[307,1204,322],{"class":321},[307,1206,325],{"class":313},[307,1208,328],{"class":313},[307,1210,720],{"class":331},[307,1212,328],{"class":313},[307,1214,1163],{"class":313},[307,1216,1088],{"class":321},[307,1218,325],{"class":313},[307,1220,328],{"class":313},[307,1222,1172],{"class":567},[307,1224,1010],{"class":1175},[307,1226,570],{"class":313},[307,1228,1180],{"class":1175},[307,1230,570],{"class":313},[307,1232,1233],{"class":1175}," 75",[307,1235,570],{"class":313},[307,1237,1238],{"class":1175}," 5",[307,1240,1183],{"class":567},[307,1242,328],{"class":313},[307,1244,337],{"class":313},[307,1246,1247],{"class":309,"line":591},[307,1248,631],{"emptyLinePlaceholder":630},[307,1250,1251],{"class":309,"line":597},[307,1252,1253],{"class":977},"\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n",[307,1255,1256,1258,1260,1262,1264,1266,1268,1270,1272,1274,1276,1278,1281,1283],{"class":309,"line":603},[307,1257,314],{"class":313},[307,1259,318],{"class":317},[307,1261,322],{"class":321},[307,1263,325],{"class":313},[307,1265,328],{"class":313},[307,1267,720],{"class":331},[307,1269,328],{"class":313},[307,1271,1163],{"class":313},[307,1273,1088],{"class":321},[307,1275,325],{"class":313},[307,1277,328],{"class":313},[307,1279,1280],{"class":1175},"15",[307,1282,328],{"class":313},[307,1284,337],{"class":313},[307,1286,1287],{"class":309,"line":609},[307,1288,631],{"emptyLinePlaceholder":630},[307,1290,1291],{"class":309,"line":615},[307,1292,1293],{"class":977},"\u003C!-- Provide your own image -->\n",[307,1295,1296,1298,1300,1302,1304,1306,1308,1310,1312,1314,1316,1319,1321],{"class":309,"line":621},[307,1297,314],{"class":313},[307,1299,318],{"class":317},[307,1301,322],{"class":321},[307,1303,325],{"class":313},[307,1305,328],{"class":313},[307,1307,720],{"class":331},[307,1309,328],{"class":313},[307,1311,1133],{"class":321},[307,1313,325],{"class":313},[307,1315,328],{"class":313},[307,1317,1318],{"class":331},".\u002Fplaceholder.png",[307,1320,328],{"class":313},[307,1322,337],{"class":313},[234,1324,1325,1326,1330],{},"You can also leverage ",[372,1327,1328],{"href":45},[237,1329,44],{}," 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:",[298,1332,1334],{"className":300,"code":1333,"language":302,"meta":303,"style":303},"\u003Ctemplate>\n  \u003CNuxtImg\n    src=\"\u002Fnuxt.svg\"\n    :placeholder=\"img(`\u002Fnuxt.svg`, { height: 10, format: 'png', blur: 2, quality: 50 })\"\n  \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nconst img = useImage()\n\u003C\u002Fscript>\n",[237,1335,1336,1345,1352,1366,1440,1445,1453,1457,1481,1497],{"__ignoreMap":303},[307,1337,1338,1340,1343],{"class":309,"line":310},[307,1339,314],{"class":313},[307,1341,1342],{"class":317},"template",[307,1344,366],{"class":313},[307,1346,1347,1350],{"class":309,"line":477},[307,1348,1349],{"class":313},"  \u003C",[307,1351,474],{"class":317},[307,1353,1354,1357,1359,1361,1364],{"class":309,"line":493},[307,1355,1356],{"class":321},"    src",[307,1358,325],{"class":313},[307,1360,328],{"class":313},[307,1362,1363],{"class":331},"\u002Fnuxt.svg",[307,1365,490],{"class":313},[307,1367,1368,1371,1373,1375,1377,1380,1383,1386,1388,1390,1393,1395,1398,1401,1403,1406,1408,1411,1414,1416,1418,1421,1423,1426,1428,1431,1433,1435,1438],{"class":309,"line":508},[307,1369,1370],{"class":313},"    :",[307,1372,1088],{"class":321},[307,1374,325],{"class":313},[307,1376,328],{"class":313},[307,1378,292],{"class":1379},"s2Zo4",[307,1381,1382],{"class":313},"(",[307,1384,1385],{"class":313},"`",[307,1387,1363],{"class":331},[307,1389,1385],{"class":313},[307,1391,1392],{"class":313},", { ",[307,1394,267],{"class":317},[307,1396,1397],{"class":313},": ",[307,1399,1400],{"class":1175},"10",[307,1402,436],{"class":313},[307,1404,1405],{"class":317},"format",[307,1407,1397],{"class":313},[307,1409,1410],{"class":313},"'",[307,1412,1413],{"class":331},"png",[307,1415,1410],{"class":313},[307,1417,436],{"class":313},[307,1419,1420],{"class":317},"blur",[307,1422,1397],{"class":313},[307,1424,1425],{"class":1175},"2",[307,1427,436],{"class":313},[307,1429,1430],{"class":317},"quality",[307,1432,1397],{"class":313},[307,1434,1010],{"class":1175},[307,1436,1437],{"class":313}," })",[307,1439,490],{"class":313},[307,1441,1442],{"class":309,"line":523},[307,1443,1444],{"class":313},"  \u002F>\n",[307,1446,1447,1449,1451],{"class":309,"line":537},[307,1448,671],{"class":313},[307,1450,1342],{"class":317},[307,1452,366],{"class":313},[307,1454,1455],{"class":309,"line":554},[307,1456,631],{"emptyLinePlaceholder":630},[307,1458,1459,1461,1464,1467,1470,1472,1474,1477,1479],{"class":309,"line":586},[307,1460,314],{"class":313},[307,1462,1463],{"class":317},"script",[307,1465,1466],{"class":321}," setup",[307,1468,1469],{"class":321}," lang",[307,1471,325],{"class":313},[307,1473,328],{"class":313},[307,1475,1476],{"class":331},"ts",[307,1478,328],{"class":313},[307,1480,366],{"class":313},[307,1482,1483,1486,1489,1491,1494],{"class":309,"line":591},[307,1484,1485],{"class":321},"const",[307,1487,1488],{"class":567}," img ",[307,1490,325],{"class":313},[307,1492,1493],{"class":1379}," useImage",[307,1495,1496],{"class":567},"()\n",[307,1498,1499,1501,1503],{"class":309,"line":597},[307,1500,671],{"class":313},[307,1502,1463],{"class":317},[307,1504,366],{"class":313},[388,1506,1508],{"id":1507},"placeholder-class",[237,1509,1507],{},[234,1511,1512,1513,1515,1516,1518],{},"When using a placeholder, you can use ",[237,1514,1507],{}," to apply a class to the original underlying ",[237,1517,242],{}," element (while the placeholder is being rendered).",[298,1520,1522],{"className":300,"code":1521,"language":302,"meta":303,"style":303},"\u003C!-- Apply a static class to the original image -->\n\u003CNuxtImg\n  src=\"\u002Fnuxt.png\"\n  placeholder\n  placeholder-class=\"custom\"\n\u002F>\n\n\u003C!-- Apply a dynamic class to the original image -->\n\u003CNuxtImg\n  src=\"\u002Fnuxt.png\"\n  placeholder\n  :placeholder-class=\"custom\"\n\u002F>\n",[237,1523,1524,1529,1535,1547,1552,1565,1569,1573,1578,1583,1588,1592,1597],{"__ignoreMap":303},[307,1525,1526],{"class":309,"line":310},[307,1527,1528],{"class":977},"\u003C!-- Apply a static class to the original image -->\n",[307,1530,1531,1533],{"class":309,"line":477},[307,1532,314],{"class":313},[307,1534,474],{"class":317},[307,1536,1537,1539,1541,1543,1545],{"class":309,"line":493},[307,1538,480],{"class":321},[307,1540,325],{"class":313},[307,1542,328],{"class":313},[307,1544,720],{"class":331},[307,1546,490],{"class":313},[307,1548,1549],{"class":309,"line":508},[307,1550,1551],{"class":321},"  placeholder\n",[307,1553,1554,1557,1559,1561,1563],{"class":309,"line":523},[307,1555,1556],{"class":321},"  placeholder-class",[307,1558,325],{"class":313},[307,1560,328],{"class":313},[307,1562,390],{"class":331},[307,1564,490],{"class":313},[307,1566,1567],{"class":309,"line":537},[307,1568,847],{"class":567},[307,1570,1571],{"class":309,"line":554},[307,1572,631],{"emptyLinePlaceholder":630},[307,1574,1575],{"class":309,"line":586},[307,1576,1577],{"class":567},"\u003C!-- Apply a dynamic class to the original image -->\n",[307,1579,1580],{"class":309,"line":591},[307,1581,1582],{"class":567},"\u003CNuxtImg\n",[307,1584,1585],{"class":309,"line":597},[307,1586,1587],{"class":567},"  src=\"\u002Fnuxt.png\"\n",[307,1589,1590],{"class":309,"line":603},[307,1591,1551],{"class":567},[307,1593,1594],{"class":309,"line":609},[307,1595,1596],{"class":567},"  :placeholder-class=\"custom\"\n",[307,1598,1599],{"class":309,"line":615},[307,1600,847],{"class":567},[1602,1603,1604,1611],"tip",{},[234,1605,1606,1607,1610],{},"If you need to apply some CSS to only the ",[784,1608,1609],{},"loaded"," image you can do so with something like:",[298,1612,1616],{"className":1613,"code":1614,"language":1615,"meta":303,"style":303},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","img:not(.my-placeholder-class) {\n  \u002F* styles here *\u002F\n}\n","css",[237,1617,1618,1640,1645],{"__ignoreMap":303},[307,1619,1620,1623,1626,1629,1632,1635,1637],{"class":309,"line":310},[307,1621,292],{"class":1622},"sBMFI",[307,1624,1625],{"class":313},":",[307,1627,1628],{"class":321},"not",[307,1630,1631],{"class":313},"(.",[307,1633,1634],{"class":1622},"my-placeholder-class",[307,1636,762],{"class":313},[307,1638,1639],{"class":313}," {\n",[307,1641,1642],{"class":309,"line":477},[307,1643,1644],{"class":977},"  \u002F* styles here *\u002F\n",[307,1646,1647],{"class":309,"line":493},[307,1648,1649],{"class":313},"}\n",[388,1651,1653],{"id":1652},"provider",[237,1654,1652],{},[234,1656,1657,1658,1662,1663],{},"Use other provider instead of default ",[372,1659,1661],{"href":1660},"\u002Fget-started\u002Fconfiguration#provider","provider option"," specified in ",[237,1664,1665],{},"nuxt.config",[234,1667,1668],{},[901,1669,903],{},[1671,1672,1673,1760],"code-group",{},[298,1674,1677],{"className":300,"code":1675,"filename":1676,"language":302,"meta":303,"style":303},"\u003Ctemplate>\n  \u003CNuxtImg\n    provider=\"cloudinary\"\n    src=\"\u002Fremote\u002Fnuxt-org\u002Fblog\u002Fgoing-full-static\u002Fmain.png\"\n    width=\"300\"\n    height=\"169\"\n  \u002F>\n\u003C\u002Ftemplate>\n","index.vue",[237,1678,1679,1687,1693,1707,1720,1734,1748,1752],{"__ignoreMap":303},[307,1680,1681,1683,1685],{"class":309,"line":310},[307,1682,314],{"class":313},[307,1684,1342],{"class":317},[307,1686,366],{"class":313},[307,1688,1689,1691],{"class":309,"line":477},[307,1690,1349],{"class":313},[307,1692,474],{"class":317},[307,1694,1695,1698,1700,1702,1705],{"class":309,"line":493},[307,1696,1697],{"class":321},"    provider",[307,1699,325],{"class":313},[307,1701,328],{"class":313},[307,1703,1704],{"class":331},"cloudinary",[307,1706,490],{"class":313},[307,1708,1709,1711,1713,1715,1718],{"class":309,"line":508},[307,1710,1356],{"class":321},[307,1712,325],{"class":313},[307,1714,328],{"class":313},[307,1716,1717],{"class":331},"\u002Fremote\u002Fnuxt-org\u002Fblog\u002Fgoing-full-static\u002Fmain.png",[307,1719,490],{"class":313},[307,1721,1722,1725,1727,1729,1732],{"class":309,"line":523},[307,1723,1724],{"class":321},"    width",[307,1726,325],{"class":313},[307,1728,328],{"class":313},[307,1730,1731],{"class":331},"300",[307,1733,490],{"class":313},[307,1735,1736,1739,1741,1743,1746],{"class":309,"line":537},[307,1737,1738],{"class":321},"    height",[307,1740,325],{"class":313},[307,1742,328],{"class":313},[307,1744,1745],{"class":331},"169",[307,1747,490],{"class":313},[307,1749,1750],{"class":309,"line":554},[307,1751,1444],{"class":313},[307,1753,1754,1756,1758],{"class":309,"line":586},[307,1755,671],{"class":313},[307,1757,1342],{"class":317},[307,1759,366],{"class":313},[298,1761,1765],{"className":1762,"code":1763,"filename":1764,"language":1476,"meta":303,"style":303},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  image: {\n    cloudinary: {\n      baseURL: 'https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fimage\u002Fupload'\n    }\n  }\n})\n","nuxt.config.ts",[237,1766,1767,1784,1793,1802,1818,1823,1828],{"__ignoreMap":303},[307,1768,1769,1773,1776,1779,1781],{"class":309,"line":310},[307,1770,1772],{"class":1771},"s7zQu","export",[307,1774,1775],{"class":1771}," default",[307,1777,1778],{"class":1379}," defineNuxtConfig",[307,1780,1382],{"class":567},[307,1782,1783],{"class":313},"{\n",[307,1785,1786,1789,1791],{"class":309,"line":477},[307,1787,1788],{"class":317},"  image",[307,1790,1625],{"class":313},[307,1792,1639],{"class":313},[307,1794,1795,1798,1800],{"class":309,"line":493},[307,1796,1797],{"class":317},"    cloudinary",[307,1799,1625],{"class":313},[307,1801,1639],{"class":313},[307,1803,1804,1807,1809,1812,1815],{"class":309,"line":508},[307,1805,1806],{"class":317},"      baseURL",[307,1808,1625],{"class":313},[307,1810,1811],{"class":313}," '",[307,1813,1814],{"class":331},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fimage\u002Fupload",[307,1816,1817],{"class":313},"'\n",[307,1819,1820],{"class":309,"line":523},[307,1821,1822],{"class":313},"    }\n",[307,1824,1825],{"class":309,"line":537},[307,1826,1827],{"class":313},"  }\n",[307,1829,1830,1832],{"class":309,"line":554},[307,1831,581],{"class":313},[307,1833,1834],{"class":567},")\n",[388,1836,1838],{"id":1837},"preset",[237,1839,1837],{},[234,1841,1842],{},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",[368,1844,1845,1846,1850,1851],{},"We can define presets using ",[372,1847,1849],{"href":1848},"\u002Fget-started\u002Fconfiguration#presets","presets options"," in ",[237,1852,1665],{},[1671,1854,1855,1906],{},[298,1856,1858],{"className":300,"code":1857,"filename":1676,"language":302,"meta":303,"style":303},"\u003Ctemplate>\n  \u003CNuxtImg preset=\"cover\" src=\"\u002Fnuxt-icon.png\" \u002F>\n\u003C\u002Ftemplate>\n",[237,1859,1860,1868,1898],{"__ignoreMap":303},[307,1861,1862,1864,1866],{"class":309,"line":310},[307,1863,314],{"class":313},[307,1865,1342],{"class":317},[307,1867,366],{"class":313},[307,1869,1870,1872,1874,1877,1879,1881,1884,1886,1888,1890,1892,1894,1896],{"class":309,"line":477},[307,1871,1349],{"class":313},[307,1873,318],{"class":317},[307,1875,1876],{"class":321}," preset",[307,1878,325],{"class":313},[307,1880,328],{"class":313},[307,1882,1883],{"class":331},"cover",[307,1885,328],{"class":313},[307,1887,322],{"class":321},[307,1889,325],{"class":313},[307,1891,328],{"class":313},[307,1893,332],{"class":331},[307,1895,328],{"class":313},[307,1897,337],{"class":313},[307,1899,1900,1902,1904],{"class":309,"line":493},[307,1901,671],{"class":313},[307,1903,1342],{"class":317},[307,1905,366],{"class":313},[298,1907,1909],{"className":1762,"code":1908,"filename":1764,"language":1476,"meta":303,"style":303},"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",[237,1910,1911,1923,1931,1940,1949,1958,1974,1990,2002,2012,2017,2022,2026,2030],{"__ignoreMap":303},[307,1912,1913,1915,1917,1919,1921],{"class":309,"line":310},[307,1914,1772],{"class":1771},[307,1916,1775],{"class":1771},[307,1918,1778],{"class":1379},[307,1920,1382],{"class":567},[307,1922,1783],{"class":313},[307,1924,1925,1927,1929],{"class":309,"line":477},[307,1926,1788],{"class":317},[307,1928,1625],{"class":313},[307,1930,1639],{"class":313},[307,1932,1933,1936,1938],{"class":309,"line":493},[307,1934,1935],{"class":317},"    presets",[307,1937,1625],{"class":313},[307,1939,1639],{"class":313},[307,1941,1942,1945,1947],{"class":309,"line":508},[307,1943,1944],{"class":317},"      cover",[307,1946,1625],{"class":313},[307,1948,1639],{"class":313},[307,1950,1951,1954,1956],{"class":309,"line":523},[307,1952,1953],{"class":317},"        modifiers",[307,1955,1625],{"class":313},[307,1957,1639],{"class":313},[307,1959,1960,1963,1965,1967,1969,1971],{"class":309,"line":537},[307,1961,1962],{"class":317},"          fit",[307,1964,1625],{"class":313},[307,1966,1811],{"class":313},[307,1968,1883],{"class":331},[307,1970,1410],{"class":313},[307,1972,1973],{"class":313},",\n",[307,1975,1976,1979,1981,1983,1986,1988],{"class":309,"line":554},[307,1977,1978],{"class":317},"          format",[307,1980,1625],{"class":313},[307,1982,1811],{"class":313},[307,1984,1985],{"class":331},"jpg",[307,1987,1410],{"class":313},[307,1989,1973],{"class":313},[307,1991,1992,1995,1997,2000],{"class":309,"line":586},[307,1993,1994],{"class":317},"          width",[307,1996,1625],{"class":313},[307,1998,1999],{"class":1175}," 300",[307,2001,1973],{"class":313},[307,2003,2004,2007,2009],{"class":309,"line":591},[307,2005,2006],{"class":317},"          height",[307,2008,1625],{"class":313},[307,2010,2011],{"class":1175}," 300\n",[307,2013,2014],{"class":309,"line":597},[307,2015,2016],{"class":313},"        }\n",[307,2018,2019],{"class":309,"line":603},[307,2020,2021],{"class":313},"      }\n",[307,2023,2024],{"class":309,"line":609},[307,2025,1822],{"class":313},[307,2027,2028],{"class":309,"line":615},[307,2029,1827],{"class":313},[307,2031,2032,2034],{"class":309,"line":621},[307,2033,581],{"class":313},[307,2035,1834],{"class":567},[388,2037,2038],{"id":1405},[237,2039,1405],{},[234,2041,2042],{},"In case you want to serve images in a specific format, use this prop.",[298,2044,2046],{"className":300,"code":2045,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  format=\"webp\"\n  src=\"\u002Fnuxt-icon.png\"\n\u002F>\n",[237,2047,2048,2054,2068,2080],{"__ignoreMap":303},[307,2049,2050,2052],{"class":309,"line":310},[307,2051,314],{"class":313},[307,2053,474],{"class":317},[307,2055,2056,2059,2061,2063,2066],{"class":309,"line":477},[307,2057,2058],{"class":321},"  format",[307,2060,325],{"class":313},[307,2062,328],{"class":313},[307,2064,2065],{"class":331},"webp",[307,2067,490],{"class":313},[307,2069,2070,2072,2074,2076,2078],{"class":309,"line":493},[307,2071,480],{"class":321},[307,2073,325],{"class":313},[307,2075,328],{"class":313},[307,2077,332],{"class":331},[307,2079,490],{"class":313},[307,2081,2082],{"class":309,"line":508},[307,2083,847],{"class":567},[234,2085,2086,2087,436,2089,436,2092,436,2095,436,2097,436,2099,264,2102,2105],{},"Available formats are ",[237,2088,2065],{},[237,2090,2091],{},"avif",[237,2093,2094],{},"jpeg",[237,2096,1985],{},[237,2098,1413],{},[237,2100,2101],{},"gif",[237,2103,2104],{},"svg",". If the format is not specified, it will respect the default image format.",[388,2107,2108],{"id":1430},[237,2109,1430],{},[234,2111,2112],{},"The quality for the generated image(s).",[298,2114,2116],{"className":300,"code":2115,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Fnuxt.jpg\"\n  quality=\"80\"\n  width=\"200\"\n  height=\"100\"\n\u002F>\n",[237,2117,2118,2124,2137,2151,2164,2177],{"__ignoreMap":303},[307,2119,2120,2122],{"class":309,"line":310},[307,2121,314],{"class":313},[307,2123,474],{"class":317},[307,2125,2126,2128,2130,2132,2135],{"class":309,"line":477},[307,2127,480],{"class":321},[307,2129,325],{"class":313},[307,2131,328],{"class":313},[307,2133,2134],{"class":331},"\u002Fnuxt.jpg",[307,2136,490],{"class":313},[307,2138,2139,2142,2144,2146,2149],{"class":309,"line":493},[307,2140,2141],{"class":321},"  quality",[307,2143,325],{"class":313},[307,2145,328],{"class":313},[307,2147,2148],{"class":331},"80",[307,2150,490],{"class":313},[307,2152,2153,2155,2157,2159,2162],{"class":309,"line":508},[307,2154,511],{"class":321},[307,2156,325],{"class":313},[307,2158,328],{"class":313},[307,2160,2161],{"class":331},"200",[307,2163,490],{"class":313},[307,2165,2166,2168,2170,2172,2175],{"class":309,"line":523},[307,2167,526],{"class":321},[307,2169,325],{"class":313},[307,2171,328],{"class":313},[307,2173,2174],{"class":331},"100",[307,2176,490],{"class":313},[307,2178,2179],{"class":309,"line":537},[307,2180,847],{"class":567},[388,2182,2184],{"id":2183},"fit",[237,2185,2183],{},[234,2187,395,2188,2190],{},[237,2189,2183],{}," property specifies the size of the images.\nThere are five standard values you can use with this property.",[245,2192,2193,2198,2204,2210,2216],{},[248,2194,2195,2197],{},[237,2196,1883],{},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping\u002Fclipping to fit",[248,2199,2200,2203],{},[237,2201,2202],{},"contain",": Preserving aspect ratio, contain within both provided dimensions using 'letterboxing' where necessary.",[248,2205,2206,2209],{},[237,2207,2208],{},"fill",": Ignore the aspect ratio of the input and stretch to both provided dimensions.",[248,2211,2212,2215],{},[237,2213,2214],{},"inside",": 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.",[248,2217,2218,2221],{},[237,2219,2220],{},"outside",": 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.",[298,2223,2225],{"className":300,"code":2224,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  fit=\"cover\"\n  src=\"\u002Fnuxt-icon.png\"\n  width=\"200\"\n  height=\"100\"\n\u002F>\n",[237,2226,2227,2233,2246,2258,2270,2282],{"__ignoreMap":303},[307,2228,2229,2231],{"class":309,"line":310},[307,2230,314],{"class":313},[307,2232,474],{"class":317},[307,2234,2235,2238,2240,2242,2244],{"class":309,"line":477},[307,2236,2237],{"class":321},"  fit",[307,2239,325],{"class":313},[307,2241,328],{"class":313},[307,2243,1883],{"class":331},[307,2245,490],{"class":313},[307,2247,2248,2250,2252,2254,2256],{"class":309,"line":493},[307,2249,480],{"class":321},[307,2251,325],{"class":313},[307,2253,328],{"class":313},[307,2255,332],{"class":331},[307,2257,490],{"class":313},[307,2259,2260,2262,2264,2266,2268],{"class":309,"line":508},[307,2261,511],{"class":321},[307,2263,325],{"class":313},[307,2265,328],{"class":313},[307,2267,2161],{"class":331},[307,2269,490],{"class":313},[307,2271,2272,2274,2276,2278,2280],{"class":309,"line":523},[307,2273,526],{"class":321},[307,2275,325],{"class":313},[307,2277,328],{"class":313},[307,2279,2174],{"class":331},[307,2281,490],{"class":313},[307,2283,2284],{"class":309,"line":537},[307,2285,847],{"class":567},[368,2287,2288],{},"Some providers support other values.",[388,2290,2292],{"id":2291},"modifiers",[237,2293,2291],{},[234,2295,2296],{},"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.",[234,2298,2299,2300,2302],{},"Using the ",[237,2301,2291],{}," prop lets you use any of these transformations.",[234,2304,2305],{},[901,2306,903],{},[298,2308,2310],{"className":300,"code":2309,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  provider=\"cloudinary\"\n  src=\"\u002Fremote\u002Fnuxt-org\u002Fblog\u002Fgoing-full-static\u002Fmain.png\"\n  width=\"300\"\n  height=\"169\"\n  :modifiers=\"{ roundCorner: '0:100' }\"\n\u002F>\n",[237,2311,2312,2318,2331,2343,2355,2367,2396],{"__ignoreMap":303},[307,2313,2314,2316],{"class":309,"line":310},[307,2315,314],{"class":313},[307,2317,474],{"class":317},[307,2319,2320,2323,2325,2327,2329],{"class":309,"line":477},[307,2321,2322],{"class":321},"  provider",[307,2324,325],{"class":313},[307,2326,328],{"class":313},[307,2328,1704],{"class":331},[307,2330,490],{"class":313},[307,2332,2333,2335,2337,2339,2341],{"class":309,"line":493},[307,2334,480],{"class":321},[307,2336,325],{"class":313},[307,2338,328],{"class":313},[307,2340,1717],{"class":331},[307,2342,490],{"class":313},[307,2344,2345,2347,2349,2351,2353],{"class":309,"line":508},[307,2346,511],{"class":321},[307,2348,325],{"class":313},[307,2350,328],{"class":313},[307,2352,1731],{"class":331},[307,2354,490],{"class":313},[307,2356,2357,2359,2361,2363,2365],{"class":309,"line":523},[307,2358,526],{"class":321},[307,2360,325],{"class":313},[307,2362,328],{"class":313},[307,2364,1745],{"class":331},[307,2366,490],{"class":313},[307,2368,2369,2371,2373,2375,2377,2379,2382,2384,2386,2389,2391,2394],{"class":309,"line":537},[307,2370,540],{"class":313},[307,2372,2291],{"class":321},[307,2374,325],{"class":313},[307,2376,328],{"class":313},[307,2378,564],{"class":313},[307,2380,2381],{"class":317}," roundCorner",[307,2383,1625],{"class":313},[307,2385,1811],{"class":313},[307,2387,2388],{"class":331},"0:100",[307,2390,1410],{"class":313},[307,2392,2393],{"class":313}," }",[307,2395,490],{"class":313},[307,2397,2398],{"class":309,"line":554},[307,2399,847],{"class":567},[388,2401,2403],{"id":2402},"preload",[237,2404,2402],{},[234,2406,2407,2408,2411],{},"In case you want to preload the image, use this prop. This will place a corresponding ",[237,2409,2410],{},"link"," tag in the page's head.",[298,2413,2415],{"className":300,"code":2414,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" preload \u002F>\n",[237,2416,2417],{"__ignoreMap":303},[307,2418,2419,2421,2423,2425,2427,2429,2431,2433,2436],{"class":309,"line":310},[307,2420,314],{"class":313},[307,2422,318],{"class":317},[307,2424,322],{"class":321},[307,2426,325],{"class":313},[307,2428,328],{"class":313},[307,2430,332],{"class":331},[307,2432,328],{"class":313},[307,2434,2435],{"class":321}," preload",[307,2437,337],{"class":313},[234,2439,2440,2441,2444,2445,2447,2448,2455,2456,436,2459,2462,2463,862],{},"Passing an object to the preload prop lets you define the ",[237,2442,2443],{},"fetchPriority"," property.\nNote that the JavaScript property ",[237,2446,2443],{}," maps to the ",[372,2449,2452],{"href":2450,"rel":2451},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FHTML\u002FReference\u002FAttributes\u002Ffetchpriority",[777],[237,2453,2454],{},"fetchpriority"," HTML attribute in the preload link tag.\nAccepted values are ",[237,2457,2458],{},"auto",[237,2460,2461],{},"high",", or ",[237,2464,2465],{},"low",[298,2467,2469],{"className":300,"code":2468,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" :preload=\"{ fetchPriority: 'high' }\" \u002F>\n",[237,2470,2471],{"__ignoreMap":303},[307,2472,2473,2475,2477,2479,2481,2483,2485,2487,2489,2491,2493,2495,2497,2500,2502,2504,2506,2508,2510,2512],{"class":309,"line":310},[307,2474,314],{"class":313},[307,2476,318],{"class":317},[307,2478,322],{"class":321},[307,2480,325],{"class":313},[307,2482,328],{"class":313},[307,2484,332],{"class":331},[307,2486,328],{"class":313},[307,2488,1163],{"class":313},[307,2490,2402],{"class":321},[307,2492,325],{"class":313},[307,2494,328],{"class":313},[307,2496,564],{"class":313},[307,2498,2499],{"class":317}," fetchPriority",[307,2501,1625],{"class":313},[307,2503,1811],{"class":313},[307,2505,2461],{"class":331},[307,2507,1410],{"class":313},[307,2509,2393],{"class":313},[307,2511,328],{"class":313},[307,2513,337],{"class":313},[388,2515,2517],{"id":2516},"loading",[237,2518,2516],{},[234,2520,2521,2522,2526,2527,2532],{},"This is a ",[372,2523,778],{"href":2524,"rel":2525},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FHTMLImageElement\u002Floading",[777]," attribute that provides a hint\nto the browser on how to handle the loading of an image which is outside the viewport.\nIt is ",[372,2528,2531],{"href":2529,"rel":2530},"https:\u002F\u002Fcaniuse.com\u002Floading-lazy-attr",[777],"supported"," by the latest version of all major browsers since March 2022.",[234,2534,2535,2536,2539],{},"Set ",[237,2537,2538],{},"loading=\"lazy\""," to defer loading of an image until it appears in the viewport.",[298,2541,2543],{"className":300,"code":2542,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" loading=\"lazy\" \u002F>\n",[237,2544,2545],{"__ignoreMap":303},[307,2546,2547,2549,2551,2553,2555,2557,2559,2561,2564,2566,2568,2571,2573],{"class":309,"line":310},[307,2548,314],{"class":313},[307,2550,318],{"class":317},[307,2552,322],{"class":321},[307,2554,325],{"class":313},[307,2556,328],{"class":313},[307,2558,332],{"class":331},[307,2560,328],{"class":313},[307,2562,2563],{"class":321}," loading",[307,2565,325],{"class":313},[307,2567,328],{"class":313},[307,2569,2570],{"class":331},"lazy",[307,2572,328],{"class":313},[307,2574,337],{"class":313},[388,2576,2578],{"id":2577},"nonce",[237,2579,2577],{},[234,2581,2521,2582,2586,2587,2590,2591,2594],{},[372,2583,778],{"href":2584,"rel":2585},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FHTML\u002FGlobal_attributes\u002Fnonce",[777]," 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 ",[237,2588,2589],{},"unsafe-inline"," directive, which would allowlist ",[784,2592,2593],{},"all"," inline script or styles.",[298,2596,2598],{"className":300,"code":2597,"language":302,"meta":303,"style":303},"\u003Ctemplate>\n  \u003CNuxtImg\n    src=\"\u002Fnuxt-icon.png\"\n    :nonce=\"nonce\"\n  \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\n\u002F\u002F useNonce is not provided by @nuxt\u002Fimage but might be\n\u002F\u002F provided by another module, for example nuxt-security\nconst nonce = useNonce()\n\u003C\u002Fscript>\n",[237,2599,2600,2608,2614,2626,2640,2644,2652,2656,2676,2681,2686,2700],{"__ignoreMap":303},[307,2601,2602,2604,2606],{"class":309,"line":310},[307,2603,314],{"class":313},[307,2605,1342],{"class":317},[307,2607,366],{"class":313},[307,2609,2610,2612],{"class":309,"line":477},[307,2611,1349],{"class":313},[307,2613,474],{"class":317},[307,2615,2616,2618,2620,2622,2624],{"class":309,"line":493},[307,2617,1356],{"class":321},[307,2619,325],{"class":313},[307,2621,328],{"class":313},[307,2623,332],{"class":331},[307,2625,490],{"class":313},[307,2627,2628,2630,2632,2634,2636,2638],{"class":309,"line":508},[307,2629,1370],{"class":313},[307,2631,2577],{"class":321},[307,2633,325],{"class":313},[307,2635,328],{"class":313},[307,2637,2577],{"class":567},[307,2639,490],{"class":313},[307,2641,2642],{"class":309,"line":523},[307,2643,1444],{"class":313},[307,2645,2646,2648,2650],{"class":309,"line":537},[307,2647,671],{"class":313},[307,2649,1342],{"class":317},[307,2651,366],{"class":313},[307,2653,2654],{"class":309,"line":554},[307,2655,631],{"emptyLinePlaceholder":630},[307,2657,2658,2660,2662,2664,2666,2668,2670,2672,2674],{"class":309,"line":586},[307,2659,314],{"class":313},[307,2661,1463],{"class":317},[307,2663,1466],{"class":321},[307,2665,1469],{"class":321},[307,2667,325],{"class":313},[307,2669,328],{"class":313},[307,2671,1476],{"class":331},[307,2673,328],{"class":313},[307,2675,366],{"class":313},[307,2677,2678],{"class":309,"line":591},[307,2679,2680],{"class":977},"\u002F\u002F useNonce is not provided by @nuxt\u002Fimage but might be\n",[307,2682,2683],{"class":309,"line":597},[307,2684,2685],{"class":977},"\u002F\u002F provided by another module, for example nuxt-security\n",[307,2687,2688,2690,2693,2695,2698],{"class":309,"line":603},[307,2689,1485],{"class":321},[307,2691,2692],{"class":567}," nonce ",[307,2694,325],{"class":313},[307,2696,2697],{"class":1379}," useNonce",[307,2699,1496],{"class":567},[307,2701,2702,2704,2706],{"class":309,"line":609},[307,2703,671],{"class":313},[307,2705,1463],{"class":317},[307,2707,366],{"class":313},[282,2709,2711],{"id":2710},"events","Events",[234,2713,2714,2715,2717,2718,264,2720,2722],{},"Native events emitted by the ",[237,2716,242],{}," element contained by ",[237,2719,36],{},[237,2721,40],{}," components are re-emitted and can be listened to.",[234,2724,2725,2727,2728,2731,2732],{},[901,2726,903],{}," Listen to the native ",[237,2729,2730],{},"onLoad"," event from ",[237,2733,36],{},[298,2735,2737],{"className":300,"code":2736,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Fimages\u002Fcolors.jpg\"\n  width=\"500\"\n  height=\"500\"\n  @load=\"doSomethingOnLoad\"\n\u002F>\n",[237,2738,2739,2745,2758,2771,2783,2800],{"__ignoreMap":303},[307,2740,2741,2743],{"class":309,"line":310},[307,2742,314],{"class":313},[307,2744,474],{"class":317},[307,2746,2747,2749,2751,2753,2756],{"class":309,"line":477},[307,2748,480],{"class":321},[307,2750,325],{"class":313},[307,2752,328],{"class":313},[307,2754,2755],{"class":331},"\u002Fimages\u002Fcolors.jpg",[307,2757,490],{"class":313},[307,2759,2760,2762,2764,2766,2769],{"class":309,"line":493},[307,2761,511],{"class":321},[307,2763,325],{"class":313},[307,2765,328],{"class":313},[307,2767,2768],{"class":331},"500",[307,2770,490],{"class":313},[307,2772,2773,2775,2777,2779,2781],{"class":309,"line":508},[307,2774,526],{"class":321},[307,2776,325],{"class":313},[307,2778,328],{"class":313},[307,2780,2768],{"class":331},[307,2782,490],{"class":313},[307,2784,2785,2788,2791,2793,2795,2798],{"class":309,"line":523},[307,2786,2787],{"class":313},"  @",[307,2789,2790],{"class":321},"load",[307,2792,325],{"class":313},[307,2794,328],{"class":313},[307,2796,2797],{"class":567},"doSomethingOnLoad",[307,2799,490],{"class":313},[307,2801,2802],{"class":309,"line":537},[307,2803,847],{"class":567},[2805,2806,2807],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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);}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}",{"title":303,"searchDepth":477,"depth":477,"links":2809},[2810,2811,2831],{"id":284,"depth":477,"text":31},{"id":385,"depth":477,"text":386,"children":2812},[2813,2814,2815,2817,2818,2819,2820,2821,2822,2823,2824,2825,2826,2827,2828,2829,2830],{"id":390,"depth":493,"text":390},{"id":256,"depth":493,"text":256},{"id":740,"depth":493,"text":2816},"width \u002F height",{"id":435,"depth":493,"text":435},{"id":273,"depth":493,"text":273},{"id":948,"depth":493,"text":948},{"id":1088,"depth":493,"text":1088},{"id":1507,"depth":493,"text":1507},{"id":1652,"depth":493,"text":1652},{"id":1837,"depth":493,"text":1837},{"id":1405,"depth":493,"text":1405},{"id":1430,"depth":493,"text":1430},{"id":2183,"depth":493,"text":2183},{"id":2291,"depth":493,"text":2291},{"id":2402,"depth":493,"text":2402},{"id":2516,"depth":493,"text":2516},{"id":2577,"depth":493,"text":2577},{"id":2710,"depth":477,"text":2711},"Discover how to use and configure the Nuxt Image component.",[2834],{"label":2835,"icon":2836,"to":2837,"size":2838},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fimage\u002Fblob\u002Fmain\u002Fsrc\u002Fruntime\u002Fcomponents\u002FNuxtImg.vue","xs",{},{"title":36,"description":2832},"y_o-uDRW7B3XD_qirTHxz7N-nizGelv2L9pOnbqZomw",[2843,2845],{"title":26,"path":27,"stem":28,"description":2844,"children":-1},"A comprehensive guide to migrate your application from Nuxt Image v1 to Nuxt Image v2.",{"title":40,"path":41,"stem":42,"description":2846,"children":-1},"Discover how to use and configure the Nuxt Picture component.",1788148179524]