{"_path":"/providers/cloudimage","_draft":false,"_partial":false,"_empty":false,"title":"Cloudimage","description":"Nuxt Image has first class integration with Cloudimage","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Integration between "},{"type":"element","tag":"a","props":{"href":"https://www.cloudimage.io/en/home","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Cloudimage"}]},{"type":"text","value":" and the image module."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To use this provider you just need to specify the token of your project in cloudimage."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo'\n   }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo'\n   }\n  }\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Note:"}]},{"type":"text","value":" Current integration uses API "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"v7"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can override default options:"}]},{"type":"element","tag":"h3","props":{"id":"token"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"token"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]},{"type":"text","value":" (required)"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"demo"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Your Cloudimage customer token. "},{"type":"element","tag":"a","props":{"href":"https://www.cloudimage.io/en/register_page","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"register"}]},{"type":"text","value":" for a Cloudimage account to get one. The subscription takes less than a minute and is totally free."}]},{"type":"element","tag":"h3","props":{"id":"baseurl"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"baseURL"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Your uploads base URL. This alows to shorten your origin image URLs."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li'  // optional\n   }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li'  // optional\n   }\n  }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"cdnurl"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cdnURL"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://{token}.cloudimg.io/v7"}]}]}]},{"type":"element","tag":"h2","props":{"id":"cloudimage-modifiers"},"children":[{"type":"text","value":"Cloudimage modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Beside the "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#modifiers"},"children":[{"type":"text","value":"standard modifiers"}]},{"type":"text","value":", also you can pass Cloudimage-specific "},{"type":"element","tag":"a","props":{"href":"https://docs.cloudimage.io/go/cloudimage-documentation-v7/en/introduction","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Cloudimage-specific transformation"}]},{"type":"text","value":" params to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modifiers"}]},{"type":"text","value":" prop."}]},{"type":"element","tag":"h2","props":{"id":"cloudimage-fit-values"},"children":[{"type":"text","value":"Cloudimage "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" values"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Beside "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#fit"},"children":[{"type":"text","value":"the standard values for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" property"}]},{"type":"text","value":" of Nuxt image and Nuxt picture, Cloudimage offers the following for extra resizing params:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]},{"type":"text","value":" - Crops the image to specified dimensions (width and height) and keeps proportions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"face"}]},{"type":"text","value":" - Crops the image automatically keeping the most prominent face."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" - Resizes the image to fit into a specified width and height box, adds padding (image or solid colour) to keep proportions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cropfit"}]},{"type":"text","value":" - Sets crop or fit resize mode depending on the origin and the desired dimensions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bound"}]},{"type":"text","value":" - Resizes to a given width and height box and keeps proportions. Similar to fit but without adding padding."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"boundmin"}]},{"type":"text","value":" - Resizes an image while bounding the smaller dimension to the desired width or height while keeping proportions."}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Integration between "},{"type":"element","tag":"a","props":{"href":"https://www.cloudimage.io/en/home","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Cloudimage"}]},{"type":"text","value":" and the image module."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"To use this provider you just need to specify the token of your project in cloudimage."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo'\n   }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0a026d"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0a026d"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"cloudimage"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"token"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7e43ff"},"children":[{"type":"text","value":"'demo'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"   }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"Note:"}]},{"type":"text","value":" Current integration uses API "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"v7"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can override default options:"}]},{"type":"element","tag":"h3","props":{"id":"token"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"token"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]},{"type":"text","value":" (required)"}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"demo"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Your Cloudimage customer token. "},{"type":"element","tag":"a","props":{"href":"https://www.cloudimage.io/en/register_page","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"register"}]},{"type":"text","value":" for a Cloudimage account to get one. The subscription takes less than a minute and is totally free."}]},{"type":"element","tag":"h3","props":{"id":"baseurl"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"baseURL"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Your uploads base URL. This alows to shorten your origin image URLs."}]},{"type":"element","tag":"code","props":{"code":"export default {\n  image: {\n    cloudimage: {\n      token: 'demo',\n      baseURL: 'sample.li'  // optional\n   }\n  }\n}\n","filename":"nuxt.config.js","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-0a026d"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-0a026d"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"image"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"cloudimage"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"token"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7e43ff"},"children":[{"type":"text","value":"'demo'"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-1a372d"},"children":[{"type":"text","value":"baseURL"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-7e43ff"},"children":[{"type":"text","value":"'sample.li'"}]},{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-0a9a76"},"children":[{"type":"text","value":"// optional"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"   }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-9e9484"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"cdnurl"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cdnURL"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Type: "},{"type":"element","tag":"strong","props":{},"children":[{"type":"text","value":"String"}]}]},{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"https://{token}.cloudimg.io/v7"}]}]}]},{"type":"element","tag":"h2","props":{"id":"cloudimage-modifiers"},"children":[{"type":"text","value":"Cloudimage modifiers"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Beside the "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#modifiers"},"children":[{"type":"text","value":"standard modifiers"}]},{"type":"text","value":", also you can pass Cloudimage-specific "},{"type":"element","tag":"a","props":{"href":"https://docs.cloudimage.io/go/cloudimage-documentation-v7/en/introduction","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Cloudimage-specific transformation"}]},{"type":"text","value":" params to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modifiers"}]},{"type":"text","value":" prop."}]},{"type":"element","tag":"h2","props":{"id":"cloudimage-fit-values"},"children":[{"type":"text","value":"Cloudimage "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" values"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Beside "},{"type":"element","tag":"a","props":{"href":"/components/nuxt-img#fit"},"children":[{"type":"text","value":"the standard values for "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" property"}]},{"type":"text","value":" of Nuxt image and Nuxt picture, Cloudimage offers the following for extra resizing params:"}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"crop"}]},{"type":"text","value":" - Crops the image to specified dimensions (width and height) and keeps proportions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"face"}]},{"type":"text","value":" - Crops the image automatically keeping the most prominent face."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"fit"}]},{"type":"text","value":" - Resizes the image to fit into a specified width and height box, adds padding (image or solid colour) to keep proportions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"cropfit"}]},{"type":"text","value":" - Sets crop or fit resize mode depending on the origin and the desired dimensions."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"bound"}]},{"type":"text","value":" - Resizes to a given width and height box and keeps proportions. Similar to fit but without adding padding."}]},{"type":"element","tag":"li","props":{},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"boundmin"}]},{"type":"text","value":" - Resizes an image while bounding the smaller dimension to the desired width or height while keeping proportions."}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-0a9a76{color:#7F848E}.ct-7e43ff{color:#98C379}.ct-1a372d{color:#E06C75}.ct-9e9484{color:#ABB2BF}.ct-0a026d{color:#C678DD}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"options","depth":2,"text":"Options","children":[{"id":"token","depth":3,"text":"token"},{"id":"baseurl","depth":3,"text":"baseURL"},{"id":"cdnurl","depth":3,"text":"cdnURL"}]},{"id":"cloudimage-modifiers","depth":2,"text":"Cloudimage modifiers"},{"id":"cloudimage-fit-values","depth":2,"text":"Cloudimage fit values"}]}},"_type":"markdown","_id":"content:4.providers:cloudimage.md","_source":"content","_file":"4.providers/cloudimage.md","_extension":"md"}