[{"data":1,"prerenderedAt":2792},["ShallowReactive",2],{"navigation_docs":3,"-usage-nuxt-img":228,"-usage-nuxt-img-surround":2787},[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":2777,"extension":896,"links":2778,"meta":2784,"navigation":630,"path":37,"seo":2785,"stem":38,"__hash__":2786},"docs\u002F2.usage\u002F1.nuxt-img.md",{"type":231,"value":232,"toc":2753},"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,1446,1451,1460,1542,1591,1596,1607,1611,1777,1782,1785,1795,1979,1984,1987,2028,2051,2056,2059,2127,2132,2137,2168,2232,2235,2240,2243,2249,2253,2346,2351,2358,2384,2412,2460,2465,2479,2486,2521,2526,2541,2653,2657,2668,2679,2749],[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,1380,1385,1393,1397,1421,1438],{"__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,1378],{"class":309,"line":508},[307,1369,1370],{"class":321},"    :placeholder",[307,1372,325],{"class":313},[307,1374,328],{"class":313},[307,1376,1377],{"class":331},"img(`\u002Fnuxt.svg`, { height: 10, format: 'png', blur: 2, quality: 50 })",[307,1379,490],{"class":313},[307,1381,1382],{"class":309,"line":523},[307,1383,1384],{"class":313},"  \u002F>\n",[307,1386,1387,1389,1391],{"class":309,"line":537},[307,1388,671],{"class":313},[307,1390,1342],{"class":317},[307,1392,366],{"class":313},[307,1394,1395],{"class":309,"line":554},[307,1396,631],{"emptyLinePlaceholder":630},[307,1398,1399,1401,1404,1407,1410,1412,1414,1417,1419],{"class":309,"line":586},[307,1400,314],{"class":313},[307,1402,1403],{"class":317},"script",[307,1405,1406],{"class":321}," setup",[307,1408,1409],{"class":321}," lang",[307,1411,325],{"class":313},[307,1413,328],{"class":313},[307,1415,1416],{"class":331},"ts",[307,1418,328],{"class":313},[307,1420,366],{"class":313},[307,1422,1423,1426,1429,1431,1435],{"class":309,"line":591},[307,1424,1425],{"class":321},"const",[307,1427,1428],{"class":567}," img ",[307,1430,325],{"class":313},[307,1432,1434],{"class":1433},"s2Zo4"," useImage",[307,1436,1437],{"class":567},"()\n",[307,1439,1440,1442,1444],{"class":309,"line":597},[307,1441,671],{"class":313},[307,1443,1403],{"class":317},[307,1445,366],{"class":313},[388,1447,1449],{"id":1448},"placeholder-class",[237,1450,1448],{},[234,1452,1453,1454,1456,1457,1459],{},"When using a placeholder, you can use ",[237,1455,1448],{}," to apply a class to the original underlying ",[237,1458,242],{}," element (while the placeholder is being rendered).",[298,1461,1463],{"className":300,"code":1462,"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,1464,1465,1470,1476,1488,1493,1506,1510,1514,1519,1524,1529,1533,1538],{"__ignoreMap":303},[307,1466,1467],{"class":309,"line":310},[307,1468,1469],{"class":977},"\u003C!-- Apply a static class to the original image -->\n",[307,1471,1472,1474],{"class":309,"line":477},[307,1473,314],{"class":313},[307,1475,474],{"class":317},[307,1477,1478,1480,1482,1484,1486],{"class":309,"line":493},[307,1479,480],{"class":321},[307,1481,325],{"class":313},[307,1483,328],{"class":313},[307,1485,720],{"class":331},[307,1487,490],{"class":313},[307,1489,1490],{"class":309,"line":508},[307,1491,1492],{"class":321},"  placeholder\n",[307,1494,1495,1498,1500,1502,1504],{"class":309,"line":523},[307,1496,1497],{"class":321},"  placeholder-class",[307,1499,325],{"class":313},[307,1501,328],{"class":313},[307,1503,390],{"class":331},[307,1505,490],{"class":313},[307,1507,1508],{"class":309,"line":537},[307,1509,847],{"class":567},[307,1511,1512],{"class":309,"line":554},[307,1513,631],{"emptyLinePlaceholder":630},[307,1515,1516],{"class":309,"line":586},[307,1517,1518],{"class":567},"\u003C!-- Apply a dynamic class to the original image -->\n",[307,1520,1521],{"class":309,"line":591},[307,1522,1523],{"class":567},"\u003CNuxtImg\n",[307,1525,1526],{"class":309,"line":597},[307,1527,1528],{"class":567},"  src=\"\u002Fnuxt.png\"\n",[307,1530,1531],{"class":309,"line":603},[307,1532,1492],{"class":567},[307,1534,1535],{"class":309,"line":609},[307,1536,1537],{"class":567},"  :placeholder-class=\"custom\"\n",[307,1539,1540],{"class":309,"line":615},[307,1541,847],{"class":567},[1543,1544,1545,1552],"tip",{},[234,1546,1547,1548,1551],{},"If you need to apply some CSS to only the ",[784,1549,1550],{},"loaded"," image you can do so with something like:",[298,1553,1557],{"className":1554,"code":1555,"language":1556,"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,1558,1559,1581,1586],{"__ignoreMap":303},[307,1560,1561,1564,1567,1570,1573,1576,1578],{"class":309,"line":310},[307,1562,292],{"class":1563},"sBMFI",[307,1565,1566],{"class":313},":",[307,1568,1569],{"class":321},"not",[307,1571,1572],{"class":313},"(.",[307,1574,1575],{"class":1563},"my-placeholder-class",[307,1577,762],{"class":313},[307,1579,1580],{"class":313}," {\n",[307,1582,1583],{"class":309,"line":477},[307,1584,1585],{"class":977},"  \u002F* styles here *\u002F\n",[307,1587,1588],{"class":309,"line":493},[307,1589,1590],{"class":313},"}\n",[388,1592,1594],{"id":1593},"provider",[237,1595,1593],{},[234,1597,1598,1599,1603,1604],{},"Use other provider instead of default ",[372,1600,1602],{"href":1601},"\u002Fget-started\u002Fconfiguration#provider","provider option"," specified in ",[237,1605,1606],{},"nuxt.config",[234,1608,1609],{},[901,1610,903],{},[1612,1613,1614,1701],"code-group",{},[298,1615,1618],{"className":300,"code":1616,"filename":1617,"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,1619,1620,1628,1634,1648,1661,1675,1689,1693],{"__ignoreMap":303},[307,1621,1622,1624,1626],{"class":309,"line":310},[307,1623,314],{"class":313},[307,1625,1342],{"class":317},[307,1627,366],{"class":313},[307,1629,1630,1632],{"class":309,"line":477},[307,1631,1349],{"class":313},[307,1633,474],{"class":317},[307,1635,1636,1639,1641,1643,1646],{"class":309,"line":493},[307,1637,1638],{"class":321},"    provider",[307,1640,325],{"class":313},[307,1642,328],{"class":313},[307,1644,1645],{"class":331},"cloudinary",[307,1647,490],{"class":313},[307,1649,1650,1652,1654,1656,1659],{"class":309,"line":508},[307,1651,1356],{"class":321},[307,1653,325],{"class":313},[307,1655,328],{"class":313},[307,1657,1658],{"class":331},"\u002Fremote\u002Fnuxt-org\u002Fblog\u002Fgoing-full-static\u002Fmain.png",[307,1660,490],{"class":313},[307,1662,1663,1666,1668,1670,1673],{"class":309,"line":523},[307,1664,1665],{"class":321},"    width",[307,1667,325],{"class":313},[307,1669,328],{"class":313},[307,1671,1672],{"class":331},"300",[307,1674,490],{"class":313},[307,1676,1677,1680,1682,1684,1687],{"class":309,"line":537},[307,1678,1679],{"class":321},"    height",[307,1681,325],{"class":313},[307,1683,328],{"class":313},[307,1685,1686],{"class":331},"169",[307,1688,490],{"class":313},[307,1690,1691],{"class":309,"line":554},[307,1692,1384],{"class":313},[307,1694,1695,1697,1699],{"class":309,"line":586},[307,1696,671],{"class":313},[307,1698,1342],{"class":317},[307,1700,366],{"class":313},[298,1702,1706],{"className":1703,"code":1704,"filename":1705,"language":1416,"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,1707,1708,1726,1735,1744,1760,1765,1770],{"__ignoreMap":303},[307,1709,1710,1714,1717,1720,1723],{"class":309,"line":310},[307,1711,1713],{"class":1712},"s7zQu","export",[307,1715,1716],{"class":1712}," default",[307,1718,1719],{"class":1433}," defineNuxtConfig",[307,1721,1722],{"class":567},"(",[307,1724,1725],{"class":313},"{\n",[307,1727,1728,1731,1733],{"class":309,"line":477},[307,1729,1730],{"class":317},"  image",[307,1732,1566],{"class":313},[307,1734,1580],{"class":313},[307,1736,1737,1740,1742],{"class":309,"line":493},[307,1738,1739],{"class":317},"    cloudinary",[307,1741,1566],{"class":313},[307,1743,1580],{"class":313},[307,1745,1746,1749,1751,1754,1757],{"class":309,"line":508},[307,1747,1748],{"class":317},"      baseURL",[307,1750,1566],{"class":313},[307,1752,1753],{"class":313}," '",[307,1755,1756],{"class":331},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fimage\u002Fupload",[307,1758,1759],{"class":313},"'\n",[307,1761,1762],{"class":309,"line":523},[307,1763,1764],{"class":313},"    }\n",[307,1766,1767],{"class":309,"line":537},[307,1768,1769],{"class":313},"  }\n",[307,1771,1772,1774],{"class":309,"line":554},[307,1773,581],{"class":313},[307,1775,1776],{"class":567},")\n",[388,1778,1780],{"id":1779},"preset",[237,1781,1779],{},[234,1783,1784],{},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",[368,1786,1787,1788,1792,1793],{},"We can define presets using ",[372,1789,1791],{"href":1790},"\u002Fget-started\u002Fconfiguration#presets","presets options"," in ",[237,1794,1606],{},[1612,1796,1797,1848],{},[298,1798,1800],{"className":300,"code":1799,"filename":1617,"language":302,"meta":303,"style":303},"\u003Ctemplate>\n  \u003CNuxtImg preset=\"cover\" src=\"\u002Fnuxt-icon.png\" \u002F>\n\u003C\u002Ftemplate>\n",[237,1801,1802,1810,1840],{"__ignoreMap":303},[307,1803,1804,1806,1808],{"class":309,"line":310},[307,1805,314],{"class":313},[307,1807,1342],{"class":317},[307,1809,366],{"class":313},[307,1811,1812,1814,1816,1819,1821,1823,1826,1828,1830,1832,1834,1836,1838],{"class":309,"line":477},[307,1813,1349],{"class":313},[307,1815,318],{"class":317},[307,1817,1818],{"class":321}," preset",[307,1820,325],{"class":313},[307,1822,328],{"class":313},[307,1824,1825],{"class":331},"cover",[307,1827,328],{"class":313},[307,1829,322],{"class":321},[307,1831,325],{"class":313},[307,1833,328],{"class":313},[307,1835,332],{"class":331},[307,1837,328],{"class":313},[307,1839,337],{"class":313},[307,1841,1842,1844,1846],{"class":309,"line":493},[307,1843,671],{"class":313},[307,1845,1342],{"class":317},[307,1847,366],{"class":313},[298,1849,1851],{"className":1703,"code":1850,"filename":1705,"language":1416,"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,1852,1853,1865,1873,1882,1891,1900,1917,1933,1945,1955,1960,1965,1969,1973],{"__ignoreMap":303},[307,1854,1855,1857,1859,1861,1863],{"class":309,"line":310},[307,1856,1713],{"class":1712},[307,1858,1716],{"class":1712},[307,1860,1719],{"class":1433},[307,1862,1722],{"class":567},[307,1864,1725],{"class":313},[307,1866,1867,1869,1871],{"class":309,"line":477},[307,1868,1730],{"class":317},[307,1870,1566],{"class":313},[307,1872,1580],{"class":313},[307,1874,1875,1878,1880],{"class":309,"line":493},[307,1876,1877],{"class":317},"    presets",[307,1879,1566],{"class":313},[307,1881,1580],{"class":313},[307,1883,1884,1887,1889],{"class":309,"line":508},[307,1885,1886],{"class":317},"      cover",[307,1888,1566],{"class":313},[307,1890,1580],{"class":313},[307,1892,1893,1896,1898],{"class":309,"line":523},[307,1894,1895],{"class":317},"        modifiers",[307,1897,1566],{"class":313},[307,1899,1580],{"class":313},[307,1901,1902,1905,1907,1909,1911,1914],{"class":309,"line":537},[307,1903,1904],{"class":317},"          fit",[307,1906,1566],{"class":313},[307,1908,1753],{"class":313},[307,1910,1825],{"class":331},[307,1912,1913],{"class":313},"'",[307,1915,1916],{"class":313},",\n",[307,1918,1919,1922,1924,1926,1929,1931],{"class":309,"line":554},[307,1920,1921],{"class":317},"          format",[307,1923,1566],{"class":313},[307,1925,1753],{"class":313},[307,1927,1928],{"class":331},"jpg",[307,1930,1913],{"class":313},[307,1932,1916],{"class":313},[307,1934,1935,1938,1940,1943],{"class":309,"line":586},[307,1936,1937],{"class":317},"          width",[307,1939,1566],{"class":313},[307,1941,1942],{"class":1175}," 300",[307,1944,1916],{"class":313},[307,1946,1947,1950,1952],{"class":309,"line":591},[307,1948,1949],{"class":317},"          height",[307,1951,1566],{"class":313},[307,1953,1954],{"class":1175}," 300\n",[307,1956,1957],{"class":309,"line":597},[307,1958,1959],{"class":313},"        }\n",[307,1961,1962],{"class":309,"line":603},[307,1963,1964],{"class":313},"      }\n",[307,1966,1967],{"class":309,"line":609},[307,1968,1764],{"class":313},[307,1970,1971],{"class":309,"line":615},[307,1972,1769],{"class":313},[307,1974,1975,1977],{"class":309,"line":621},[307,1976,581],{"class":313},[307,1978,1776],{"class":567},[388,1980,1982],{"id":1981},"format",[237,1983,1981],{},[234,1985,1986],{},"In case you want to serve images in a specific format, use this prop.",[298,1988,1990],{"className":300,"code":1989,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  format=\"webp\"\n  src=\"\u002Fnuxt-icon.png\"\n\u002F>\n",[237,1991,1992,1998,2012,2024],{"__ignoreMap":303},[307,1993,1994,1996],{"class":309,"line":310},[307,1995,314],{"class":313},[307,1997,474],{"class":317},[307,1999,2000,2003,2005,2007,2010],{"class":309,"line":477},[307,2001,2002],{"class":321},"  format",[307,2004,325],{"class":313},[307,2006,328],{"class":313},[307,2008,2009],{"class":331},"webp",[307,2011,490],{"class":313},[307,2013,2014,2016,2018,2020,2022],{"class":309,"line":493},[307,2015,480],{"class":321},[307,2017,325],{"class":313},[307,2019,328],{"class":313},[307,2021,332],{"class":331},[307,2023,490],{"class":313},[307,2025,2026],{"class":309,"line":508},[307,2027,847],{"class":567},[234,2029,2030,2031,436,2033,436,2036,436,2039,436,2041,436,2044,264,2047,2050],{},"Available formats are ",[237,2032,2009],{},[237,2034,2035],{},"avif",[237,2037,2038],{},"jpeg",[237,2040,1928],{},[237,2042,2043],{},"png",[237,2045,2046],{},"gif",[237,2048,2049],{},"svg",". If the format is not specified, it will respect the default image format.",[388,2052,2054],{"id":2053},"quality",[237,2055,2053],{},[234,2057,2058],{},"The quality for the generated image(s).",[298,2060,2062],{"className":300,"code":2061,"language":302,"meta":303,"style":303},"\u003CNuxtImg\n  src=\"\u002Fnuxt.jpg\"\n  quality=\"80\"\n  width=\"200\"\n  height=\"100\"\n\u002F>\n",[237,2063,2064,2070,2083,2097,2110,2123],{"__ignoreMap":303},[307,2065,2066,2068],{"class":309,"line":310},[307,2067,314],{"class":313},[307,2069,474],{"class":317},[307,2071,2072,2074,2076,2078,2081],{"class":309,"line":477},[307,2073,480],{"class":321},[307,2075,325],{"class":313},[307,2077,328],{"class":313},[307,2079,2080],{"class":331},"\u002Fnuxt.jpg",[307,2082,490],{"class":313},[307,2084,2085,2088,2090,2092,2095],{"class":309,"line":493},[307,2086,2087],{"class":321},"  quality",[307,2089,325],{"class":313},[307,2091,328],{"class":313},[307,2093,2094],{"class":331},"80",[307,2096,490],{"class":313},[307,2098,2099,2101,2103,2105,2108],{"class":309,"line":508},[307,2100,511],{"class":321},[307,2102,325],{"class":313},[307,2104,328],{"class":313},[307,2106,2107],{"class":331},"200",[307,2109,490],{"class":313},[307,2111,2112,2114,2116,2118,2121],{"class":309,"line":523},[307,2113,526],{"class":321},[307,2115,325],{"class":313},[307,2117,328],{"class":313},[307,2119,2120],{"class":331},"100",[307,2122,490],{"class":313},[307,2124,2125],{"class":309,"line":537},[307,2126,847],{"class":567},[388,2128,2130],{"id":2129},"fit",[237,2131,2129],{},[234,2133,395,2134,2136],{},[237,2135,2129],{}," property specifies the size of the images.\nThere are five standard values you can use with this property.",[245,2138,2139,2144,2150,2156,2162],{},[248,2140,2141,2143],{},[237,2142,1825],{},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping\u002Fclipping to fit",[248,2145,2146,2149],{},[237,2147,2148],{},"contain",": Preserving aspect ratio, contain within both provided dimensions using 'letterboxing' where necessary.",[248,2151,2152,2155],{},[237,2153,2154],{},"fill",": Ignore the aspect ratio of the input and stretch to both provided dimensions.",[248,2157,2158,2161],{},[237,2159,2160],{},"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,2163,2164,2167],{},[237,2165,2166],{},"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,2169,2171],{"className":300,"code":2170,"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,2172,2173,2179,2192,2204,2216,2228],{"__ignoreMap":303},[307,2174,2175,2177],{"class":309,"line":310},[307,2176,314],{"class":313},[307,2178,474],{"class":317},[307,2180,2181,2184,2186,2188,2190],{"class":309,"line":477},[307,2182,2183],{"class":321},"  fit",[307,2185,325],{"class":313},[307,2187,328],{"class":313},[307,2189,1825],{"class":331},[307,2191,490],{"class":313},[307,2193,2194,2196,2198,2200,2202],{"class":309,"line":493},[307,2195,480],{"class":321},[307,2197,325],{"class":313},[307,2199,328],{"class":313},[307,2201,332],{"class":331},[307,2203,490],{"class":313},[307,2205,2206,2208,2210,2212,2214],{"class":309,"line":508},[307,2207,511],{"class":321},[307,2209,325],{"class":313},[307,2211,328],{"class":313},[307,2213,2107],{"class":331},[307,2215,490],{"class":313},[307,2217,2218,2220,2222,2224,2226],{"class":309,"line":523},[307,2219,526],{"class":321},[307,2221,325],{"class":313},[307,2223,328],{"class":313},[307,2225,2120],{"class":331},[307,2227,490],{"class":313},[307,2229,2230],{"class":309,"line":537},[307,2231,847],{"class":567},[368,2233,2234],{},"Some providers support other values.",[388,2236,2238],{"id":2237},"modifiers",[237,2239,2237],{},[234,2241,2242],{},"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,2244,2245,2246,2248],{},"Using the ",[237,2247,2237],{}," prop lets you use any of these transformations.",[234,2250,2251],{},[901,2252,903],{},[298,2254,2256],{"className":300,"code":2255,"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,2257,2258,2264,2277,2289,2301,2313,2342],{"__ignoreMap":303},[307,2259,2260,2262],{"class":309,"line":310},[307,2261,314],{"class":313},[307,2263,474],{"class":317},[307,2265,2266,2269,2271,2273,2275],{"class":309,"line":477},[307,2267,2268],{"class":321},"  provider",[307,2270,325],{"class":313},[307,2272,328],{"class":313},[307,2274,1645],{"class":331},[307,2276,490],{"class":313},[307,2278,2279,2281,2283,2285,2287],{"class":309,"line":493},[307,2280,480],{"class":321},[307,2282,325],{"class":313},[307,2284,328],{"class":313},[307,2286,1658],{"class":331},[307,2288,490],{"class":313},[307,2290,2291,2293,2295,2297,2299],{"class":309,"line":508},[307,2292,511],{"class":321},[307,2294,325],{"class":313},[307,2296,328],{"class":313},[307,2298,1672],{"class":331},[307,2300,490],{"class":313},[307,2302,2303,2305,2307,2309,2311],{"class":309,"line":523},[307,2304,526],{"class":321},[307,2306,325],{"class":313},[307,2308,328],{"class":313},[307,2310,1686],{"class":331},[307,2312,490],{"class":313},[307,2314,2315,2317,2319,2321,2323,2325,2328,2330,2332,2335,2337,2340],{"class":309,"line":537},[307,2316,540],{"class":313},[307,2318,2237],{"class":321},[307,2320,325],{"class":313},[307,2322,328],{"class":313},[307,2324,564],{"class":313},[307,2326,2327],{"class":317}," roundCorner",[307,2329,1566],{"class":313},[307,2331,1753],{"class":313},[307,2333,2334],{"class":331},"0:100",[307,2336,1913],{"class":313},[307,2338,2339],{"class":313}," }",[307,2341,490],{"class":313},[307,2343,2344],{"class":309,"line":554},[307,2345,847],{"class":567},[388,2347,2349],{"id":2348},"preload",[237,2350,2348],{},[234,2352,2353,2354,2357],{},"In case you want to preload the image, use this prop. This will place a corresponding ",[237,2355,2356],{},"link"," tag in the page's head.",[298,2359,2361],{"className":300,"code":2360,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" preload \u002F>\n",[237,2362,2363],{"__ignoreMap":303},[307,2364,2365,2367,2369,2371,2373,2375,2377,2379,2382],{"class":309,"line":310},[307,2366,314],{"class":313},[307,2368,318],{"class":317},[307,2370,322],{"class":321},[307,2372,325],{"class":313},[307,2374,328],{"class":313},[307,2376,332],{"class":331},[307,2378,328],{"class":313},[307,2380,2381],{"class":321}," preload",[307,2383,337],{"class":313},[234,2385,2386,2387,2390,2391,2393,2394,2401,2402,436,2405,2408,2409,862],{},"Passing an object to the preload prop lets you define the ",[237,2388,2389],{},"fetchPriority"," property.\nNote that the JavaScript property ",[237,2392,2389],{}," maps to the ",[372,2395,2398],{"href":2396,"rel":2397},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FHTML\u002FReference\u002FAttributes\u002Ffetchpriority",[777],[237,2399,2400],{},"fetchpriority"," HTML attribute in the preload link tag.\nAccepted values are ",[237,2403,2404],{},"auto",[237,2406,2407],{},"high",", or ",[237,2410,2411],{},"low",[298,2413,2415],{"className":300,"code":2414,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" :preload=\"{ fetchPriority: 'high' }\" \u002F>\n",[237,2416,2417],{"__ignoreMap":303},[307,2418,2419,2421,2423,2425,2427,2429,2431,2433,2435,2437,2439,2441,2443,2446,2448,2450,2452,2454,2456,2458],{"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,1163],{"class":313},[307,2436,2348],{"class":321},[307,2438,325],{"class":313},[307,2440,328],{"class":313},[307,2442,564],{"class":313},[307,2444,2445],{"class":317}," fetchPriority",[307,2447,1566],{"class":313},[307,2449,1753],{"class":313},[307,2451,2407],{"class":331},[307,2453,1913],{"class":313},[307,2455,2339],{"class":313},[307,2457,328],{"class":313},[307,2459,337],{"class":313},[388,2461,2463],{"id":2462},"loading",[237,2464,2462],{},[234,2466,2467,2468,2472,2473,2478],{},"This is a ",[372,2469,778],{"href":2470,"rel":2471},"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,2474,2477],{"href":2475,"rel":2476},"https:\u002F\u002Fcaniuse.com\u002Floading-lazy-attr",[777],"supported"," by the latest version of all major browsers since March 2022.",[234,2480,2481,2482,2485],{},"Set ",[237,2483,2484],{},"loading=\"lazy\""," to defer loading of an image until it appears in the viewport.",[298,2487,2489],{"className":300,"code":2488,"language":302,"meta":303,"style":303},"\u003CNuxtImg src=\"\u002Fnuxt-icon.png\" loading=\"lazy\" \u002F>\n",[237,2490,2491],{"__ignoreMap":303},[307,2492,2493,2495,2497,2499,2501,2503,2505,2507,2510,2512,2514,2517,2519],{"class":309,"line":310},[307,2494,314],{"class":313},[307,2496,318],{"class":317},[307,2498,322],{"class":321},[307,2500,325],{"class":313},[307,2502,328],{"class":313},[307,2504,332],{"class":331},[307,2506,328],{"class":313},[307,2508,2509],{"class":321}," loading",[307,2511,325],{"class":313},[307,2513,328],{"class":313},[307,2515,2516],{"class":331},"lazy",[307,2518,328],{"class":313},[307,2520,337],{"class":313},[388,2522,2524],{"id":2523},"nonce",[237,2525,2523],{},[234,2527,2467,2528,2532,2533,2536,2537,2540],{},[372,2529,778],{"href":2530,"rel":2531},"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,2534,2535],{},"unsafe-inline"," directive, which would allowlist ",[784,2538,2539],{},"all"," inline script or styles.",[298,2542,2544],{"className":300,"code":2543,"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,2545,2546,2554,2560,2572,2585,2589,2597,2601,2621,2626,2631,2645],{"__ignoreMap":303},[307,2547,2548,2550,2552],{"class":309,"line":310},[307,2549,314],{"class":313},[307,2551,1342],{"class":317},[307,2553,366],{"class":313},[307,2555,2556,2558],{"class":309,"line":477},[307,2557,1349],{"class":313},[307,2559,474],{"class":317},[307,2561,2562,2564,2566,2568,2570],{"class":309,"line":493},[307,2563,1356],{"class":321},[307,2565,325],{"class":313},[307,2567,328],{"class":313},[307,2569,332],{"class":331},[307,2571,490],{"class":313},[307,2573,2574,2577,2579,2581,2583],{"class":309,"line":508},[307,2575,2576],{"class":321},"    :nonce",[307,2578,325],{"class":313},[307,2580,328],{"class":313},[307,2582,2523],{"class":331},[307,2584,490],{"class":313},[307,2586,2587],{"class":309,"line":523},[307,2588,1384],{"class":313},[307,2590,2591,2593,2595],{"class":309,"line":537},[307,2592,671],{"class":313},[307,2594,1342],{"class":317},[307,2596,366],{"class":313},[307,2598,2599],{"class":309,"line":554},[307,2600,631],{"emptyLinePlaceholder":630},[307,2602,2603,2605,2607,2609,2611,2613,2615,2617,2619],{"class":309,"line":586},[307,2604,314],{"class":313},[307,2606,1403],{"class":317},[307,2608,1406],{"class":321},[307,2610,1409],{"class":321},[307,2612,325],{"class":313},[307,2614,328],{"class":313},[307,2616,1416],{"class":331},[307,2618,328],{"class":313},[307,2620,366],{"class":313},[307,2622,2623],{"class":309,"line":591},[307,2624,2625],{"class":977},"\u002F\u002F useNonce is not provided by @nuxt\u002Fimage but might be\n",[307,2627,2628],{"class":309,"line":597},[307,2629,2630],{"class":977},"\u002F\u002F provided by another module, for example nuxt-security\n",[307,2632,2633,2635,2638,2640,2643],{"class":309,"line":603},[307,2634,1425],{"class":321},[307,2636,2637],{"class":567}," nonce ",[307,2639,325],{"class":313},[307,2641,2642],{"class":1433}," useNonce",[307,2644,1437],{"class":567},[307,2646,2647,2649,2651],{"class":309,"line":609},[307,2648,671],{"class":313},[307,2650,1403],{"class":317},[307,2652,366],{"class":313},[282,2654,2656],{"id":2655},"events","Events",[234,2658,2659,2660,2662,2663,264,2665,2667],{},"Native events emitted by the ",[237,2661,242],{}," element contained by ",[237,2664,36],{},[237,2666,40],{}," components are re-emitted and can be listened to.",[234,2669,2670,2672,2673,2676,2677],{},[901,2671,903],{}," Listen to the native ",[237,2674,2675],{},"onLoad"," event from ",[237,2678,36],{},[298,2680,2682],{"className":300,"code":2681,"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,2683,2684,2690,2703,2716,2728,2745],{"__ignoreMap":303},[307,2685,2686,2688],{"class":309,"line":310},[307,2687,314],{"class":313},[307,2689,474],{"class":317},[307,2691,2692,2694,2696,2698,2701],{"class":309,"line":477},[307,2693,480],{"class":321},[307,2695,325],{"class":313},[307,2697,328],{"class":313},[307,2699,2700],{"class":331},"\u002Fimages\u002Fcolors.jpg",[307,2702,490],{"class":313},[307,2704,2705,2707,2709,2711,2714],{"class":309,"line":493},[307,2706,511],{"class":321},[307,2708,325],{"class":313},[307,2710,328],{"class":313},[307,2712,2713],{"class":331},"500",[307,2715,490],{"class":313},[307,2717,2718,2720,2722,2724,2726],{"class":309,"line":508},[307,2719,526],{"class":321},[307,2721,325],{"class":313},[307,2723,328],{"class":313},[307,2725,2713],{"class":331},[307,2727,490],{"class":313},[307,2729,2730,2733,2736,2738,2740,2743],{"class":309,"line":523},[307,2731,2732],{"class":313},"  @",[307,2734,2735],{"class":321},"load",[307,2737,325],{"class":313},[307,2739,328],{"class":313},[307,2741,2742],{"class":567},"doSomethingOnLoad",[307,2744,490],{"class":313},[307,2746,2747],{"class":309,"line":537},[307,2748,847],{"class":567},[2750,2751,2752],"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":2754},[2755,2756,2776],{"id":284,"depth":477,"text":31},{"id":385,"depth":477,"text":386,"children":2757},[2758,2759,2760,2762,2763,2764,2765,2766,2767,2768,2769,2770,2771,2772,2773,2774,2775],{"id":390,"depth":493,"text":390},{"id":256,"depth":493,"text":256},{"id":740,"depth":493,"text":2761},"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":1448,"depth":493,"text":1448},{"id":1593,"depth":493,"text":1593},{"id":1779,"depth":493,"text":1779},{"id":1981,"depth":493,"text":1981},{"id":2053,"depth":493,"text":2053},{"id":2129,"depth":493,"text":2129},{"id":2237,"depth":493,"text":2237},{"id":2348,"depth":493,"text":2348},{"id":2462,"depth":493,"text":2462},{"id":2523,"depth":493,"text":2523},{"id":2655,"depth":477,"text":2656},"Discover how to use and configure the Nuxt Image component.",[2779],{"label":2780,"icon":2781,"to":2782,"size":2783},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fimage\u002Fblob\u002Fmain\u002Fsrc\u002Fruntime\u002Fcomponents\u002FNuxtImg.vue","xs",{},{"title":36,"description":2777},"SZnX-pMuR5AUOLvjAvND1Ig5hkYq2RiB8IUC7k7WJ28",[2788,2790],{"title":26,"path":27,"stem":28,"description":2789,"children":-1},"A comprehensive guide to migrate your application from Nuxt Image v1 to Nuxt Image v2.",{"title":40,"path":41,"stem":42,"description":2791,"children":-1},"Discover how to use and configure the Nuxt Picture component.",1784666098822]