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