[{"data":1,"prerenderedAt":884},["ShallowReactive",2],{"navigation":3,"/providers/cloudimage":180,"/providers/cloudimage-surround":879},[4,26,43,167],{"title":5,"path":6,"stem":7,"children":8,"page":25},"Get Started","/get-started","1.get-started",[9,13,17,21],{"title":10,"path":11,"stem":12},"Installation","/get-started/installation","1.get-started/1.installation",{"title":14,"path":15,"stem":16},"Configuration","/get-started/configuration","1.get-started/2.configuration",{"title":18,"path":19,"stem":20},"Providers","/get-started/providers","1.get-started/3.providers",{"title":22,"path":23,"stem":24},"Contributing","/get-started/contributing","1.get-started/4.contributing",false,{"title":27,"path":28,"stem":29,"children":30,"page":25},"Usage","/usage","2.usage",[31,35,39],{"title":32,"path":33,"stem":34},"\u003CNuxtImg>","/usage/nuxt-img","2.usage/1.nuxt-img",{"title":36,"path":37,"stem":38},"\u003CNuxtPicture>","/usage/nuxt-picture","2.usage/2.nuxt-picture",{"title":40,"path":41,"stem":42},"useImage()","/usage/use-image","2.usage/3.use-image",{"title":18,"path":44,"stem":45,"children":46,"page":25},"/providers","3.providers",[47,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],{"title":48,"path":49,"stem":50},"Aliyun","/providers/aliyun","3.providers/aliyun",{"title":52,"path":53,"stem":54},"AWS Amplify","/providers/aws-amplify","3.providers/aws-amplify",{"title":56,"path":57,"stem":58},"Bunny","/providers/bunny","3.providers/bunny",{"title":60,"path":61,"stem":62},"Caisy","/providers/caisy","3.providers/caisy",{"title":64,"path":65,"stem":66},"Cloudflare","/providers/cloudflare","3.providers/cloudflare",{"title":68,"path":69,"stem":70},"Cloudimage","/providers/cloudimage","3.providers/cloudimage",{"title":72,"path":73,"stem":74},"Cloudinary","/providers/cloudinary","3.providers/cloudinary",{"title":76,"path":77,"stem":78},"Contentful","/providers/contentful","3.providers/contentful",{"title":80,"path":81,"stem":82},"Directus","/providers/directus","3.providers/directus",{"title":84,"path":85,"stem":86},"Fastly","/providers/fastly","3.providers/fastly",{"title":88,"path":89,"stem":90},"Filerobot","/providers/filerobot","3.providers/filerobot",{"title":92,"path":93,"stem":94},"Glide","/providers/glide","3.providers/glide",{"title":96,"path":97,"stem":98},"Gumlet","/providers/gumlet","3.providers/gumlet",{"title":100,"path":101,"stem":102},"Hygraph","/providers/hygraph","3.providers/hygraph",{"title":104,"path":105,"stem":106},"ImageEngine","/providers/imageengine","3.providers/imageengine",{"title":108,"path":109,"stem":110},"ImageKit","/providers/imagekit","3.providers/imagekit",{"title":112,"path":113,"stem":114},"Imgix","/providers/imgix","3.providers/imgix",{"title":116,"path":117,"stem":118},"IPX","/providers/ipx","3.providers/ipx",{"title":120,"path":121,"stem":122},"Netlify","/providers/netlify","3.providers/netlify",{"title":124,"path":125,"stem":126},"Prepr","/providers/prepr","3.providers/prepr",{"title":128,"path":129,"stem":130},"Prismic","/providers/prismic","3.providers/prismic",{"title":132,"path":133,"stem":134},"Sanity","/providers/sanity","3.providers/sanity",{"title":136,"path":137,"stem":138},"Sirv","/providers/sirv","3.providers/sirv",{"title":140,"path":141,"stem":142},"Storyblok","/providers/storyblok","3.providers/storyblok",{"title":144,"path":145,"stem":146},"Strapi","/providers/strapi","3.providers/strapi",{"title":148,"path":149,"stem":150},"Twicpics","/providers/twicpics","3.providers/twicpics",{"title":152,"path":153,"stem":154},"Unsplash","/providers/unsplash","3.providers/unsplash",{"title":156,"path":157,"stem":158},"Uploadcare","/providers/uploadcare","3.providers/uploadcare",{"title":160,"path":161,"stem":162},"Vercel","/providers/vercel","3.providers/vercel",{"title":164,"path":165,"stem":166},"Weserv","/providers/weserv","3.providers/weserv",{"title":168,"path":169,"stem":170,"children":171,"page":25},"Advanced","/advanced","4.advanced",[172,176],{"title":173,"path":174,"stem":175},"Custom Provider","/advanced/custom-provider","4.advanced/1.custom-provider",{"title":177,"path":178,"stem":179},"Static Images","/advanced/static-images","4.advanced/2.static-images",{"id":181,"title":68,"body":182,"description":867,"extension":868,"links":869,"meta":875,"navigation":876,"path":69,"seo":877,"stem":70,"__hash__":878},"docs/3.providers/cloudimage.md",{"type":183,"value":184,"toc":856},"minimark",[185,196,208,326,331,336,348,357,362,368,371,447,450,559,565,577,580,597,606,694,700,711,714,775,779,797,805,815,852],[186,187,188,189,195],"p",{},"Integration between ",[190,191,68],"a",{"href":192,"rel":193},"https://www.cloudimage.io/en/home",[194],"nofollow"," and the image module.",[186,197,198,199,203,204,207],{},"To use this provider you need to specify your Cloudimage ",[200,201,202],"code",{},"token"," and the ",[200,205,206],{},"baseURL"," of your image storage.",[209,210,216],"pre",{"className":211,"code":212,"filename":213,"language":214,"meta":215,"style":215},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  image: {\n    cloudimage: {\n      token: 'your_cloudimage_token',\n      baseURL: 'origin_image_url' // or alias\n    }\n  }\n})\n","nuxt.config.ts","ts","",[200,217,218,242,255,265,286,305,311,317],{"__ignoreMap":215},[219,220,223,227,230,234,238],"span",{"class":221,"line":222},"line",1,[219,224,226],{"class":225},"s7zQu","export",[219,228,229],{"class":225}," default",[219,231,233],{"class":232},"s2Zo4"," defineNuxtConfig",[219,235,237],{"class":236},"sTEyZ","(",[219,239,241],{"class":240},"sMK4o","{\n",[219,243,245,249,252],{"class":221,"line":244},2,[219,246,248],{"class":247},"swJcz","  image",[219,250,251],{"class":240},":",[219,253,254],{"class":240}," {\n",[219,256,258,261,263],{"class":221,"line":257},3,[219,259,260],{"class":247},"    cloudimage",[219,262,251],{"class":240},[219,264,254],{"class":240},[219,266,268,271,273,276,280,283],{"class":221,"line":267},4,[219,269,270],{"class":247},"      token",[219,272,251],{"class":240},[219,274,275],{"class":240}," '",[219,277,279],{"class":278},"sfazB","your_cloudimage_token",[219,281,282],{"class":240},"'",[219,284,285],{"class":240},",\n",[219,287,289,292,294,296,299,301],{"class":221,"line":288},5,[219,290,291],{"class":247},"      baseURL",[219,293,251],{"class":240},[219,295,275],{"class":240},[219,297,298],{"class":278},"origin_image_url",[219,300,282],{"class":240},[219,302,304],{"class":303},"sHwdD"," // or alias\n",[219,306,308],{"class":221,"line":307},6,[219,309,310],{"class":240},"    }\n",[219,312,314],{"class":221,"line":313},7,[219,315,316],{"class":240},"  }\n",[219,318,320,323],{"class":221,"line":319},8,[219,321,322],{"class":240},"}",[219,324,325],{"class":236},")\n",[327,328,330],"h2",{"id":329},"options","Options",[332,333,334],"h3",{"id":202},[200,335,202],{},[337,338,339],"ul",{},[340,341,342,343,347],"li",{},"Type: ",[344,345,346],"strong",{},"String"," (required)",[186,349,350,351,356],{},"Your Cloudimage customer token. ",[190,352,355],{"href":353,"rel":354},"https://www.cloudimage.io/en/register_page",[194],"Register"," for a Cloudimage account to get one. Registration takes less than a minute and is totally free.",[332,358,360],{"id":359},"baseurl",[200,361,206],{},[337,363,364],{},[340,365,342,366,347],{},[344,367,346],{},[186,369,370],{},"Your origin image URL or storage alias that allows to shorten your origin image URLs.",[209,372,374],{"className":211,"code":373,"filename":213,"language":214,"meta":215,"style":215},"export default defineNuxtConfig({\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li'\n    }\n  }\n})\n",[200,375,376,388,396,404,419,433,437,441],{"__ignoreMap":215},[219,377,378,380,382,384,386],{"class":221,"line":222},[219,379,226],{"class":225},[219,381,229],{"class":225},[219,383,233],{"class":232},[219,385,237],{"class":236},[219,387,241],{"class":240},[219,389,390,392,394],{"class":221,"line":244},[219,391,248],{"class":247},[219,393,251],{"class":240},[219,395,254],{"class":240},[219,397,398,400,402],{"class":221,"line":257},[219,399,260],{"class":247},[219,401,251],{"class":240},[219,403,254],{"class":240},[219,405,406,408,410,412,415,417],{"class":221,"line":267},[219,407,270],{"class":247},[219,409,251],{"class":240},[219,411,275],{"class":240},[219,413,414],{"class":278},"demo",[219,416,282],{"class":240},[219,418,285],{"class":240},[219,420,421,423,425,427,430],{"class":221,"line":288},[219,422,291],{"class":247},[219,424,251],{"class":240},[219,426,275],{"class":240},[219,428,429],{"class":278},"sample.li",[219,431,432],{"class":240},"'\n",[219,434,435],{"class":221,"line":307},[219,436,310],{"class":240},[219,438,439],{"class":221,"line":313},[219,440,316],{"class":240},[219,442,443,445],{"class":221,"line":319},[219,444,322],{"class":240},[219,446,325],{"class":236},[186,448,449],{},"These formats all work as well:",[209,451,453],{"className":211,"code":452,"filename":213,"language":214,"meta":215,"style":215},"export default defineNuxtConfig({\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li/images',\n      baseURL: 'https://sample.li/images',\n      baseURL: '_sl_' // alias defined in your Cloudimage storage settings\n    }\n  }\n})\n",[200,454,455,467,475,483,497,512,527,543,547,552],{"__ignoreMap":215},[219,456,457,459,461,463,465],{"class":221,"line":222},[219,458,226],{"class":225},[219,460,229],{"class":225},[219,462,233],{"class":232},[219,464,237],{"class":236},[219,466,241],{"class":240},[219,468,469,471,473],{"class":221,"line":244},[219,470,248],{"class":247},[219,472,251],{"class":240},[219,474,254],{"class":240},[219,476,477,479,481],{"class":221,"line":257},[219,478,260],{"class":247},[219,480,251],{"class":240},[219,482,254],{"class":240},[219,484,485,487,489,491,493,495],{"class":221,"line":267},[219,486,270],{"class":247},[219,488,251],{"class":240},[219,490,275],{"class":240},[219,492,414],{"class":278},[219,494,282],{"class":240},[219,496,285],{"class":240},[219,498,499,501,503,505,508,510],{"class":221,"line":288},[219,500,291],{"class":247},[219,502,251],{"class":240},[219,504,275],{"class":240},[219,506,507],{"class":278},"sample.li/images",[219,509,282],{"class":240},[219,511,285],{"class":240},[219,513,514,516,518,520,523,525],{"class":221,"line":307},[219,515,291],{"class":247},[219,517,251],{"class":240},[219,519,275],{"class":240},[219,521,522],{"class":278},"https://sample.li/images",[219,524,282],{"class":240},[219,526,285],{"class":240},[219,528,529,531,533,535,538,540],{"class":221,"line":313},[219,530,291],{"class":247},[219,532,251],{"class":240},[219,534,275],{"class":240},[219,536,537],{"class":278},"_sl_",[219,539,282],{"class":240},[219,541,542],{"class":303}," // alias defined in your Cloudimage storage settings\n",[219,544,545],{"class":221,"line":319},[219,546,310],{"class":240},[219,548,550],{"class":221,"line":549},9,[219,551,316],{"class":240},[219,553,555,557],{"class":221,"line":554},10,[219,556,322],{"class":240},[219,558,325],{"class":236},[332,560,562],{"id":561},"apiversion",[200,563,564],{},"apiVersion",[337,566,567,571],{},[340,568,342,569],{},[344,570,346],{},[340,572,573,574],{},"Default: ",[200,575,576],{},"empty string",[186,578,579],{},"Allow using a specific version of the API.",[581,582,583],"note",{},[186,584,585,586,589,590,592,593,596],{},"For tokens created before ",[344,587,588],{},"20.10.2021",", ",[200,591,564],{}," needs to be set to ",[200,594,595],{},"v7",".",[186,598,599,600,602,603,605],{},"Here's an official demo config. ",[200,601,414],{}," is an old token hence ",[200,604,564],{}," needs to be defined as well.",[209,607,609],{"className":211,"code":608,"filename":213,"language":214,"meta":215,"style":215},"export default defineNuxtConfig({\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li',\n      apiVersion: 'v7'\n    }\n  }\n})\n",[200,610,611,623,631,639,653,667,680,684,688],{"__ignoreMap":215},[219,612,613,615,617,619,621],{"class":221,"line":222},[219,614,226],{"class":225},[219,616,229],{"class":225},[219,618,233],{"class":232},[219,620,237],{"class":236},[219,622,241],{"class":240},[219,624,625,627,629],{"class":221,"line":244},[219,626,248],{"class":247},[219,628,251],{"class":240},[219,630,254],{"class":240},[219,632,633,635,637],{"class":221,"line":257},[219,634,260],{"class":247},[219,636,251],{"class":240},[219,638,254],{"class":240},[219,640,641,643,645,647,649,651],{"class":221,"line":267},[219,642,270],{"class":247},[219,644,251],{"class":240},[219,646,275],{"class":240},[219,648,414],{"class":278},[219,650,282],{"class":240},[219,652,285],{"class":240},[219,654,655,657,659,661,663,665],{"class":221,"line":288},[219,656,291],{"class":247},[219,658,251],{"class":240},[219,660,275],{"class":240},[219,662,429],{"class":278},[219,664,282],{"class":240},[219,666,285],{"class":240},[219,668,669,672,674,676,678],{"class":221,"line":307},[219,670,671],{"class":247},"      apiVersion",[219,673,251],{"class":240},[219,675,275],{"class":240},[219,677,595],{"class":278},[219,679,432],{"class":240},[219,681,682],{"class":221,"line":313},[219,683,310],{"class":240},[219,685,686],{"class":221,"line":319},[219,687,316],{"class":240},[219,689,690,692],{"class":221,"line":549},[219,691,322],{"class":240},[219,693,325],{"class":236},[332,695,697],{"id":696},"cdnurl",[200,698,699],{},"cdnURL",[337,701,702,706],{},[340,703,342,704],{},[344,705,346],{},[340,707,573,708],{},[200,709,710],{},"https://{token}.cloudimg.io/{apiVersion}",[186,712,713],{},"Replaces the dynamically built URL",[209,715,717],{"className":211,"code":716,"filename":213,"language":214,"meta":215,"style":215},"export default defineNuxtConfig({\n  image: {\n    cloudimage: {\n      cdnURL: 'https://demo.cloudimg.io/v7'\n    }\n  }\n})\n",[200,718,719,731,739,747,761,765,769],{"__ignoreMap":215},[219,720,721,723,725,727,729],{"class":221,"line":222},[219,722,226],{"class":225},[219,724,229],{"class":225},[219,726,233],{"class":232},[219,728,237],{"class":236},[219,730,241],{"class":240},[219,732,733,735,737],{"class":221,"line":244},[219,734,248],{"class":247},[219,736,251],{"class":240},[219,738,254],{"class":240},[219,740,741,743,745],{"class":221,"line":257},[219,742,260],{"class":247},[219,744,251],{"class":240},[219,746,254],{"class":240},[219,748,749,752,754,756,759],{"class":221,"line":267},[219,750,751],{"class":247},"      cdnURL",[219,753,251],{"class":240},[219,755,275],{"class":240},[219,757,758],{"class":278},"https://demo.cloudimg.io/v7",[219,760,432],{"class":240},[219,762,763],{"class":221,"line":288},[219,764,310],{"class":240},[219,766,767],{"class":221,"line":307},[219,768,316],{"class":240},[219,770,771,773],{"class":221,"line":313},[219,772,322],{"class":240},[219,774,325],{"class":236},[327,776,778],{"id":777},"cloudimage-modifiers","Cloudimage Modifiers",[186,780,781,782,786,787,792,793,796],{},"Beside the ",[190,783,785],{"href":784},"/usage/nuxt-img#modifiers","standard modifiers",", also you can pass Cloudimage-specific ",[190,788,791],{"href":789,"rel":790},"https://docs.cloudimage.io/go/cloudimage-documentation-v7/en/introduction",[194],"Cloudimage-specific transformation"," params to ",[200,794,795],{},"modifiers"," prop.",[327,798,800,801,804],{"id":799},"cloudimage-fit-values","Cloudimage ",[200,802,803],{},"fit"," Values",[186,806,781,807,814],{},[190,808,810,811,813],{"href":809},"/usage/nuxt-img#fit","standard values for ",[200,812,803],{}," property"," of Nuxt image and Nuxt picture, Cloudimage offers the following for extra resizing params:",[337,816,817,823,829,834,840,846],{},[340,818,819,822],{},[200,820,821],{},"crop"," - Crops the image to specified dimensions (width and height) and keeps proportions.",[340,824,825,828],{},[200,826,827],{},"face"," - Crops the image automatically keeping the most prominent face.",[340,830,831,833],{},[200,832,803],{}," - Resizes the image to fit into a specified width and height box, adds padding (image or solid color) to keep proportions.",[340,835,836,839],{},[200,837,838],{},"cropfit"," - Sets crop or fit resize mode depending on the origin and the desired dimensions.",[340,841,842,845],{},[200,843,844],{},"bound"," - Resizes to a given width and height box and keeps proportions. Similar to fit but without adding padding.",[340,847,848,851],{},[200,849,850],{},"boundmin"," - Resizes an image while bounding the smaller dimension to the desired width or height while keeping proportions.",[853,854,855],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}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 .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html .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);}",{"title":215,"searchDepth":244,"depth":244,"links":857},[858,864,865],{"id":329,"depth":244,"text":330,"children":859},[860,861,862,863],{"id":202,"depth":257,"text":202},{"id":359,"depth":257,"text":206},{"id":561,"depth":257,"text":564},{"id":696,"depth":257,"text":699},{"id":777,"depth":244,"text":778},{"id":799,"depth":244,"text":866},"Cloudimage fit Values","Nuxt Image has first class integration with Cloudimage.","md",[870],{"label":871,"icon":872,"to":873,"size":874},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/providers/cloudimage.ts","xs",{},true,{"title":68,"description":867},"0Qmb-CGESTiQsTI9b5SRniRviCTnkVFLWltwY3RxAUA",[880,882],{"title":64,"path":65,"stem":66,"description":881,"children":-1},"Nuxt Image has first class integration with Cloudflare.",{"title":72,"path":73,"stem":74,"description":883,"children":-1},"Nuxt Image has first class integration with Cloudinary.",1750079216303]