[{"data":1,"prerenderedAt":811},["ShallowReactive",2],{"navigation_docs":3,"-providers-builderio":208,"-providers-builderio-surround":806},[4,30,47,195],{"title":5,"path":6,"stem":7,"children":8,"page":29},"Get Started","\u002Fget-started","1.get-started",[9,13,17,21,25],{"title":10,"path":11,"stem":12},"Installation","\u002Fget-started\u002Finstallation","1.get-started\u002F1.installation",{"title":14,"path":15,"stem":16},"Configuration","\u002Fget-started\u002Fconfiguration","1.get-started\u002F2.configuration",{"title":18,"path":19,"stem":20},"Providers","\u002Fget-started\u002Fproviders","1.get-started\u002F3.providers",{"title":22,"path":23,"stem":24},"Contributing","\u002Fget-started\u002Fcontributing","1.get-started\u002F4.contributing",{"title":26,"path":27,"stem":28},"Migration","\u002Fget-started\u002Fmigration","1.get-started\u002F5.migration",false,{"title":31,"path":32,"stem":33,"children":34,"page":29},"Usage","\u002Fusage","2.usage",[35,39,43],{"title":36,"path":37,"stem":38},"\u003CNuxtImg>","\u002Fusage\u002Fnuxt-img","2.usage\u002F1.nuxt-img",{"title":40,"path":41,"stem":42},"\u003CNuxtPicture>","\u002Fusage\u002Fnuxt-picture","2.usage\u002F2.nuxt-picture",{"title":44,"path":45,"stem":46},"useImage()","\u002Fusage\u002Fuse-image","2.usage\u002F3.use-image",{"title":18,"path":48,"stem":49,"children":50,"page":29},"\u002Fproviders","3.providers",[51,55,59,63,67,71,75,79,83,87,91,95,99,103,107,111,115,119,123,127,131,135,139,143,147,151,155,159,163,167,171,175,179,183,187,191],{"title":52,"path":53,"stem":54},"Aliyun","\u002Fproviders\u002Faliyun","3.providers\u002Faliyun",{"title":56,"path":57,"stem":58},"AWS Amplify","\u002Fproviders\u002Faws-amplify","3.providers\u002Faws-amplify",{"title":60,"path":61,"stem":62},"Builder.io","\u002Fproviders\u002Fbuilderio","3.providers\u002Fbuilderio",{"title":64,"path":65,"stem":66},"Bunny","\u002Fproviders\u002Fbunny","3.providers\u002Fbunny",{"title":68,"path":69,"stem":70},"Caisy","\u002Fproviders\u002Fcaisy","3.providers\u002Fcaisy",{"title":72,"path":73,"stem":74},"Cloudflare","\u002Fproviders\u002Fcloudflare","3.providers\u002Fcloudflare",{"title":76,"path":77,"stem":78},"Cloudimage","\u002Fproviders\u002Fcloudimage","3.providers\u002Fcloudimage",{"title":80,"path":81,"stem":82},"Cloudinary","\u002Fproviders\u002Fcloudinary","3.providers\u002Fcloudinary",{"title":84,"path":85,"stem":86},"Contentful","\u002Fproviders\u002Fcontentful","3.providers\u002Fcontentful",{"title":88,"path":89,"stem":90},"Directus","\u002Fproviders\u002Fdirectus","3.providers\u002Fdirectus",{"title":92,"path":93,"stem":94},"Fastly","\u002Fproviders\u002Ffastly","3.providers\u002Ffastly",{"title":96,"path":97,"stem":98},"Filerobot","\u002Fproviders\u002Ffilerobot","3.providers\u002Ffilerobot",{"title":100,"path":101,"stem":102},"GitHub","\u002Fproviders\u002Fgithub","3.providers\u002Fgithub",{"title":104,"path":105,"stem":106},"Glide","\u002Fproviders\u002Fglide","3.providers\u002Fglide",{"title":108,"path":109,"stem":110},"Gumlet","\u002Fproviders\u002Fgumlet","3.providers\u002Fgumlet",{"title":112,"path":113,"stem":114},"Hygraph","\u002Fproviders\u002Fhygraph","3.providers\u002Fhygraph",{"title":116,"path":117,"stem":118},"ImageEngine","\u002Fproviders\u002Fimageengine","3.providers\u002Fimageengine",{"title":120,"path":121,"stem":122},"ImageKit","\u002Fproviders\u002Fimagekit","3.providers\u002Fimagekit",{"title":124,"path":125,"stem":126},"Imgix","\u002Fproviders\u002Fimgix","3.providers\u002Fimgix",{"title":128,"path":129,"stem":130},"IPX","\u002Fproviders\u002Fipx","3.providers\u002Fipx",{"title":132,"path":133,"stem":134},"Netlify","\u002Fproviders\u002Fnetlify","3.providers\u002Fnetlify",{"title":136,"path":137,"stem":138},"None","\u002Fproviders\u002Fnone","3.providers\u002Fnone",{"title":140,"path":141,"stem":142},"Picsum","\u002Fproviders\u002Fpicsum","3.providers\u002Fpicsum",{"title":144,"path":145,"stem":146},"Prepr","\u002Fproviders\u002Fprepr","3.providers\u002Fprepr",{"title":148,"path":149,"stem":150},"Prismic","\u002Fproviders\u002Fprismic","3.providers\u002Fprismic",{"title":152,"path":153,"stem":154},"Sanity","\u002Fproviders\u002Fsanity","3.providers\u002Fsanity",{"title":156,"path":157,"stem":158},"Shopify","\u002Fproviders\u002Fshopify","3.providers\u002Fshopify",{"title":160,"path":161,"stem":162},"Sirv","\u002Fproviders\u002Fsirv","3.providers\u002Fsirv",{"title":164,"path":165,"stem":166},"Storyblok","\u002Fproviders\u002Fstoryblok","3.providers\u002Fstoryblok",{"title":168,"path":169,"stem":170},"Strapi","\u002Fproviders\u002Fstrapi","3.providers\u002Fstrapi",{"title":172,"path":173,"stem":174},"Supabase","\u002Fproviders\u002Fsupabase","3.providers\u002Fsupabase",{"title":176,"path":177,"stem":178},"Twicpics","\u002Fproviders\u002Ftwicpics","3.providers\u002Ftwicpics",{"title":180,"path":181,"stem":182},"Unsplash","\u002Fproviders\u002Funsplash","3.providers\u002Funsplash",{"title":184,"path":185,"stem":186},"Uploadcare","\u002Fproviders\u002Fuploadcare","3.providers\u002Fuploadcare",{"title":188,"path":189,"stem":190},"Vercel","\u002Fproviders\u002Fvercel","3.providers\u002Fvercel",{"title":192,"path":193,"stem":194},"Weserv","\u002Fproviders\u002Fweserv","3.providers\u002Fweserv",{"title":196,"path":197,"stem":198,"children":199,"page":29},"Advanced","\u002Fadvanced","4.advanced",[200,204],{"title":201,"path":202,"stem":203},"Custom Provider","\u002Fadvanced\u002Fcustom-provider","4.advanced\u002F1.custom-provider",{"title":205,"path":206,"stem":207},"Static Images","\u002Fadvanced\u002Fstatic-images","4.advanced\u002F2.static-images",{"id":209,"title":60,"body":210,"description":794,"extension":795,"links":796,"meta":802,"navigation":803,"path":61,"seo":804,"stem":62,"__hash__":805},"docs\u002F3.providers\u002Fbuilderio.md",{"type":211,"value":212,"toc":785},"minimark",[213,225,228,233,236,271,275,281,313,389,392,397,451,454,459,491,507,561,564,572,620,630,684,687,694,774,781],[214,215,216,217,224],"p",{},"Integration between ",[218,219,223],"a",{"href":220,"rel":221},"https:\u002F\u002Fwww.builder.io\u002Fc\u002Fdocs\u002Fimage-api",[222],"nofollow","Builder.io Image API"," and Nuxt Image.",[214,226,227],{},"The Builder.io Image API provides optimized image transformations for images uploaded to Builder.io.",[229,230,232],"h2",{"id":231},"modifiers","Modifiers",[214,234,235],{},"The Builder.io provider supports the following modifiers:",[237,238,239,246,251,256,261,266],"ul",{},[240,241,242],"li",{},[243,244,245],"code",{},"width",[240,247,248],{},[243,249,250],{},"height",[240,252,253],{},[243,254,255],{},"format",[240,257,258],{},[243,259,260],{},"quality",[240,262,263],{},[243,264,265],{},"fit",[240,267,268],{},[243,269,270],{},"position",[272,273,274],"h3",{"id":255},"Format",[214,276,277,278,280],{},"The ",[243,279,255],{}," modifier is supported with the following values:",[237,282,283,288,293,298,303,308],{},[240,284,285],{},[243,286,287],{},"webp",[240,289,290],{},[243,291,292],{},"jpg",[240,294,295],{},[243,296,297],{},"jpeg",[240,299,300],{},[243,301,302],{},"png",[240,304,305],{},[243,306,307],{},"gif",[240,309,310],{},[243,311,312],{},"original",[314,315,320],"pre",{"className":316,"code":317,"language":318,"meta":319,"style":319},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNuxtImg src=\"...\" width=\"300\" height=\"300\" modifiers=\"{ format: 'webp' }\" \u002F>\n","vue","",[243,321,322],{"__ignoreMap":319},[323,324,327,331,335,339,342,345,349,351,354,356,358,361,363,366,368,370,372,374,377,379,381,384,386],"span",{"class":325,"line":326},"line",1,[323,328,330],{"class":329},"sMK4o","\u003C",[323,332,334],{"class":333},"swJcz","NuxtImg",[323,336,338],{"class":337},"spNyl"," src",[323,340,341],{"class":329},"=",[323,343,344],{"class":329},"\"",[323,346,348],{"class":347},"sfazB","...",[323,350,344],{"class":329},[323,352,353],{"class":337}," width",[323,355,341],{"class":329},[323,357,344],{"class":329},[323,359,360],{"class":347},"300",[323,362,344],{"class":329},[323,364,365],{"class":337}," height",[323,367,341],{"class":329},[323,369,344],{"class":329},[323,371,360],{"class":347},[323,373,344],{"class":329},[323,375,376],{"class":337}," modifiers",[323,378,341],{"class":329},[323,380,344],{"class":329},[323,382,383],{"class":347},"{ format: 'webp' }",[323,385,344],{"class":329},[323,387,388],{"class":329}," \u002F>\n",[272,390,391],{"id":260},"Quality",[214,393,277,394,396],{},[243,395,260],{}," modifier is supported. Values range from 1 (worst quality, smallest file size) to 100 (best quality, largest file size). Default is 85.",[314,398,400],{"className":316,"code":399,"language":318,"meta":319,"style":319},"\u003CNuxtImg src=\"...\" width=\"300\" height=\"300\" modifiers=\"{ quality: 90 }\" \u002F>\n",[243,401,402],{"__ignoreMap":319},[323,403,404,406,408,410,412,414,416,418,420,422,424,426,428,430,432,434,436,438,440,442,444,447,449],{"class":325,"line":326},[323,405,330],{"class":329},[323,407,334],{"class":333},[323,409,338],{"class":337},[323,411,341],{"class":329},[323,413,344],{"class":329},[323,415,348],{"class":347},[323,417,344],{"class":329},[323,419,353],{"class":337},[323,421,341],{"class":329},[323,423,344],{"class":329},[323,425,360],{"class":347},[323,427,344],{"class":329},[323,429,365],{"class":337},[323,431,341],{"class":329},[323,433,344],{"class":329},[323,435,360],{"class":347},[323,437,344],{"class":329},[323,439,376],{"class":337},[323,441,341],{"class":329},[323,443,344],{"class":329},[323,445,446],{"class":347},"{ quality: 90 }",[323,448,344],{"class":329},[323,450,388],{"class":329},[272,452,453],{"id":265},"Fit",[214,455,277,456,458],{},[243,457,265],{}," modifier determines how the image should fit within the specified dimensions. Valid values are:",[237,460,461,467,473,479,485],{},[240,462,463,466],{},[243,464,465],{},"cover"," - Cover the entire area (default)",[240,468,469,472],{},[243,470,471],{},"contain"," - Fit within the area while maintaining aspect ratio",[240,474,475,478],{},[243,476,477],{},"fill"," - Fill the area, potentially distorting the image",[240,480,481,484],{},[243,482,483],{},"inside"," - Fit inside the area while maintaining aspect ratio",[240,486,487,490],{},[243,488,489],{},"outside"," - Fit outside the area while maintaining aspect ratio",[214,492,493,497,498,500,501,503,504,506],{},[494,495,496],"strong",{},"Note:"," The ",[243,499,265],{}," parameter only has an effect if ",[243,502,255],{}," is set to ",[243,505,287],{},".",[314,508,510],{"className":316,"code":509,"language":318,"meta":319,"style":319},"\u003CNuxtImg src=\"...\" width=\"300\" height=\"300\" modifiers=\"{ fit: 'contain', format: 'webp' }\" \u002F>\n",[243,511,512],{"__ignoreMap":319},[323,513,514,516,518,520,522,524,526,528,530,532,534,536,538,540,542,544,546,548,550,552,554,557,559],{"class":325,"line":326},[323,515,330],{"class":329},[323,517,334],{"class":333},[323,519,338],{"class":337},[323,521,341],{"class":329},[323,523,344],{"class":329},[323,525,348],{"class":347},[323,527,344],{"class":329},[323,529,353],{"class":337},[323,531,341],{"class":329},[323,533,344],{"class":329},[323,535,360],{"class":347},[323,537,344],{"class":329},[323,539,365],{"class":337},[323,541,341],{"class":329},[323,543,344],{"class":329},[323,545,360],{"class":347},[323,547,344],{"class":329},[323,549,376],{"class":337},[323,551,341],{"class":329},[323,553,344],{"class":329},[323,555,556],{"class":347},"{ fit: 'contain', format: 'webp' }",[323,558,344],{"class":329},[323,560,388],{"class":329},[272,562,563],{"id":270},"Position",[214,565,277,566,568,569,571],{},[243,567,270],{}," modifier determines the anchor point for cropping when ",[243,570,265],{}," is used. Valid values are:",[237,573,574,579,584,589,594,599,604,609,614],{},[240,575,576],{},[243,577,578],{},"top",[240,580,581],{},[243,582,583],{},"right top",[240,585,586],{},[243,587,588],{},"right",[240,590,591],{},[243,592,593],{},"right bottom",[240,595,596],{},[243,597,598],{},"bottom",[240,600,601],{},[243,602,603],{},"left bottom",[240,605,606],{},[243,607,608],{},"left",[240,610,611],{},[243,612,613],{},"left top",[240,615,616,619],{},[243,617,618],{},"center"," (default)",[214,621,622,497,624,500,626,503,628,506],{},[494,623,496],{},[243,625,270],{},[243,627,255],{},[243,629,287],{},[314,631,633],{"className":316,"code":632,"language":318,"meta":319,"style":319},"\u003CNuxtImg src=\"...\" width=\"300\" height=\"300\" modifiers=\"{ position: 'bottom left', format: 'webp' }\" \u002F>\n",[243,634,635],{"__ignoreMap":319},[323,636,637,639,641,643,645,647,649,651,653,655,657,659,661,663,665,667,669,671,673,675,677,680,682],{"class":325,"line":326},[323,638,330],{"class":329},[323,640,334],{"class":333},[323,642,338],{"class":337},[323,644,341],{"class":329},[323,646,344],{"class":329},[323,648,348],{"class":347},[323,650,344],{"class":329},[323,652,353],{"class":337},[323,654,341],{"class":329},[323,656,344],{"class":329},[323,658,360],{"class":347},[323,660,344],{"class":329},[323,662,365],{"class":337},[323,664,341],{"class":329},[323,666,344],{"class":329},[323,668,360],{"class":347},[323,670,344],{"class":329},[323,672,376],{"class":337},[323,674,341],{"class":329},[323,676,344],{"class":329},[323,678,679],{"class":347},"{ position: 'bottom left', format: 'webp' }",[323,681,344],{"class":329},[323,683,388],{"class":329},[229,685,31],{"id":686},"usage",[214,688,689,690,693],{},"To use this provider, pass the image URL from Builder.io to the ",[243,691,692],{},"src"," prop:",[314,695,697],{"className":316,"code":696,"language":318,"meta":319,"style":319},"\u003CNuxtImg \n  provider=\"builderio\"\n  src=\"https:\u002F\u002Fcdn.builder.io\u002Fapi\u002Fv1\u002Fimage\u002Fassets\u002FYJIGb4i01jvw0SRdL5Bt\u002F869bfbaec9c64415ae68235d9b7b1425\"\n  width=\"300\"\n  height=\"300\"\n\u002F>\n",[243,698,699,709,725,740,754,768],{"__ignoreMap":319},[323,700,701,703,705],{"class":325,"line":326},[323,702,330],{"class":329},[323,704,334],{"class":333},[323,706,708],{"class":707},"sTEyZ"," \n",[323,710,712,715,717,719,722],{"class":325,"line":711},2,[323,713,714],{"class":337},"  provider",[323,716,341],{"class":329},[323,718,344],{"class":329},[323,720,721],{"class":347},"builderio",[323,723,724],{"class":329},"\"\n",[323,726,728,731,733,735,738],{"class":325,"line":727},3,[323,729,730],{"class":337},"  src",[323,732,341],{"class":329},[323,734,344],{"class":329},[323,736,737],{"class":347},"https:\u002F\u002Fcdn.builder.io\u002Fapi\u002Fv1\u002Fimage\u002Fassets\u002FYJIGb4i01jvw0SRdL5Bt\u002F869bfbaec9c64415ae68235d9b7b1425",[323,739,724],{"class":329},[323,741,743,746,748,750,752],{"class":325,"line":742},4,[323,744,745],{"class":337},"  width",[323,747,341],{"class":329},[323,749,344],{"class":329},[323,751,360],{"class":347},[323,753,724],{"class":329},[323,755,757,760,762,764,766],{"class":325,"line":756},5,[323,758,759],{"class":337},"  height",[323,761,341],{"class":329},[323,763,344],{"class":329},[323,765,360],{"class":347},[323,767,724],{"class":329},[323,769,771],{"class":325,"line":770},6,[323,772,773],{"class":707},"\u002F>\n",[214,775,776,777,506],{},"For more information about the Builder.io Image API, see the ",[218,778,780],{"href":220,"rel":779},[222],"official documentation",[782,783,784],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}",{"title":319,"searchDepth":711,"depth":711,"links":786},[787,793],{"id":231,"depth":711,"text":232,"children":788},[789,790,791,792],{"id":255,"depth":727,"text":274},{"id":260,"depth":727,"text":391},{"id":265,"depth":727,"text":453},{"id":270,"depth":727,"text":563},{"id":686,"depth":711,"text":31},"Nuxt Image integration with Builder.io Image API.","md",[797],{"label":798,"icon":799,"to":800,"size":801},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fimage\u002Fblob\u002Fmain\u002Fsrc\u002Fruntime\u002Fproviders\u002Fbuilderio.ts","xs",{},true,{"title":60,"description":794},"UT7PZgpczuAKTwi-wRfYgSrtBQo5kWCSW8O7KXYJSDU",[807,809],{"title":56,"path":57,"stem":58,"description":808,"children":-1},"Nuxt Image has first class integration with AWS Amplify Hosting",{"title":64,"path":65,"stem":66,"description":810,"children":-1},"Nuxt Image with Bunny integration.",1774955428299]