[{"data":1,"prerenderedAt":874},["Reactive",2],{"navigation":3,"docs-/providers/netlify":115,"docs-/providers/netlify-surround":268},[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":77,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":76,"description":119,"body":120,"_type":263,"_id":264,"_source":265,"_file":266,"_extension":267},"providers",false,"","Optimize images with Netlify's dynamic image transformation service.",{"type":121,"children":122,"toc":256},"root",[123,142,165,172,191,200],{"type":124,"tag":125,"props":126,"children":127},"element","p",{},[128,131,140],{"type":129,"value":130},"text","Netlify offers dynamic image transformation for all JPEG, PNG, and GIF files you have set to be tracked with ",{"type":124,"tag":132,"props":133,"children":137},"a",{"href":134,"rel":135},"https://docs.netlify.com/large-media/overview/",[136],"nofollow",[138],{"type":129,"value":139},"Netlify Large Media",{"type":129,"value":141},".",{"type":124,"tag":143,"props":144,"children":145},"callout",{},[146],{"type":124,"tag":125,"props":147,"children":148},{},[149,151,157,159,164],{"type":129,"value":150},"Before setting ",{"type":124,"tag":152,"props":153,"children":154},"code",{},[155],{"type":129,"value":156},"provider: 'netlify'",{"type":129,"value":158},", make sure you have followed the steps to enable ",{"type":124,"tag":132,"props":160,"children":162},{"href":134,"rel":161},[136],[163],{"type":129,"value":139},{"type":129,"value":141},{"type":124,"tag":166,"props":167,"children":169},"h2",{"id":168},"modifiers",[170],{"type":129,"value":171},"Modifiers",{"type":124,"tag":125,"props":173,"children":174},{},[175,177,182,184,189],{"type":129,"value":176},"In addition to ",{"type":124,"tag":152,"props":178,"children":179},{},[180],{"type":129,"value":181},"height",{"type":129,"value":183}," and ",{"type":124,"tag":152,"props":185,"children":186},{},[187],{"type":129,"value":188},"width",{"type":129,"value":190},", the Netlify provider supports the following modifiers:",{"type":124,"tag":192,"props":193,"children":195},"h3",{"id":194},"fit",[196],{"type":124,"tag":152,"props":197,"children":198},{},[199],{"type":129,"value":194},{"type":124,"tag":201,"props":202,"children":203},"ul",{},[204,221],{"type":124,"tag":205,"props":206,"children":207},"li",{},[208,214,216],{"type":124,"tag":209,"props":210,"children":211},"strong",{},[212],{"type":129,"value":213},"Default",{"type":129,"value":215},": ",{"type":124,"tag":152,"props":217,"children":218},{},[219],{"type":129,"value":220},"contain",{"type":124,"tag":205,"props":222,"children":223},{},[224,229,230,234,236,241,243,248,249,254],{"type":124,"tag":209,"props":225,"children":226},{},[227],{"type":129,"value":228},"Valid options",{"type":129,"value":215},{"type":124,"tag":152,"props":231,"children":232},{},[233],{"type":129,"value":220},{"type":129,"value":235}," (equivalent to ",{"type":124,"tag":152,"props":237,"children":238},{},[239],{"type":129,"value":240},"nf_resize=fit",{"type":129,"value":242},") and ",{"type":124,"tag":152,"props":244,"children":245},{},[246],{"type":129,"value":247},"fill",{"type":129,"value":235},{"type":124,"tag":152,"props":250,"children":251},{},[252],{"type":129,"value":253},"nf_resize=smartcrop",{"type":129,"value":255},")",{"title":118,"searchDepth":257,"depth":257,"links":258},2,[259],{"id":168,"depth":257,"text":171,"children":260},[261],{"id":194,"depth":262,"text":194},3,"markdown","content:3.providers:netlify.md","content","3.providers/netlify.md","md",[269,432],{"_path":74,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":73,"description":270,"body":271,"_type":263,"_id":430,"_source":265,"_file":431,"_extension":267},"IPX is the built-in and self hosted image optimizer for Nuxt Image.",{"type":121,"children":272,"toc":427},[273,303,309,323,331,421],{"type":124,"tag":125,"props":274,"children":275},{},[276,278,284,286,293,295,302],{"type":129,"value":277},"Nuxt Image comes with a ",{"type":124,"tag":132,"props":279,"children":281},{"href":280},"/get-started/providers#default-provider",[282],{"type":129,"value":283},"preconfigured instance",{"type":129,"value":285}," of ",{"type":124,"tag":132,"props":287,"children":290},{"href":288,"rel":289},"https://github.com/unjs/ipx",[136],[291],{"type":129,"value":292},"unjs/ipx",{"type":129,"value":294},". An open source, self-hosted image optimizer based on ",{"type":124,"tag":132,"props":296,"children":299},{"href":297,"rel":298},"https://github.com/lovell/sharp",[136],[300],{"type":129,"value":301},"lovell/sharp",{"type":129,"value":141},{"type":124,"tag":166,"props":304,"children":306},{"id":305},"additional-modifiers",[307],{"type":129,"value":308},"Additional Modifiers",{"type":124,"tag":125,"props":310,"children":311},{},[312,314,321],{"type":129,"value":313},"You can use ",{"type":124,"tag":132,"props":315,"children":318},{"href":316,"rel":317},"https://github.com/unjs/ipx/#modifiers",[136],[319],{"type":129,"value":320},"additional modifiers",{"type":129,"value":322}," supported by IPX.",{"type":124,"tag":125,"props":324,"children":325},{},[326],{"type":124,"tag":209,"props":327,"children":328},{},[329],{"type":129,"value":330},"Example:",{"type":124,"tag":332,"props":333,"children":337},"pre",{"className":334,"code":335,"language":336,"meta":118},"language-html material-theme_material-theme-palenight_material-theme-lighter","\u003CNuxtImg src=\"/image.png\" :modifiers=\"{ grayscale: true, tint: '#00DC82' }\" />\n","html",[338],{"type":124,"tag":152,"props":339,"children":340},{"__ignoreMap":118},[341],{"type":124,"tag":342,"props":343,"children":346},"span",{"class":344,"line":345},"line",1,[347,353,359,364,370,375,380,386,390,394,399,403,407,412,416],{"type":124,"tag":342,"props":348,"children":350},{"class":349},"ct-542793",[351],{"type":129,"value":352},"\u003C",{"type":124,"tag":342,"props":354,"children":356},{"class":355},"ct-821147",[357],{"type":129,"value":358},"NuxtImg",{"type":124,"tag":342,"props":360,"children":361},{"class":349},[362],{"type":129,"value":363}," ",{"type":124,"tag":342,"props":365,"children":367},{"class":366},"ct-366012",[368],{"type":129,"value":369},"src",{"type":124,"tag":342,"props":371,"children":372},{"class":349},[373],{"type":129,"value":374},"=",{"type":124,"tag":342,"props":376,"children":377},{"class":349},[378],{"type":129,"value":379},"\"",{"type":124,"tag":342,"props":381,"children":383},{"class":382},"ct-083593",[384],{"type":129,"value":385},"/image.png",{"type":124,"tag":342,"props":387,"children":388},{"class":349},[389],{"type":129,"value":379},{"type":124,"tag":342,"props":391,"children":392},{"class":349},[393],{"type":129,"value":363},{"type":124,"tag":342,"props":395,"children":396},{"class":366},[397],{"type":129,"value":398},":modifiers",{"type":124,"tag":342,"props":400,"children":401},{"class":349},[402],{"type":129,"value":374},{"type":124,"tag":342,"props":404,"children":405},{"class":349},[406],{"type":129,"value":379},{"type":124,"tag":342,"props":408,"children":409},{"class":382},[410],{"type":129,"value":411},"{ grayscale: true, tint: '#00DC82' }",{"type":124,"tag":342,"props":413,"children":414},{"class":349},[415],{"type":129,"value":379},{"type":124,"tag":342,"props":417,"children":418},{"class":349},[419],{"type":129,"value":420}," />",{"type":124,"tag":422,"props":423,"children":424},"style",{},[425],{"type":129,"value":426},".material-theme_material-theme-palenight_material-theme-lighter{color:#EEFFFF;background:#263238;}.dark .material-theme_material-theme-palenight_material-theme-lighter{color:#A6ACCD;background:#292D3E;}.light .material-theme_material-theme-palenight_material-theme-lighter{color:#90A4AE;background:#FAFAFA;}.ct-542793{color:#89DDFF;}.light .ct-542793{color:#39ADB5;}.ct-821147{color:#F07178;}.light .ct-821147{color:#E53935;}.ct-366012{color:#C792EA;}.light .ct-366012{color:#9C3EDA;}.ct-083593{color:#C3E88D;}.light .ct-083593{color:#91B859;}",{"title":118,"searchDepth":257,"depth":257,"links":428},[429],{"id":305,"depth":257,"text":308},"content:3.providers:ipx.md","3.providers/ipx.md",{"_path":80,"_dir":116,"_draft":117,"_partial":117,"_locale":118,"title":79,"description":433,"body":434,"_type":263,"_id":872,"_source":265,"_file":873,"_extension":267},"Nuxt Image integration with Prepr CMS.",{"type":121,"children":435,"toc":866},[436,449,461,653,657,671,676,698,720,726,731,802,809,822,847,861],{"type":124,"tag":125,"props":437,"children":438},{},[439,441,447],{"type":129,"value":440},"Integration between ",{"type":124,"tag":132,"props":442,"children":445},{"href":443,"rel":444},"https://prepr.io/",[136],[446],{"type":129,"value":79},{"type":129,"value":448}," and Nuxt Image.",{"type":124,"tag":125,"props":450,"children":451},{},[452,454,459],{"type":129,"value":453},"To use this provider you just need to specify the ",{"type":124,"tag":152,"props":455,"children":456},{},[457],{"type":129,"value":458},"projectName",{"type":129,"value":460}," of your project in Prepr.",{"type":124,"tag":332,"props":462,"children":467},{"className":463,"code":464,"filename":465,"language":466,"meta":118},"language-ts material-theme_material-theme-palenight_material-theme-lighter","export default defineNuxtConfig({\n  image: {\n    prepr: {\n      // E.g.: https://YourProjectName.prepr.io/\n      projectName: 'YourProjectName',\n    }\n  }\n})\n","nuxt.config.ts","ts",[468],{"type":124,"tag":152,"props":469,"children":470},{"__ignoreMap":118},[471,510,536,561,576,615,628,640],{"type":124,"tag":342,"props":472,"children":473},{"class":344,"line":345},[474,480,485,490,494,500,505],{"type":124,"tag":342,"props":475,"children":477},{"class":476},"ct-398028",[478],{"type":129,"value":479},"export",{"type":124,"tag":342,"props":481,"children":483},{"class":482},"ct-521921",[484],{"type":129,"value":363},{"type":124,"tag":342,"props":486,"children":487},{"class":476},[488],{"type":129,"value":489},"default",{"type":124,"tag":342,"props":491,"children":492},{"class":482},[493],{"type":129,"value":363},{"type":124,"tag":342,"props":495,"children":497},{"class":496},"ct-021512",[498],{"type":129,"value":499},"defineNuxtConfig",{"type":124,"tag":342,"props":501,"children":502},{"class":482},[503],{"type":129,"value":504},"(",{"type":124,"tag":342,"props":506,"children":507},{"class":349},[508],{"type":129,"value":509},"{\n",{"type":124,"tag":342,"props":511,"children":512},{"class":344,"line":257},[513,518,523,528,532],{"type":124,"tag":342,"props":514,"children":515},{"class":482},[516],{"type":129,"value":517},"  ",{"type":124,"tag":342,"props":519,"children":520},{"class":355},[521],{"type":129,"value":522},"image",{"type":124,"tag":342,"props":524,"children":525},{"class":349},[526],{"type":129,"value":527},":",{"type":124,"tag":342,"props":529,"children":530},{"class":482},[531],{"type":129,"value":363},{"type":124,"tag":342,"props":533,"children":534},{"class":349},[535],{"type":129,"value":509},{"type":124,"tag":342,"props":537,"children":538},{"class":344,"line":262},[539,544,549,553,557],{"type":124,"tag":342,"props":540,"children":541},{"class":482},[542],{"type":129,"value":543},"    ",{"type":124,"tag":342,"props":545,"children":546},{"class":355},[547],{"type":129,"value":548},"prepr",{"type":124,"tag":342,"props":550,"children":551},{"class":349},[552],{"type":129,"value":527},{"type":124,"tag":342,"props":554,"children":555},{"class":482},[556],{"type":129,"value":363},{"type":124,"tag":342,"props":558,"children":559},{"class":349},[560],{"type":129,"value":509},{"type":124,"tag":342,"props":562,"children":564},{"class":344,"line":563},4,[565,570],{"type":124,"tag":342,"props":566,"children":567},{"class":349},[568],{"type":129,"value":569},"      ",{"type":124,"tag":342,"props":571,"children":573},{"class":572},"ct-767688",[574],{"type":129,"value":575},"// E.g.: https://YourProjectName.prepr.io/\n",{"type":124,"tag":342,"props":577,"children":579},{"class":344,"line":578},5,[580,584,588,592,596,601,606,610],{"type":124,"tag":342,"props":581,"children":582},{"class":482},[583],{"type":129,"value":569},{"type":124,"tag":342,"props":585,"children":586},{"class":355},[587],{"type":129,"value":458},{"type":124,"tag":342,"props":589,"children":590},{"class":349},[591],{"type":129,"value":527},{"type":124,"tag":342,"props":593,"children":594},{"class":482},[595],{"type":129,"value":363},{"type":124,"tag":342,"props":597,"children":598},{"class":349},[599],{"type":129,"value":600},"'",{"type":124,"tag":342,"props":602,"children":603},{"class":382},[604],{"type":129,"value":605},"YourProjectName",{"type":124,"tag":342,"props":607,"children":608},{"class":349},[609],{"type":129,"value":600},{"type":124,"tag":342,"props":611,"children":612},{"class":349},[613],{"type":129,"value":614},",\n",{"type":124,"tag":342,"props":616,"children":618},{"class":344,"line":617},6,[619,623],{"type":124,"tag":342,"props":620,"children":621},{"class":482},[622],{"type":129,"value":543},{"type":124,"tag":342,"props":624,"children":625},{"class":349},[626],{"type":129,"value":627},"}\n",{"type":124,"tag":342,"props":629,"children":631},{"class":344,"line":630},7,[632,636],{"type":124,"tag":342,"props":633,"children":634},{"class":482},[635],{"type":129,"value":517},{"type":124,"tag":342,"props":637,"children":638},{"class":349},[639],{"type":129,"value":627},{"type":124,"tag":342,"props":641,"children":643},{"class":344,"line":642},8,[644,649],{"type":124,"tag":342,"props":645,"children":646},{"class":349},[647],{"type":129,"value":648},"}",{"type":124,"tag":342,"props":650,"children":651},{"class":482},[652],{"type":129,"value":255},{"type":124,"tag":166,"props":654,"children":655},{"id":168},[656],{"type":129,"value":171},{"type":124,"tag":125,"props":658,"children":659},{},[660,662,669],{"type":129,"value":661},"The Prepr provider supports a number of additional modifiers. For a full list,\ncheck out ",{"type":124,"tag":132,"props":663,"children":666},{"href":664,"rel":665},"https://docs.prepr.io/reference/rest/v1/assets-resizing/",[136],[667],{"type":129,"value":668},"the Prepr documentation",{"type":129,"value":670},".\nAll current transformations currently mentioned in Prepr docs are supported.",{"type":124,"tag":125,"props":672,"children":673},{},[674],{"type":129,"value":675},"For the time being you might find the following links useful:",{"type":124,"tag":201,"props":677,"children":678},{},[679,688],{"type":124,"tag":205,"props":680,"children":681},{},[682],{"type":124,"tag":132,"props":683,"children":685},{"href":664,"rel":684},[136],[686],{"type":129,"value":687},"Assets Resizing via REST API",{"type":124,"tag":205,"props":689,"children":690},{},[691],{"type":124,"tag":132,"props":692,"children":695},{"href":693,"rel":694},"https://docs.prepr.io/managing-content/images",[136],[696],{"type":129,"value":697},"Understanding your marketing and design team workflows",{"type":124,"tag":143,"props":699,"children":700},{},[701],{"type":124,"tag":125,"props":702,"children":703},{},[704,706,711,713,718],{"type":129,"value":705},"prepr.io does not provide a way to restrict what domains can\nrequest assets to your project's CDN, nor limit the maximum size in ",{"type":124,"tag":152,"props":707,"children":708},{},[709],{"type":129,"value":710},"pixels",{"type":129,"value":712}," or\n",{"type":124,"tag":152,"props":714,"children":715},{},[716],{"type":129,"value":717},"bytes",{"type":129,"value":719}," of images that are served from the CDN.",{"type":124,"tag":192,"props":721,"children":723},{"id":722},"convenience-key-modifiers",[724],{"type":129,"value":725},"Convenience key modifiers",{"type":124,"tag":125,"props":727,"children":728},{},[729],{"type":129,"value":730},"The following more readable modifiers are supported, in addition to Prepr's\nnative modifiers:",{"type":124,"tag":201,"props":732,"children":733},{},[734,749,762,775,789],{"type":124,"tag":205,"props":735,"children":736},{},[737,742,744],{"type":124,"tag":152,"props":738,"children":739},{},[740],{"type":129,"value":741},"crop",{"type":129,"value":743}," is equivalent to ",{"type":124,"tag":152,"props":745,"children":746},{},[747],{"type":129,"value":748},"c",{"type":124,"tag":205,"props":750,"children":751},{},[752,757,758],{"type":124,"tag":152,"props":753,"children":754},{},[755],{"type":129,"value":756},"format",{"type":129,"value":743},{"type":124,"tag":152,"props":759,"children":760},{},[761],{"type":129,"value":756},{"type":124,"tag":205,"props":763,"children":764},{},[765,769,770],{"type":124,"tag":152,"props":766,"children":767},{},[768],{"type":129,"value":181},{"type":129,"value":743},{"type":124,"tag":152,"props":771,"children":772},{},[773],{"type":129,"value":774},"h",{"type":124,"tag":205,"props":776,"children":777},{},[778,783,784],{"type":124,"tag":152,"props":779,"children":780},{},[781],{"type":129,"value":782},"quality",{"type":129,"value":743},{"type":124,"tag":152,"props":785,"children":786},{},[787],{"type":129,"value":788},"q",{"type":124,"tag":205,"props":790,"children":791},{},[792,796,797],{"type":124,"tag":152,"props":793,"children":794},{},[795],{"type":129,"value":188},{"type":129,"value":743},{"type":124,"tag":152,"props":798,"children":799},{},[800],{"type":129,"value":801},"w",{"type":124,"tag":192,"props":803,"children":804},{"id":194},[805],{"type":124,"tag":152,"props":806,"children":807},{},[808],{"type":129,"value":194},{"type":124,"tag":125,"props":810,"children":811},{},[812,814,820],{"type":129,"value":813},"In addition to the values specified in the Prepr docs, which are respected, the\nfollowing options from the ",{"type":124,"tag":132,"props":815,"children":817},{"href":816},"/usage/nuxt-img#fit",[818],{"type":129,"value":819},"default fit behavior",{"type":129,"value":821},"\nare supported:",{"type":124,"tag":201,"props":823,"children":824},{},[825],{"type":124,"tag":205,"props":826,"children":827},{},[828,833,835,839,841,846],{"type":124,"tag":152,"props":829,"children":830},{},[831],{"type":129,"value":832},"cover",{"type":129,"value":834}," - this will behave like the Prepr modifier ",{"type":124,"tag":152,"props":836,"children":837},{},[838],{"type":129,"value":741},{"type":129,"value":840},", when passed without\na value (defaults to ",{"type":124,"tag":152,"props":842,"children":843},{},[844],{"type":129,"value":845},"centre",{"type":129,"value":255},{"type":124,"tag":143,"props":848,"children":849},{},[850],{"type":124,"tag":125,"props":851,"children":852},{},[853,855,859],{"type":129,"value":854},"For the time being, other ",{"type":124,"tag":152,"props":856,"children":857},{},[858],{"type":129,"value":194},{"type":129,"value":860}," options are not supported by this provider.",{"type":124,"tag":422,"props":862,"children":863},{},[864],{"type":129,"value":865},".material-theme_material-theme-palenight_material-theme-lighter{color:#EEFFFF;background:#263238;}.dark .material-theme_material-theme-palenight_material-theme-lighter{color:#A6ACCD;background:#292D3E;}.light .material-theme_material-theme-palenight_material-theme-lighter{color:#90A4AE;background:#FAFAFA;}.ct-398028{color:#89DDFF;font-style:italic;}.light .ct-398028{color:#39ADB5;font-style:italic;}.ct-521921{color:#EEFFFF;}.dark .ct-521921{color:#A6ACCD;}.light .ct-521921{color:#90A4AE;}.ct-021512{color:#82AAFF;}.light .ct-021512{color:#6182B8;}.ct-542793{color:#89DDFF;}.light .ct-542793{color:#39ADB5;}.ct-821147{color:#F07178;}.light .ct-821147{color:#E53935;}.ct-767688{color:#546E7A;font-style:italic;}.dark .ct-767688{color:#676E95;font-style:italic;}.light .ct-767688{color:#90A4AE;font-style:italic;}.ct-083593{color:#C3E88D;}.light .ct-083593{color:#91B859;}",{"title":118,"searchDepth":257,"depth":257,"links":867},[868],{"id":168,"depth":257,"text":171,"children":869},[870,871],{"id":722,"depth":262,"text":725},{"id":194,"depth":262,"text":194},"content:3.providers:prepr.md","3.providers/prepr.md",1695857011291]