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