[{"data":1,"prerenderedAt":1513},["Reactive",2],{"navigation":3,"docs-/advanced/custom-provider":115,"docs-/advanced/custom-provider-surround":945},[4,20,33,105],{"title":5,"_path":6,"children":7},"Get Started","/get-started",[8,11,14,17],{"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},"Contributing","/get-started/contributing",{"title":21,"_path":22,"children":23},"Usage","/usage",[24,27,30],{"title":25,"_path":26},"\u003CNuxtImg>","/usage/nuxt-img",{"title":28,"_path":29},"\u003CNuxtPicture>","/usage/nuxt-picture",{"title":31,"_path":32},"useImage()","/usage/use-image",{"title":15,"_path":34,"children":35},"/providers",[36,39,42,45,48,51,54,57,60,63,66,69,72,75,78,81,84,87,90,93,96,99,102],{"title":37,"_path":38},"Cloudflare","/providers/cloudflare",{"title":40,"_path":41},"Cloudimage","/providers/cloudimage",{"title":43,"_path":44},"Cloudinary","/providers/cloudinary",{"title":46,"_path":47},"Contentful","/providers/contentful",{"title":49,"_path":50},"Directus","/providers/directus",{"title":52,"_path":53},"Edgio","/providers/edgio",{"title":55,"_path":56},"Fastly","/providers/fastly",{"title":58,"_path":59},"Glide","/providers/glide",{"title":61,"_path":62},"Gumlet","/providers/gumlet",{"title":64,"_path":65},"ImageEngine","/providers/imageengine",{"title":67,"_path":68},"ImageKit","/providers/imagekit",{"title":70,"_path":71},"Imgix","/providers/imgix",{"title":73,"_path":74},"IPX","/providers/ipx",{"title":76,"_path":77},"Netlify","/providers/netlify",{"title":79,"_path":80},"Prepr","/providers/prepr",{"title":82,"_path":83},"Prismic","/providers/prismic",{"title":85,"_path":86},"Sanity","/providers/sanity",{"title":88,"_path":89},"Storyblok","/providers/storyblok",{"title":91,"_path":92},"Strapi","/providers/strapi",{"title":94,"_path":95},"Twicpics","/providers/twicpics",{"title":97,"_path":98},"Unsplash","/providers/unsplash",{"title":100,"_path":101},"Uploadcare","/providers/uploadcare",{"title":103,"_path":104},"Vercel","/providers/vercel",{"title":106,"_path":107,"children":108},"Advanced","/advanced",[109,112],{"title":110,"_path":111},"Custom Provider","/advanced/custom-provider",{"title":113,"_path":114},"Static Images","/advanced/static-images",{"_path":111,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":110,"description":119,"body":120,"_type":940,"_id":941,"_source":942,"_file":943,"_extension":944},"advanced",false,"","If a CDN provider is not supported, you can define it yourself.",{"type":121,"children":122,"toc":931},"root",[123,132,138,547,554,630,647,653,666,672,678,696,903,925],{"type":124,"tag":125,"props":126,"children":128},"element","h2",{"id":127},"provider-entry",[129],{"type":130,"value":131},"text","Provider Entry",{"type":124,"tag":133,"props":134,"children":135},"p",{},[136],{"type":130,"value":137},"The runtime will receive a source, image modifiers and its provider options. It is responsible for generating a url for optimized images, and needs to be isomorphic because it may be called on either server or client.",{"type":124,"tag":139,"props":140,"children":144},"pre",{"className":141,"code":142,"language":143,"meta":118,"style":118},"language-js shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","import { joinURL } from 'ufo'\n\n// import {} from '#image'\n\nexport function getImage(src, { modifiers, baseURL } = {}, { options, $img }) {\n  const { width, height, format, fit, ...providerModifiers } = modifiers\n  const operations = []\n  // process modifiers\n  const operationsString = operations.join(',')\n  return {\n    url: joinURL(baseURL, operationsString, src)\n  }\n}\n","js",[145],{"type":124,"tag":146,"props":147,"children":148},"code",{"__ignoreMap":118},[149,199,203,213,217,313,384,407,416,468,481,529,538],{"type":124,"tag":150,"props":151,"children":154},"span",{"class":152,"line":153},"line",1,[155,161,167,173,178,183,188,194],{"type":124,"tag":150,"props":156,"children":158},{"style":157},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[159],{"type":130,"value":160},"import",{"type":124,"tag":150,"props":162,"children":164},{"style":163},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5",[165],{"type":130,"value":166}," {",{"type":124,"tag":150,"props":168,"children":170},{"style":169},"color:#EEFFFF;--shiki-dark:#BABED8;--shiki-light:#90A4AE",[171],{"type":130,"value":172}," joinURL",{"type":124,"tag":150,"props":174,"children":175},{"style":163},[176],{"type":130,"value":177}," }",{"type":124,"tag":150,"props":179,"children":180},{"style":157},[181],{"type":130,"value":182}," from",{"type":124,"tag":150,"props":184,"children":185},{"style":163},[186],{"type":130,"value":187}," '",{"type":124,"tag":150,"props":189,"children":191},{"style":190},"color:#C3E88D;--shiki-dark:#C3E88D;--shiki-light:#91B859",[192],{"type":130,"value":193},"ufo",{"type":124,"tag":150,"props":195,"children":196},{"style":163},[197],{"type":130,"value":198},"'",{"type":124,"tag":150,"props":200,"children":202},{"class":152,"line":201},2,[],{"type":124,"tag":150,"props":204,"children":206},{"class":152,"line":205},3,[207],{"type":124,"tag":150,"props":208,"children":210},{"style":209},"color:#546E7A;--shiki-dark:#676E95;--shiki-light:#90A4AE;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[211],{"type":130,"value":212},"// import {} from '#image'",{"type":124,"tag":150,"props":214,"children":216},{"class":152,"line":215},4,[],{"type":124,"tag":150,"props":218,"children":220},{"class":152,"line":219},5,[221,226,232,238,243,249,254,258,263,267,272,276,281,286,290,295,299,304,309],{"type":124,"tag":150,"props":222,"children":223},{"style":157},[224],{"type":130,"value":225},"export",{"type":124,"tag":150,"props":227,"children":229},{"style":228},"color:#C792EA;--shiki-dark:#C792EA;--shiki-light:#9C3EDA",[230],{"type":130,"value":231}," function",{"type":124,"tag":150,"props":233,"children":235},{"style":234},"color:#82AAFF;--shiki-dark:#82AAFF;--shiki-light:#6182B8",[236],{"type":130,"value":237}," getImage",{"type":124,"tag":150,"props":239,"children":240},{"style":163},[241],{"type":130,"value":242},"(",{"type":124,"tag":150,"props":244,"children":246},{"style":245},"color:#EEFFFF;--shiki-dark:#BABED8;--shiki-light:#90A4AE;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[247],{"type":130,"value":248},"src",{"type":124,"tag":150,"props":250,"children":251},{"style":163},[252],{"type":130,"value":253},",",{"type":124,"tag":150,"props":255,"children":256},{"style":163},[257],{"type":130,"value":166},{"type":124,"tag":150,"props":259,"children":260},{"style":245},[261],{"type":130,"value":262}," modifiers",{"type":124,"tag":150,"props":264,"children":265},{"style":163},[266],{"type":130,"value":253},{"type":124,"tag":150,"props":268,"children":269},{"style":245},[270],{"type":130,"value":271}," baseURL",{"type":124,"tag":150,"props":273,"children":274},{"style":163},[275],{"type":130,"value":177},{"type":124,"tag":150,"props":277,"children":278},{"style":163},[279],{"type":130,"value":280}," =",{"type":124,"tag":150,"props":282,"children":283},{"style":163},[284],{"type":130,"value":285}," {},",{"type":124,"tag":150,"props":287,"children":288},{"style":163},[289],{"type":130,"value":166},{"type":124,"tag":150,"props":291,"children":292},{"style":245},[293],{"type":130,"value":294}," options",{"type":124,"tag":150,"props":296,"children":297},{"style":163},[298],{"type":130,"value":253},{"type":124,"tag":150,"props":300,"children":301},{"style":245},[302],{"type":130,"value":303}," $img",{"type":124,"tag":150,"props":305,"children":306},{"style":163},[307],{"type":130,"value":308}," })",{"type":124,"tag":150,"props":310,"children":311},{"style":163},[312],{"type":130,"value":166},{"type":124,"tag":150,"props":314,"children":316},{"class":152,"line":315},6,[317,322,326,331,335,340,344,349,353,358,362,367,372,376,380],{"type":124,"tag":150,"props":318,"children":319},{"style":228},[320],{"type":130,"value":321},"  const",{"type":124,"tag":150,"props":323,"children":324},{"style":163},[325],{"type":130,"value":166},{"type":124,"tag":150,"props":327,"children":328},{"style":169},[329],{"type":130,"value":330}," width",{"type":124,"tag":150,"props":332,"children":333},{"style":163},[334],{"type":130,"value":253},{"type":124,"tag":150,"props":336,"children":337},{"style":169},[338],{"type":130,"value":339}," height",{"type":124,"tag":150,"props":341,"children":342},{"style":163},[343],{"type":130,"value":253},{"type":124,"tag":150,"props":345,"children":346},{"style":169},[347],{"type":130,"value":348}," format",{"type":124,"tag":150,"props":350,"children":351},{"style":163},[352],{"type":130,"value":253},{"type":124,"tag":150,"props":354,"children":355},{"style":169},[356],{"type":130,"value":357}," fit",{"type":124,"tag":150,"props":359,"children":360},{"style":163},[361],{"type":130,"value":253},{"type":124,"tag":150,"props":363,"children":364},{"style":163},[365],{"type":130,"value":366}," ...",{"type":124,"tag":150,"props":368,"children":369},{"style":169},[370],{"type":130,"value":371},"providerModifiers",{"type":124,"tag":150,"props":373,"children":374},{"style":163},[375],{"type":130,"value":177},{"type":124,"tag":150,"props":377,"children":378},{"style":163},[379],{"type":130,"value":280},{"type":124,"tag":150,"props":381,"children":382},{"style":169},[383],{"type":130,"value":262},{"type":124,"tag":150,"props":385,"children":387},{"class":152,"line":386},7,[388,392,397,401],{"type":124,"tag":150,"props":389,"children":390},{"style":228},[391],{"type":130,"value":321},{"type":124,"tag":150,"props":393,"children":394},{"style":169},[395],{"type":130,"value":396}," operations",{"type":124,"tag":150,"props":398,"children":399},{"style":163},[400],{"type":130,"value":280},{"type":124,"tag":150,"props":402,"children":404},{"style":403},"color:#F07178;--shiki-dark:#F07178;--shiki-light:#E53935",[405],{"type":130,"value":406}," []",{"type":124,"tag":150,"props":408,"children":410},{"class":152,"line":409},8,[411],{"type":124,"tag":150,"props":412,"children":413},{"style":209},[414],{"type":130,"value":415},"  // process modifiers",{"type":124,"tag":150,"props":417,"children":419},{"class":152,"line":418},9,[420,424,429,433,437,442,447,451,455,459,463],{"type":124,"tag":150,"props":421,"children":422},{"style":228},[423],{"type":130,"value":321},{"type":124,"tag":150,"props":425,"children":426},{"style":169},[427],{"type":130,"value":428}," operationsString",{"type":124,"tag":150,"props":430,"children":431},{"style":163},[432],{"type":130,"value":280},{"type":124,"tag":150,"props":434,"children":435},{"style":169},[436],{"type":130,"value":396},{"type":124,"tag":150,"props":438,"children":439},{"style":163},[440],{"type":130,"value":441},".",{"type":124,"tag":150,"props":443,"children":444},{"style":234},[445],{"type":130,"value":446},"join",{"type":124,"tag":150,"props":448,"children":449},{"style":403},[450],{"type":130,"value":242},{"type":124,"tag":150,"props":452,"children":453},{"style":163},[454],{"type":130,"value":198},{"type":124,"tag":150,"props":456,"children":457},{"style":190},[458],{"type":130,"value":253},{"type":124,"tag":150,"props":460,"children":461},{"style":163},[462],{"type":130,"value":198},{"type":124,"tag":150,"props":464,"children":465},{"style":403},[466],{"type":130,"value":467},")",{"type":124,"tag":150,"props":469,"children":471},{"class":152,"line":470},10,[472,477],{"type":124,"tag":150,"props":473,"children":474},{"style":157},[475],{"type":130,"value":476},"  return",{"type":124,"tag":150,"props":478,"children":479},{"style":163},[480],{"type":130,"value":166},{"type":124,"tag":150,"props":482,"children":484},{"class":152,"line":483},11,[485,490,495,499,503,508,512,516,520,525],{"type":124,"tag":150,"props":486,"children":487},{"style":403},[488],{"type":130,"value":489},"    url",{"type":124,"tag":150,"props":491,"children":492},{"style":163},[493],{"type":130,"value":494},":",{"type":124,"tag":150,"props":496,"children":497},{"style":234},[498],{"type":130,"value":172},{"type":124,"tag":150,"props":500,"children":501},{"style":403},[502],{"type":130,"value":242},{"type":124,"tag":150,"props":504,"children":505},{"style":169},[506],{"type":130,"value":507},"baseURL",{"type":124,"tag":150,"props":509,"children":510},{"style":163},[511],{"type":130,"value":253},{"type":124,"tag":150,"props":513,"children":514},{"style":169},[515],{"type":130,"value":428},{"type":124,"tag":150,"props":517,"children":518},{"style":163},[519],{"type":130,"value":253},{"type":124,"tag":150,"props":521,"children":522},{"style":169},[523],{"type":130,"value":524}," src",{"type":124,"tag":150,"props":526,"children":527},{"style":403},[528],{"type":130,"value":467},{"type":124,"tag":150,"props":530,"children":532},{"class":152,"line":531},12,[533],{"type":124,"tag":150,"props":534,"children":535},{"style":163},[536],{"type":130,"value":537},"  }",{"type":124,"tag":150,"props":539,"children":541},{"class":152,"line":540},13,[542],{"type":124,"tag":150,"props":543,"children":544},{"style":163},[545],{"type":130,"value":546},"}",{"type":124,"tag":548,"props":549,"children":551},"h3",{"id":550},"parameters",[552],{"type":130,"value":553},"Parameters",{"type":124,"tag":555,"props":556,"children":557},"ul",{},[558,568,578],{"type":124,"tag":559,"props":560,"children":561},"li",{},[562,566],{"type":124,"tag":146,"props":563,"children":564},{"className":118},[565],{"type":130,"value":248},{"type":130,"value":567},": Source path of the image.",{"type":124,"tag":559,"props":569,"children":570},{},[571,576],{"type":124,"tag":146,"props":572,"children":573},{"className":118},[574],{"type":130,"value":575},"modifiers",{"type":130,"value":577},": List of image modifiers that are defined in the image component or as a preset.",{"type":124,"tag":559,"props":579,"children":580},{},[581,586,588,593,595],{"type":124,"tag":146,"props":582,"children":583},{"className":118},[584],{"type":130,"value":585},"ctx",{"type":130,"value":587},": (",{"type":124,"tag":146,"props":589,"children":590},{"className":118},[591],{"type":130,"value":592},"ImageCTX",{"type":130,"value":594},") Image module runtime context\n",{"type":124,"tag":555,"props":596,"children":597},{},[598,614],{"type":124,"tag":559,"props":599,"children":600},{},[601,606,607,612],{"type":124,"tag":146,"props":602,"children":603},{"className":118},[604],{"type":130,"value":605},"options",{"type":130,"value":587},{"type":124,"tag":146,"props":608,"children":609},{"className":118},[610],{"type":130,"value":611},"CreateImageOptions",{"type":130,"value":613},") Image module global runtime options",{"type":124,"tag":559,"props":615,"children":616},{},[617,622,624],{"type":124,"tag":146,"props":618,"children":619},{"className":118},[620],{"type":130,"value":621},"$img",{"type":130,"value":623},": The ",{"type":124,"tag":625,"props":626,"children":627},"a",{"href":32},[628],{"type":130,"value":629},"$img helper",{"type":124,"tag":133,"props":631,"children":632},{},[633,639,641,645],{"type":124,"tag":634,"props":635,"children":636},"strong",{},[637],{"type":130,"value":638},"Note:",{"type":130,"value":640}," Values in ",{"type":124,"tag":146,"props":642,"children":643},{"className":118},[644],{"type":130,"value":585},{"type":130,"value":646}," might change. Use it with caution.",{"type":124,"tag":548,"props":648,"children":650},{"id":649},"return",[651],{"type":130,"value":652},"Return",{"type":124,"tag":555,"props":654,"children":655},{},[656],{"type":124,"tag":559,"props":657,"children":658},{},[659,664],{"type":124,"tag":146,"props":660,"children":661},{"className":118},[662],{"type":130,"value":663},"url",{"type":130,"value":665},": Absolute or relative url of optimized image.",{"type":124,"tag":125,"props":667,"children":669},{"id":668},"use-your-provider",[670],{"type":130,"value":671},"Use your provider",{"type":124,"tag":548,"props":673,"children":675},{"id":674},"register-provider",[676],{"type":130,"value":677},"Register provider",{"type":124,"tag":133,"props":679,"children":680},{},[681,683,688,690,695],{"type":130,"value":682},"After you create your own provider, you should register it in the ",{"type":124,"tag":146,"props":684,"children":685},{"className":118},[686],{"type":130,"value":687},"nuxt.config",{"type":130,"value":689},". In order to do that create a property inside ",{"type":124,"tag":146,"props":691,"children":692},{"className":118},[693],{"type":130,"value":694},"image.provider",{"type":130,"value":441},{"type":124,"tag":139,"props":697,"children":699},{"className":141,"code":698,"language":143,"meta":118,"style":118},"export default {\n  ...\n  image: {\n    providers: {\n      customProvider: {\n        name: 'customProvider', // optional value to overrider provider name\n        provider: '~/providers/custom', // Path to custom provider\n        options: {\n          // ... provider options\n        }\n      }\n    }\n  }\n}\n",[700],{"type":124,"tag":146,"props":701,"children":702},{"__ignoreMap":118},[703,719,727,740,756,772,806,840,856,864,872,880,888,895],{"type":124,"tag":150,"props":704,"children":705},{"class":152,"line":153},[706,710,715],{"type":124,"tag":150,"props":707,"children":708},{"style":157},[709],{"type":130,"value":225},{"type":124,"tag":150,"props":711,"children":712},{"style":157},[713],{"type":130,"value":714}," default",{"type":124,"tag":150,"props":716,"children":717},{"style":163},[718],{"type":130,"value":166},{"type":124,"tag":150,"props":720,"children":721},{"class":152,"line":201},[722],{"type":124,"tag":150,"props":723,"children":724},{"style":163},[725],{"type":130,"value":726},"  ...",{"type":124,"tag":150,"props":728,"children":729},{"class":152,"line":205},[730,735],{"type":124,"tag":150,"props":731,"children":732},{"style":169},[733],{"type":130,"value":734},"  image: ",{"type":124,"tag":150,"props":736,"children":737},{"style":163},[738],{"type":130,"value":739},"{",{"type":124,"tag":150,"props":741,"children":742},{"class":152,"line":215},[743,748,752],{"type":124,"tag":150,"props":744,"children":745},{"style":403},[746],{"type":130,"value":747},"    providers",{"type":124,"tag":150,"props":749,"children":750},{"style":163},[751],{"type":130,"value":494},{"type":124,"tag":150,"props":753,"children":754},{"style":163},[755],{"type":130,"value":166},{"type":124,"tag":150,"props":757,"children":758},{"class":152,"line":219},[759,764,768],{"type":124,"tag":150,"props":760,"children":761},{"style":403},[762],{"type":130,"value":763},"      customProvider",{"type":124,"tag":150,"props":765,"children":766},{"style":163},[767],{"type":130,"value":494},{"type":124,"tag":150,"props":769,"children":770},{"style":163},[771],{"type":130,"value":166},{"type":124,"tag":150,"props":773,"children":774},{"class":152,"line":315},[775,780,784,788,793,797,801],{"type":124,"tag":150,"props":776,"children":777},{"style":403},[778],{"type":130,"value":779},"        name",{"type":124,"tag":150,"props":781,"children":782},{"style":163},[783],{"type":130,"value":494},{"type":124,"tag":150,"props":785,"children":786},{"style":163},[787],{"type":130,"value":187},{"type":124,"tag":150,"props":789,"children":790},{"style":190},[791],{"type":130,"value":792},"customProvider",{"type":124,"tag":150,"props":794,"children":795},{"style":163},[796],{"type":130,"value":198},{"type":124,"tag":150,"props":798,"children":799},{"style":163},[800],{"type":130,"value":253},{"type":124,"tag":150,"props":802,"children":803},{"style":209},[804],{"type":130,"value":805}," // optional value to overrider provider name",{"type":124,"tag":150,"props":807,"children":808},{"class":152,"line":386},[809,814,818,822,827,831,835],{"type":124,"tag":150,"props":810,"children":811},{"style":403},[812],{"type":130,"value":813},"        provider",{"type":124,"tag":150,"props":815,"children":816},{"style":163},[817],{"type":130,"value":494},{"type":124,"tag":150,"props":819,"children":820},{"style":163},[821],{"type":130,"value":187},{"type":124,"tag":150,"props":823,"children":824},{"style":190},[825],{"type":130,"value":826},"~/providers/custom",{"type":124,"tag":150,"props":828,"children":829},{"style":163},[830],{"type":130,"value":198},{"type":124,"tag":150,"props":832,"children":833},{"style":163},[834],{"type":130,"value":253},{"type":124,"tag":150,"props":836,"children":837},{"style":209},[838],{"type":130,"value":839}," // Path to custom provider",{"type":124,"tag":150,"props":841,"children":842},{"class":152,"line":409},[843,848,852],{"type":124,"tag":150,"props":844,"children":845},{"style":403},[846],{"type":130,"value":847},"        options",{"type":124,"tag":150,"props":849,"children":850},{"style":163},[851],{"type":130,"value":494},{"type":124,"tag":150,"props":853,"children":854},{"style":163},[855],{"type":130,"value":166},{"type":124,"tag":150,"props":857,"children":858},{"class":152,"line":418},[859],{"type":124,"tag":150,"props":860,"children":861},{"style":209},[862],{"type":130,"value":863},"          // ... provider options",{"type":124,"tag":150,"props":865,"children":866},{"class":152,"line":470},[867],{"type":124,"tag":150,"props":868,"children":869},{"style":163},[870],{"type":130,"value":871},"        }",{"type":124,"tag":150,"props":873,"children":874},{"class":152,"line":483},[875],{"type":124,"tag":150,"props":876,"children":877},{"style":163},[878],{"type":130,"value":879},"      }",{"type":124,"tag":150,"props":881,"children":882},{"class":152,"line":531},[883],{"type":124,"tag":150,"props":884,"children":885},{"style":163},[886],{"type":130,"value":887},"    }",{"type":124,"tag":150,"props":889,"children":890},{"class":152,"line":540},[891],{"type":124,"tag":150,"props":892,"children":893},{"style":163},[894],{"type":130,"value":537},{"type":124,"tag":150,"props":896,"children":898},{"class":152,"line":897},14,[899],{"type":124,"tag":150,"props":900,"children":901},{"style":163},[902],{"type":130,"value":546},{"type":124,"tag":133,"props":904,"children":905},{},[906,908,913,915,923],{"type":130,"value":907},"There are plenty of useful utilities that can be used to write providers by importing from ",{"type":124,"tag":146,"props":909,"children":910},{"className":118},[911],{"type":130,"value":912},"#img",{"type":130,"value":914},". See ",{"type":124,"tag":625,"props":916,"children":920},{"href":917,"rel":918},"https://github.com/nuxt/image/tree/dev/src/runtime/providers",[919],"nofollow",[921],{"type":130,"value":922},"src/runtime/providers",{"type":130,"value":924}," for more info.",{"type":124,"tag":926,"props":927,"children":928},"style",{},[929],{"type":130,"value":930},"html.dark .shiki span {color: var(--shiki-dark) !important;background: var(--shiki-dark-bg) !important;font-style: var(--shiki-dark-font-style) !important;font-weight: var(--shiki-dark-font-weight) !important;text-decoration: var(--shiki-dark-text-decoration) !important;}html.light .shiki span {color: var(--shiki-light) !important;background: var(--shiki-light-bg) !important;font-style: var(--shiki-light-font-style) !important;font-weight: var(--shiki-light-font-weight) !important;text-decoration: var(--shiki-light-text-decoration) !important;}",{"title":118,"searchDepth":201,"depth":201,"links":932},[933,937],{"id":127,"depth":201,"text":131,"children":934},[935,936],{"id":550,"depth":205,"text":553},{"id":649,"depth":205,"text":652},{"id":668,"depth":201,"text":671,"children":938},[939],{"id":674,"depth":205,"text":677},"markdown","content:4.advanced:1.custom-provider.md","content","4.advanced/1.custom-provider.md","md",[946,1276],{"_path":104,"_dir":947,"_draft":117,"_partial":117,"_locale":118,"title":103,"description":948,"links":949,"body":955,"_type":940,"_id":1274,"_source":942,"_file":1275,"_extension":944},"providers","Optimize images at Vercel's Edge Network.",[950],{"label":951,"icon":952,"to":953,"size":954},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/providers/vercel.ts","xs",{"type":121,"children":956,"toc":1270},[957,979,984,990,1002,1010,1106,1112,1141,1146,1153,1266],{"type":124,"tag":133,"props":958,"children":959},{},[960,962,968,970,977],{"type":130,"value":961},"When deploying your nuxt applications to ",{"type":124,"tag":625,"props":963,"children":966},{"href":964,"rel":965},"https://vercel.com/",[919],[967],{"type":130,"value":103},{"type":130,"value":969}," platform, image module can use Vercel's ",{"type":124,"tag":625,"props":971,"children":974},{"href":972,"rel":973},"https://vercel.com/docs/edge-network/overview",[919],[975],{"type":130,"value":976},"Edge Network",{"type":130,"value":978}," to optimize images on demand.",{"type":124,"tag":133,"props":980,"children":981},{},[982],{"type":130,"value":983},"This provider will be enabled by default in vercel deployments.",{"type":124,"tag":125,"props":985,"children":987},{"id":986},"domains",[988],{"type":130,"value":989},"Domains",{"type":124,"tag":133,"props":991,"children":992},{},[993,995,1000],{"type":130,"value":994},"To use external URLs (images not in ",{"type":124,"tag":146,"props":996,"children":997},{"className":118},[998],{"type":130,"value":999},"public/",{"type":130,"value":1001}," directory), hostnames should be whitelisted.",{"type":124,"tag":133,"props":1003,"children":1004},{},[1005],{"type":124,"tag":634,"props":1006,"children":1007},{},[1008],{"type":130,"value":1009},"Example:",{"type":124,"tag":139,"props":1011,"children":1015},{"className":1012,"code":1013,"filename":687,"language":1014,"meta":118,"style":118},"language-ts shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","export default {\n  image: {\n    domains: [\n      'avatars0.githubusercontent.com'\n    ]\n  }\n}\n","ts",[1016],{"type":124,"tag":146,"props":1017,"children":1018},{"__ignoreMap":118},[1019,1034,1050,1067,1084,1092,1099],{"type":124,"tag":150,"props":1020,"children":1021},{"class":152,"line":153},[1022,1026,1030],{"type":124,"tag":150,"props":1023,"children":1024},{"style":157},[1025],{"type":130,"value":225},{"type":124,"tag":150,"props":1027,"children":1028},{"style":157},[1029],{"type":130,"value":714},{"type":124,"tag":150,"props":1031,"children":1032},{"style":163},[1033],{"type":130,"value":166},{"type":124,"tag":150,"props":1035,"children":1036},{"class":152,"line":201},[1037,1042,1046],{"type":124,"tag":150,"props":1038,"children":1039},{"style":403},[1040],{"type":130,"value":1041},"  image",{"type":124,"tag":150,"props":1043,"children":1044},{"style":163},[1045],{"type":130,"value":494},{"type":124,"tag":150,"props":1047,"children":1048},{"style":163},[1049],{"type":130,"value":166},{"type":124,"tag":150,"props":1051,"children":1052},{"class":152,"line":205},[1053,1058,1062],{"type":124,"tag":150,"props":1054,"children":1055},{"style":403},[1056],{"type":130,"value":1057},"    domains",{"type":124,"tag":150,"props":1059,"children":1060},{"style":163},[1061],{"type":130,"value":494},{"type":124,"tag":150,"props":1063,"children":1064},{"style":169},[1065],{"type":130,"value":1066}," [",{"type":124,"tag":150,"props":1068,"children":1069},{"class":152,"line":215},[1070,1075,1080],{"type":124,"tag":150,"props":1071,"children":1072},{"style":163},[1073],{"type":130,"value":1074},"      '",{"type":124,"tag":150,"props":1076,"children":1077},{"style":190},[1078],{"type":130,"value":1079},"avatars0.githubusercontent.com",{"type":124,"tag":150,"props":1081,"children":1082},{"style":163},[1083],{"type":130,"value":198},{"type":124,"tag":150,"props":1085,"children":1086},{"class":152,"line":219},[1087],{"type":124,"tag":150,"props":1088,"children":1089},{"style":169},[1090],{"type":130,"value":1091},"    ]",{"type":124,"tag":150,"props":1093,"children":1094},{"class":152,"line":315},[1095],{"type":124,"tag":150,"props":1096,"children":1097},{"style":163},[1098],{"type":130,"value":537},{"type":124,"tag":150,"props":1100,"children":1101},{"class":152,"line":386},[1102],{"type":124,"tag":150,"props":1103,"children":1104},{"style":163},[1105],{"type":130,"value":546},{"type":124,"tag":125,"props":1107,"children":1109},{"id":1108},"sizes",[1110],{"type":130,"value":1111},"Sizes",{"type":124,"tag":133,"props":1113,"children":1114},{},[1115,1117,1122,1124,1128,1130,1134,1136,1140],{"type":130,"value":1116},"Specify any custom ",{"type":124,"tag":146,"props":1118,"children":1119},{"className":118},[1120],{"type":130,"value":1121},"width",{"type":130,"value":1123}," property you use in ",{"type":124,"tag":146,"props":1125,"children":1126},{"className":118},[1127],{"type":130,"value":25},{"type":130,"value":1129},", ",{"type":124,"tag":146,"props":1131,"children":1132},{"className":118},[1133],{"type":130,"value":28},{"type":130,"value":1135}," and ",{"type":124,"tag":146,"props":1137,"children":1138},{"className":118},[1139],{"type":130,"value":621},{"type":130,"value":441},{"type":124,"tag":133,"props":1142,"children":1143},{},[1144],{"type":130,"value":1145},"If a width is not defined, image will fallback to closest possible width.",{"type":124,"tag":133,"props":1147,"children":1148},{},[1149],{"type":124,"tag":634,"props":1150,"children":1151},{},[1152],{"type":130,"value":1009},{"type":124,"tag":139,"props":1154,"children":1156},{"className":1012,"code":1155,"filename":687,"language":1014,"meta":118,"style":118},"export default {\n  image: {\n    screens: {\n      icon: 40,\n      avatar: 24\n    }\n  }\n}\n",[1157],{"type":124,"tag":146,"props":1158,"children":1159},{"__ignoreMap":118},[1160,1175,1190,1206,1228,1245,1252,1259],{"type":124,"tag":150,"props":1161,"children":1162},{"class":152,"line":153},[1163,1167,1171],{"type":124,"tag":150,"props":1164,"children":1165},{"style":157},[1166],{"type":130,"value":225},{"type":124,"tag":150,"props":1168,"children":1169},{"style":157},[1170],{"type":130,"value":714},{"type":124,"tag":150,"props":1172,"children":1173},{"style":163},[1174],{"type":130,"value":166},{"type":124,"tag":150,"props":1176,"children":1177},{"class":152,"line":201},[1178,1182,1186],{"type":124,"tag":150,"props":1179,"children":1180},{"style":403},[1181],{"type":130,"value":1041},{"type":124,"tag":150,"props":1183,"children":1184},{"style":163},[1185],{"type":130,"value":494},{"type":124,"tag":150,"props":1187,"children":1188},{"style":163},[1189],{"type":130,"value":166},{"type":124,"tag":150,"props":1191,"children":1192},{"class":152,"line":205},[1193,1198,1202],{"type":124,"tag":150,"props":1194,"children":1195},{"style":403},[1196],{"type":130,"value":1197},"    screens",{"type":124,"tag":150,"props":1199,"children":1200},{"style":163},[1201],{"type":130,"value":494},{"type":124,"tag":150,"props":1203,"children":1204},{"style":163},[1205],{"type":130,"value":166},{"type":124,"tag":150,"props":1207,"children":1208},{"class":152,"line":215},[1209,1214,1218,1224],{"type":124,"tag":150,"props":1210,"children":1211},{"style":403},[1212],{"type":130,"value":1213},"      icon",{"type":124,"tag":150,"props":1215,"children":1216},{"style":163},[1217],{"type":130,"value":494},{"type":124,"tag":150,"props":1219,"children":1221},{"style":1220},"color:#F78C6C;--shiki-dark:#F78C6C;--shiki-light:#F76D47",[1222],{"type":130,"value":1223}," 40",{"type":124,"tag":150,"props":1225,"children":1226},{"style":163},[1227],{"type":130,"value":253},{"type":124,"tag":150,"props":1229,"children":1230},{"class":152,"line":219},[1231,1236,1240],{"type":124,"tag":150,"props":1232,"children":1233},{"style":403},[1234],{"type":130,"value":1235},"      avatar",{"type":124,"tag":150,"props":1237,"children":1238},{"style":163},[1239],{"type":130,"value":494},{"type":124,"tag":150,"props":1241,"children":1242},{"style":1220},[1243],{"type":130,"value":1244}," 24",{"type":124,"tag":150,"props":1246,"children":1247},{"class":152,"line":315},[1248],{"type":124,"tag":150,"props":1249,"children":1250},{"style":163},[1251],{"type":130,"value":887},{"type":124,"tag":150,"props":1253,"children":1254},{"class":152,"line":386},[1255],{"type":124,"tag":150,"props":1256,"children":1257},{"style":163},[1258],{"type":130,"value":537},{"type":124,"tag":150,"props":1260,"children":1261},{"class":152,"line":409},[1262],{"type":124,"tag":150,"props":1263,"children":1264},{"style":163},[1265],{"type":130,"value":546},{"type":124,"tag":926,"props":1267,"children":1268},{},[1269],{"type":130,"value":930},{"title":118,"searchDepth":201,"depth":201,"links":1271},[1272,1273],{"id":986,"depth":201,"text":989},{"id":1108,"depth":201,"text":1111},"content:3.providers:vercel.md","3.providers/vercel.md",{"_path":114,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":113,"description":1277,"body":1278,"_type":940,"_id":1511,"_source":942,"_file":1512,"_extension":944},"Optimizing images for static websites.",{"type":121,"children":1279,"toc":1509},[1280,1292,1310,1322,1505],{"type":124,"tag":133,"props":1281,"children":1282},{},[1283,1285,1290],{"type":130,"value":1284},"If you are building a static site using ",{"type":124,"tag":146,"props":1286,"children":1287},{"className":118},[1288],{"type":130,"value":1289},"nuxt generate",{"type":130,"value":1291},", Nuxt Image will optimize and save your images locally when your site is generated - and deploy them alongside your generated pages.",{"type":124,"tag":133,"props":1293,"children":1294},{},[1295,1297,1302,1304,1308],{"type":130,"value":1296},"If you disabled server-side rendering (",{"type":124,"tag":146,"props":1298,"children":1299},{"className":118},[1300],{"type":130,"value":1301},"ssr: false",{"type":130,"value":1303}," in the ",{"type":124,"tag":146,"props":1305,"children":1306},{"className":118},[1307],{"type":130,"value":687},{"type":130,"value":1309},"), Nuxt Image won't be able to optimize your images during the static generation process.",{"type":124,"tag":133,"props":1311,"children":1312},{},[1313,1315,1320],{"type":130,"value":1314},"In that case, you can tell Nuxt to pre-render images by using the ",{"type":124,"tag":146,"props":1316,"children":1317},{"className":118},[1318],{"type":130,"value":1319},"nitro.prerender.routes",{"type":130,"value":1321}," option:",{"type":124,"tag":139,"props":1323,"children":1325},{"className":1012,"code":1324,"language":1014,"meta":118,"style":118},"export default defineNuxtConfig({\n  ssr: false,\n  nitro: {\n    prerender: {\n      routes: [\n        '/_ipx/w_120/market.jpg',\n        '/_ipx/w_140/market.jpg',\n        // etc.\n      ]\n    }\n  }\n})\n",[1326],{"type":124,"tag":146,"props":1327,"children":1328},{"__ignoreMap":118},[1329,1353,1375,1391,1407,1423,1444,1464,1472,1480,1487,1494],{"type":124,"tag":150,"props":1330,"children":1331},{"class":152,"line":153},[1332,1336,1340,1345,1349],{"type":124,"tag":150,"props":1333,"children":1334},{"style":157},[1335],{"type":130,"value":225},{"type":124,"tag":150,"props":1337,"children":1338},{"style":157},[1339],{"type":130,"value":714},{"type":124,"tag":150,"props":1341,"children":1342},{"style":234},[1343],{"type":130,"value":1344}," defineNuxtConfig",{"type":124,"tag":150,"props":1346,"children":1347},{"style":169},[1348],{"type":130,"value":242},{"type":124,"tag":150,"props":1350,"children":1351},{"style":163},[1352],{"type":130,"value":739},{"type":124,"tag":150,"props":1354,"children":1355},{"class":152,"line":201},[1356,1361,1365,1371],{"type":124,"tag":150,"props":1357,"children":1358},{"style":403},[1359],{"type":130,"value":1360},"  ssr",{"type":124,"tag":150,"props":1362,"children":1363},{"style":163},[1364],{"type":130,"value":494},{"type":124,"tag":150,"props":1366,"children":1368},{"style":1367},"color:#FF9CAC;--shiki-dark:#FF9CAC;--shiki-light:#FF5370",[1369],{"type":130,"value":1370}," false",{"type":124,"tag":150,"props":1372,"children":1373},{"style":163},[1374],{"type":130,"value":253},{"type":124,"tag":150,"props":1376,"children":1377},{"class":152,"line":205},[1378,1383,1387],{"type":124,"tag":150,"props":1379,"children":1380},{"style":403},[1381],{"type":130,"value":1382},"  nitro",{"type":124,"tag":150,"props":1384,"children":1385},{"style":163},[1386],{"type":130,"value":494},{"type":124,"tag":150,"props":1388,"children":1389},{"style":163},[1390],{"type":130,"value":166},{"type":124,"tag":150,"props":1392,"children":1393},{"class":152,"line":215},[1394,1399,1403],{"type":124,"tag":150,"props":1395,"children":1396},{"style":403},[1397],{"type":130,"value":1398},"    prerender",{"type":124,"tag":150,"props":1400,"children":1401},{"style":163},[1402],{"type":130,"value":494},{"type":124,"tag":150,"props":1404,"children":1405},{"style":163},[1406],{"type":130,"value":166},{"type":124,"tag":150,"props":1408,"children":1409},{"class":152,"line":219},[1410,1415,1419],{"type":124,"tag":150,"props":1411,"children":1412},{"style":403},[1413],{"type":130,"value":1414},"      routes",{"type":124,"tag":150,"props":1416,"children":1417},{"style":163},[1418],{"type":130,"value":494},{"type":124,"tag":150,"props":1420,"children":1421},{"style":169},[1422],{"type":130,"value":1066},{"type":124,"tag":150,"props":1424,"children":1425},{"class":152,"line":315},[1426,1431,1436,1440],{"type":124,"tag":150,"props":1427,"children":1428},{"style":163},[1429],{"type":130,"value":1430},"        '",{"type":124,"tag":150,"props":1432,"children":1433},{"style":190},[1434],{"type":130,"value":1435},"/_ipx/w_120/market.jpg",{"type":124,"tag":150,"props":1437,"children":1438},{"style":163},[1439],{"type":130,"value":198},{"type":124,"tag":150,"props":1441,"children":1442},{"style":163},[1443],{"type":130,"value":253},{"type":124,"tag":150,"props":1445,"children":1446},{"class":152,"line":386},[1447,1451,1456,1460],{"type":124,"tag":150,"props":1448,"children":1449},{"style":163},[1450],{"type":130,"value":1430},{"type":124,"tag":150,"props":1452,"children":1453},{"style":190},[1454],{"type":130,"value":1455},"/_ipx/w_140/market.jpg",{"type":124,"tag":150,"props":1457,"children":1458},{"style":163},[1459],{"type":130,"value":198},{"type":124,"tag":150,"props":1461,"children":1462},{"style":163},[1463],{"type":130,"value":253},{"type":124,"tag":150,"props":1465,"children":1466},{"class":152,"line":409},[1467],{"type":124,"tag":150,"props":1468,"children":1469},{"style":209},[1470],{"type":130,"value":1471},"        // etc.",{"type":124,"tag":150,"props":1473,"children":1474},{"class":152,"line":418},[1475],{"type":124,"tag":150,"props":1476,"children":1477},{"style":169},[1478],{"type":130,"value":1479},"      ]",{"type":124,"tag":150,"props":1481,"children":1482},{"class":152,"line":470},[1483],{"type":124,"tag":150,"props":1484,"children":1485},{"style":163},[1486],{"type":130,"value":887},{"type":124,"tag":150,"props":1488,"children":1489},{"class":152,"line":483},[1490],{"type":124,"tag":150,"props":1491,"children":1492},{"style":163},[1493],{"type":130,"value":537},{"type":124,"tag":150,"props":1495,"children":1496},{"class":152,"line":531},[1497,1501],{"type":124,"tag":150,"props":1498,"children":1499},{"style":163},[1500],{"type":130,"value":546},{"type":124,"tag":150,"props":1502,"children":1503},{"style":169},[1504],{"type":130,"value":467},{"type":124,"tag":926,"props":1506,"children":1507},{},[1508],{"type":130,"value":930},{"title":118,"searchDepth":201,"depth":201,"links":1510},[],"content:4.advanced:2.static-images.md","4.advanced/2.static-images.md",1697713011321]