[{"data":1,"prerenderedAt":3998},["Reactive",2],{"navigation":3,"docs-/get-started/contributing":136,"docs-/get-started/contributing-surround":379},[4,20,33,126],{"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,105,108,111,114,117,120,123],{"title":37,"_path":38},"Aliyun","/providers/aliyun",{"title":40,"_path":41},"AWS Amplify","/providers/aws-amplify",{"title":43,"_path":44},"Bunny","/providers/bunny",{"title":46,"_path":47},"Caisy","/providers/caisy",{"title":49,"_path":50},"Cloudflare","/providers/cloudflare",{"title":52,"_path":53},"Cloudimage","/providers/cloudimage",{"title":55,"_path":56},"Cloudinary","/providers/cloudinary",{"title":58,"_path":59},"Contentful","/providers/contentful",{"title":61,"_path":62},"Directus","/providers/directus",{"title":64,"_path":65},"Edgio","/providers/edgio",{"title":67,"_path":68},"Fastly","/providers/fastly",{"title":70,"_path":71},"Glide","/providers/glide",{"title":73,"_path":74},"Gumlet","/providers/gumlet",{"title":76,"_path":77},"Hygraph","/providers/hygraph",{"title":79,"_path":80},"ImageEngine","/providers/imageengine",{"title":82,"_path":83},"ImageKit","/providers/imagekit",{"title":85,"_path":86},"Imgix","/providers/imgix",{"title":88,"_path":89},"IPX","/providers/ipx",{"title":91,"_path":92},"Netlify","/providers/netlify",{"title":94,"_path":95},"Prepr","/providers/prepr",{"title":97,"_path":98},"Prismic","/providers/prismic",{"title":100,"_path":101},"Sanity","/providers/sanity",{"title":103,"_path":104},"Sirv","/providers/sirv",{"title":106,"_path":107},"Storyblok","/providers/storyblok",{"title":109,"_path":110},"Strapi","/providers/strapi",{"title":112,"_path":113},"Twicpics","/providers/twicpics",{"title":115,"_path":116},"Unsplash","/providers/unsplash",{"title":118,"_path":119},"Uploadcare","/providers/uploadcare",{"title":121,"_path":122},"Vercel","/providers/vercel",{"title":124,"_path":125},"Weserv","/providers/weserv",{"title":127,"_path":128,"children":129},"Advanced","/advanced",[130,133],{"title":131,"_path":132},"Custom Provider","/advanced/custom-provider",{"title":134,"_path":135},"Static Images","/advanced/static-images",{"_path":19,"_dir":137,"_draft":138,"_partial":138,"_locale":139,"title":18,"description":140,"body":141,"_type":374,"_id":375,"_source":376,"_file":377,"_extension":378},"get-started",false,"","We can never thank you enough for your contributions.",{"type":142,"children":143,"toc":366},"root",[144,167,174,229,236,312,318],{"type":145,"tag":146,"props":147,"children":148},"element","callout",{},[149],{"type":145,"tag":150,"props":151,"children":152},"p",{},[153,156,165],{"type":154,"value":155},"text","It is highly recommended to read ",{"type":145,"tag":157,"props":158,"children":162},"a",{"href":159,"rel":160},"https://nuxt.com/docs/community/contribution",[161],"nofollow",[163],{"type":154,"value":164},"Nuxt contribution guide",{"type":154,"value":166}," before making any contributions.",{"type":145,"tag":168,"props":169,"children":171},"h2",{"id":170},"how-to-contribute",[172],{"type":154,"value":173},"How to contribute?",{"type":145,"tag":175,"props":176,"children":177},"ul",{},[178,193,205,216],{"type":145,"tag":179,"props":180,"children":181},"li",{},[182,184,191],{"type":154,"value":183},"Clone ",{"type":145,"tag":157,"props":185,"children":188},{"href":186,"rel":187},"https://github.com/nuxt/image",[161],[189],{"type":154,"value":190},"nuxt/image",{"type":154,"value":192}," repository",{"type":145,"tag":179,"props":194,"children":195},{},[196,198],{"type":154,"value":197},"Enable Corepack using ",{"type":145,"tag":199,"props":200,"children":202},"code",{"className":201},[],[203],{"type":154,"value":204},"corepack enable",{"type":145,"tag":179,"props":206,"children":207},{},[208,210],{"type":154,"value":209},"Install dependencies using ",{"type":145,"tag":199,"props":211,"children":213},{"className":212},[],[214],{"type":154,"value":215},"pnpm install",{"type":145,"tag":179,"props":217,"children":218},{},[219,221,227],{"type":154,"value":220},"Run ",{"type":145,"tag":199,"props":222,"children":224},{"className":223},[],[225],{"type":154,"value":226},"pnpm dev:prepare",{"type":154,"value":228}," to generate type stubs.",{"type":145,"tag":230,"props":231,"children":233},"h3",{"id":232},"nuxt-image",[234],{"type":154,"value":235},"Nuxt Image",{"type":145,"tag":175,"props":237,"children":238},{},[239,261,266,288,299],{"type":145,"tag":179,"props":240,"children":241},{},[242,244,250,252,259],{"type":154,"value":243},"Use ",{"type":145,"tag":199,"props":245,"children":247},{"className":246},[],[248],{"type":154,"value":249},"pnpm dev",{"type":154,"value":251}," to start the ",{"type":145,"tag":157,"props":253,"children":256},{"href":254,"rel":255},"https://github.com/nuxt/image/tree/main/playground",[161],[257],{"type":154,"value":258},"playground",{"type":154,"value":260}," in development mode.",{"type":145,"tag":179,"props":262,"children":263},{},[264],{"type":154,"value":265},"Apply your changes",{"type":145,"tag":179,"props":267,"children":268},{},[269,271,278,280,286],{"type":154,"value":270},"Add tests into the ",{"type":145,"tag":157,"props":272,"children":275},{"href":273,"rel":274},"https://github.com/nuxt/image/tree/main/test",[161],[276],{"type":154,"value":277},"test/",{"type":154,"value":279}," directory and run ",{"type":145,"tag":199,"props":281,"children":283},{"className":282},[],[284],{"type":154,"value":285},"pnpm test",{"type":154,"value":287}," to make sure they pass.",{"type":145,"tag":179,"props":289,"children":290},{},[291,293],{"type":154,"value":292},"Check the code style with ",{"type":145,"tag":199,"props":294,"children":296},{"className":295},[],[297],{"type":154,"value":298},"pnpm lint",{"type":145,"tag":179,"props":300,"children":301},{},[302,304,310],{"type":154,"value":303},"Before creating a PR, make sure to run ",{"type":145,"tag":199,"props":305,"children":307},{"className":306},[],[308],{"type":154,"value":309},"pnpm build",{"type":154,"value":311}," and that no errors are reported.",{"type":145,"tag":230,"props":313,"children":315},{"id":314},"documentation",[316],{"type":154,"value":317},"Documentation",{"type":145,"tag":175,"props":319,"children":320},{},[321,339,352],{"type":145,"tag":179,"props":322,"children":323},{},[324,325,331,332,338],{"type":154,"value":243},{"type":145,"tag":199,"props":326,"children":328},{"className":327},[],[329],{"type":154,"value":330},"pnpm docs:dev",{"type":154,"value":251},{"type":145,"tag":157,"props":333,"children":336},{"href":334,"rel":335},"https://github.com/nuxt/image/tree/main/docs",[161],[337],{"type":154,"value":314},{"type":154,"value":260},{"type":145,"tag":179,"props":340,"children":341},{},[342,344,350],{"type":154,"value":343},"Open ",{"type":145,"tag":157,"props":345,"children":348},{"href":346,"rel":347},"http://localhost:3000",[161],[349],{"type":154,"value":346},{"type":154,"value":351}," to view it in the browser.",{"type":145,"tag":179,"props":353,"children":354},{},[355,357,364],{"type":154,"value":356},"Update the content of the documentation in the ",{"type":145,"tag":157,"props":358,"children":361},{"href":359,"rel":360},"https://github.com/nuxt/image/tree/main/docs/content",[161],[362],{"type":154,"value":363},"docs/content/",{"type":154,"value":365}," directory.",{"title":139,"searchDepth":367,"depth":367,"links":368},2,[369],{"id":170,"depth":367,"text":173,"children":370},[371,373],{"id":232,"depth":372,"text":235},3,{"id":314,"depth":372,"text":317},"markdown","content:1.get-started:4.contributing.md","content","1.get-started/4.contributing.md","md",[380,685],{"_path":16,"_dir":137,"_draft":138,"_partial":138,"_locale":139,"title":15,"description":381,"body":382,"_type":374,"_id":683,"_source":376,"_file":684,"_extension":378},"Nuxt Image supports multiple providers for high performances.",{"type":142,"children":383,"toc":674},[384,390,395,400,412,438,444,456,462,475,502,515,539,545,562,575,618,624,637,642,652,657,668],{"type":145,"tag":168,"props":385,"children":387},{"id":386},"introduction-to-providers",[388],{"type":154,"value":389},"Introduction to providers",{"type":145,"tag":150,"props":391,"children":392},{},[393],{"type":154,"value":394},"Providers are integrations between Nuxt Image and third-party image transformation services. Each provider is responsible for generating correct URLs for that image transformation service.",{"type":145,"tag":150,"props":396,"children":397},{},[398],{"type":154,"value":399},"Nuxt Image can be configured to work with any external image transformation service. Checkout sidebar for list of preconfigured providers.",{"type":145,"tag":150,"props":401,"children":402},{},[403,405,410],{"type":154,"value":404},"If you are looking for a specific provider that is not already supported, you can ",{"type":145,"tag":157,"props":406,"children":407},{"href":132},[408],{"type":154,"value":409},"create your own provider",{"type":154,"value":411},".",{"type":145,"tag":150,"props":413,"children":414},{},[415,417,422,424,429,431,436],{"type":154,"value":416},"Nuxt Image will automatically optimize ",{"type":145,"tag":199,"props":418,"children":420},{"className":419},[],[421],{"type":154,"value":25},{"type":154,"value":423}," or ",{"type":145,"tag":199,"props":425,"children":427},{"className":426},[],[428],{"type":154,"value":28},{"type":154,"value":430}," sources and accepts all ",{"type":145,"tag":157,"props":432,"children":433},{"href":13},[434],{"type":154,"value":435},"options",{"type":154,"value":437}," for specified target, except for modifiers that are specific to other providers.",{"type":145,"tag":168,"props":439,"children":441},{"id":440},"default-provider",[442],{"type":154,"value":443},"Default Provider",{"type":145,"tag":150,"props":445,"children":446},{},[447,449,454],{"type":154,"value":448},"The default optimizer and provider for Nuxt Image is ",{"type":145,"tag":157,"props":450,"children":451},{"href":89},[452],{"type":154,"value":453},"ipx",{"type":154,"value":455},". Either option can be used without any configuration.",{"type":145,"tag":230,"props":457,"children":459},{"id":458},"local-images",[460],{"type":154,"value":461},"Local Images",{"type":145,"tag":150,"props":463,"children":464},{},[465,467,473],{"type":154,"value":466},"Images should be stored in the ",{"type":145,"tag":199,"props":468,"children":470},{"className":469},[],[471],{"type":154,"value":472},"public/",{"type":154,"value":474}," directory of your project.",{"type":145,"tag":150,"props":476,"children":477},{},[478,480,486,488,493,495,501],{"type":154,"value":479},"For example, when using ",{"type":145,"tag":199,"props":481,"children":483},{"className":482},[],[484],{"type":154,"value":485},"\u003CNuxtImg src=\"/nuxt-icon.png\" />",{"type":154,"value":487},", it should be placed in ",{"type":145,"tag":199,"props":489,"children":491},{"className":490},[],[492],{"type":154,"value":472},{"type":154,"value":494}," folder under the path ",{"type":145,"tag":199,"props":496,"children":498},{"className":497},[],[499],{"type":154,"value":500},"public/nuxt-icon.png",{"type":154,"value":411},{"type":145,"tag":150,"props":503,"children":504},{},[505,507,514],{"type":154,"value":506},"For more information, you can learn more about the ",{"type":145,"tag":157,"props":508,"children":511},{"href":509,"rel":510},"https://nuxt.com/docs/guide/directory-structure/public",[161],[512],{"type":154,"value":513},"public directory",{"type":154,"value":411},{"type":145,"tag":146,"props":516,"children":517},{},[518],{"type":145,"tag":150,"props":519,"children":520},{},[521,523,529,531,537],{"type":154,"value":522},"Image stored in the ",{"type":145,"tag":199,"props":524,"children":526},{"className":525},[],[527],{"type":154,"value":528},"assets/",{"type":154,"value":530}," directory are ",{"type":145,"tag":532,"props":533,"children":534},"strong",{},[535],{"type":154,"value":536},"not",{"type":154,"value":538}," processed with Nuxt Image because those images are managed by your bundler (such as Vite or webpack).",{"type":145,"tag":230,"props":540,"children":542},{"id":541},"remote-images",[543],{"type":154,"value":544},"Remote Images",{"type":145,"tag":150,"props":546,"children":547},{},[548,550,560],{"type":154,"value":549},"Using default provider, you can also optimize external URLs. For this, you need to add them to ",{"type":145,"tag":157,"props":551,"children":553},{"href":552},"/get-started/configuration#domains",[554],{"type":145,"tag":199,"props":555,"children":557},{"className":556},[],[558],{"type":154,"value":559},"domains",{"type":154,"value":561}," option.",{"type":145,"tag":150,"props":563,"children":564},{},[565,567,573],{"type":154,"value":566},"You can also add domains for remote images by setting the ",{"type":145,"tag":199,"props":568,"children":570},{"className":569},[],[571],{"type":154,"value":572},"NUXT_IMAGE_DOMAINS",{"type":154,"value":574}," environment variable to a comma-separated list of domains.",{"type":145,"tag":576,"props":577,"children":581},"pre",{"className":578,"code":579,"language":580,"meta":139,"style":139},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","NUXT_IMAGE_DOMAINS=\"example.com,yourdomain.com\"\n","bash",[582],{"type":145,"tag":199,"props":583,"children":584},{"__ignoreMap":139},[585],{"type":145,"tag":586,"props":587,"children":590},"span",{"class":588,"line":589},"line",1,[591,596,602,607,613],{"type":145,"tag":586,"props":592,"children":594},{"style":593},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[595],{"type":154,"value":572},{"type":145,"tag":586,"props":597,"children":599},{"style":598},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[600],{"type":154,"value":601},"=",{"type":145,"tag":586,"props":603,"children":604},{"style":598},[605],{"type":154,"value":606},"\"",{"type":145,"tag":586,"props":608,"children":610},{"style":609},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[611],{"type":154,"value":612},"example.com,yourdomain.com",{"type":145,"tag":586,"props":614,"children":615},{"style":598},[616],{"type":154,"value":617},"\"\n",{"type":145,"tag":230,"props":619,"children":621},{"id":620},"environment-detection",[622],{"type":154,"value":623},"Environment Detection",{"type":145,"tag":150,"props":625,"children":626},{},[627,629,635],{"type":154,"value":628},"You can set default provider using ",{"type":145,"tag":199,"props":630,"children":632},{"className":631},[],[633],{"type":154,"value":634},"NUXT_IMAGE_PROVIDER",{"type":154,"value":636}," environment variable.",{"type":145,"tag":150,"props":638,"children":639},{},[640],{"type":154,"value":641},"Providers detected automatically:",{"type":145,"tag":175,"props":643,"children":644},{},[645],{"type":145,"tag":179,"props":646,"children":647},{},[648],{"type":145,"tag":157,"props":649,"children":650},{"href":122},[651],{"type":154,"value":121},{"type":145,"tag":230,"props":653,"children":655},{"id":654},"custom-provider",[656],{"type":154,"value":131},{"type":145,"tag":150,"props":658,"children":659},{},[660,662,667],{"type":154,"value":661},"It is possible to define your own provider, learn more ",{"type":145,"tag":157,"props":663,"children":664},{"href":132},[665],{"type":154,"value":666},"how to create a custom provider",{"type":154,"value":411},{"type":145,"tag":669,"props":670,"children":671},"style",{},[672],{"type":154,"value":673},"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":139,"searchDepth":367,"depth":367,"links":675},[676,677],{"id":386,"depth":367,"text":389},{"id":440,"depth":367,"text":443,"children":678},[679,680,681,682],{"id":458,"depth":372,"text":461},{"id":541,"depth":372,"text":544},{"id":620,"depth":372,"text":623},{"id":654,"depth":372,"text":131},"content:1.get-started:3.providers.md","1.get-started/3.providers.md",{"_path":26,"_dir":686,"_draft":138,"_partial":138,"_locale":139,"title":25,"description":687,"links":688,"body":694,"_type":374,"_id":3996,"_source":376,"_file":3997,"_extension":378},"usage","Discover how to use and configure the Nuxt Image component.",[689],{"label":690,"icon":691,"to":692,"size":693},"Source","i-simple-icons-github","https://github.com/nuxt/image/blob/main/src/runtime/components/nuxt-img.ts","xs",{"type":142,"children":695,"toc":3975},[696,714,779,783,808,859,864,906,935,941,949,954,979,1022,1043,1059,1064,1088,1096,1101,1114,1127,1178,1186,1264,1273,1278,1285,1438,1447,1452,1457,1803,1818,2101,2110,2129,2136,2429,2438,2443,2464,2793,2802,2807,2876,2928,2937,2942,3051,3060,3072,3129,3232,3240,3249,3254,3266,3273,3417,3426,3439,3486,3495,3518,3531,3595,3604,3631,3797,3803,3828,3850,3971],{"type":145,"tag":150,"props":697,"children":698},{},[699,704,706,712],{"type":145,"tag":199,"props":700,"children":702},{"className":701},[],[703],{"type":154,"value":25},{"type":154,"value":705}," is a drop-in replacement for the native ",{"type":145,"tag":199,"props":707,"children":709},{"className":708},[],[710],{"type":154,"value":711},"\u003Cimg>",{"type":154,"value":713}," tag.",{"type":145,"tag":175,"props":715,"children":716},{},[717,722,735,754,767],{"type":145,"tag":179,"props":718,"children":719},{},[720],{"type":154,"value":721},"Uses built-in provider to optimize local and remote images",{"type":145,"tag":179,"props":723,"children":724},{},[725,727,733],{"type":154,"value":726},"Converts ",{"type":145,"tag":199,"props":728,"children":730},{"className":729},[],[731],{"type":154,"value":732},"src",{"type":154,"value":734}," to provider optimized URLs",{"type":145,"tag":179,"props":736,"children":737},{},[738,740,746,748],{"type":154,"value":739},"Automatically resizes images based on ",{"type":145,"tag":199,"props":741,"children":743},{"className":742},[],[744],{"type":154,"value":745},"width",{"type":154,"value":747}," and ",{"type":145,"tag":199,"props":749,"children":751},{"className":750},[],[752],{"type":154,"value":753},"height",{"type":145,"tag":179,"props":755,"children":756},{},[757,759,765],{"type":154,"value":758},"Generates responsive sizes when providing ",{"type":145,"tag":199,"props":760,"children":762},{"className":761},[],[763],{"type":154,"value":764},"sizes",{"type":154,"value":766}," option",{"type":145,"tag":179,"props":768,"children":769},{},[770,772,777],{"type":154,"value":771},"Supports native lazy loading as well as other ",{"type":145,"tag":199,"props":773,"children":775},{"className":774},[],[776],{"type":154,"value":711},{"type":154,"value":778}," attributes",{"type":145,"tag":168,"props":780,"children":781},{"id":686},[782],{"type":154,"value":21},{"type":145,"tag":150,"props":784,"children":785},{},[786,791,793,799,801,806],{"type":145,"tag":199,"props":787,"children":789},{"className":788},[],[790],{"type":154,"value":25},{"type":154,"value":792}," outputs a native ",{"type":145,"tag":199,"props":794,"children":796},{"className":795},[],[797],{"type":154,"value":798},"img",{"type":154,"value":800}," tag directly (without any wrapper around it). Use it like you would use the ",{"type":145,"tag":199,"props":802,"children":804},{"className":803},[],[805],{"type":154,"value":711},{"type":154,"value":807}," tag:",{"type":145,"tag":576,"props":809,"children":813},{"className":810,"code":811,"language":812,"meta":139,"style":139},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNuxtImg src=\"/nuxt-icon.png\" />\n","html",[814],{"type":145,"tag":199,"props":815,"children":816},{"__ignoreMap":139},[817],{"type":145,"tag":586,"props":818,"children":819},{"class":588,"line":589},[820,825,831,837,841,845,850,854],{"type":145,"tag":586,"props":821,"children":822},{"style":598},[823],{"type":154,"value":824},"\u003C",{"type":145,"tag":586,"props":826,"children":828},{"style":827},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[829],{"type":154,"value":830},"NuxtImg",{"type":145,"tag":586,"props":832,"children":834},{"style":833},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[835],{"type":154,"value":836}," src",{"type":145,"tag":586,"props":838,"children":839},{"style":598},[840],{"type":154,"value":601},{"type":145,"tag":586,"props":842,"children":843},{"style":598},[844],{"type":154,"value":606},{"type":145,"tag":586,"props":846,"children":847},{"style":609},[848],{"type":154,"value":849},"/nuxt-icon.png",{"type":145,"tag":586,"props":851,"children":852},{"style":598},[853],{"type":154,"value":606},{"type":145,"tag":586,"props":855,"children":856},{"style":598},[857],{"type":154,"value":858}," />\n",{"type":145,"tag":150,"props":860,"children":861},{},[862],{"type":154,"value":863},"Will result in:",{"type":145,"tag":576,"props":865,"children":867},{"className":810,"code":866,"language":812,"meta":139,"style":139},"\u003Cimg src=\"/nuxt-icon.png\" />\n",[868],{"type":145,"tag":199,"props":869,"children":870},{"__ignoreMap":139},[871],{"type":145,"tag":586,"props":872,"children":873},{"class":588,"line":589},[874,878,882,886,890,894,898,902],{"type":145,"tag":586,"props":875,"children":876},{"style":598},[877],{"type":154,"value":824},{"type":145,"tag":586,"props":879,"children":880},{"style":827},[881],{"type":154,"value":798},{"type":145,"tag":586,"props":883,"children":884},{"style":833},[885],{"type":154,"value":836},{"type":145,"tag":586,"props":887,"children":888},{"style":598},[889],{"type":154,"value":601},{"type":145,"tag":586,"props":891,"children":892},{"style":598},[893],{"type":154,"value":606},{"type":145,"tag":586,"props":895,"children":896},{"style":609},[897],{"type":154,"value":849},{"type":145,"tag":586,"props":899,"children":900},{"style":598},[901],{"type":154,"value":606},{"type":145,"tag":586,"props":903,"children":904},{"style":598},[905],{"type":154,"value":858},{"type":145,"tag":146,"props":907,"children":908},{},[909],{"type":145,"tag":150,"props":910,"children":911},{},[912,914,919,921,926,928,933],{"type":154,"value":913},"With ",{"type":145,"tag":157,"props":915,"children":916},{"href":16},[917],{"type":154,"value":918},"default provider",{"type":154,"value":920},", you should put ",{"type":145,"tag":199,"props":922,"children":924},{"className":923},[],[925],{"type":154,"value":849},{"type":154,"value":927}," inside ",{"type":145,"tag":199,"props":929,"children":931},{"className":930},[],[932],{"type":154,"value":472},{"type":154,"value":934}," directory for Nuxt 3 make the above example work.",{"type":145,"tag":168,"props":936,"children":938},{"id":937},"props",[939],{"type":154,"value":940},"Props",{"type":145,"tag":230,"props":942,"children":943},{"id":732},[944],{"type":145,"tag":199,"props":945,"children":947},{"className":946},[],[948],{"type":154,"value":732},{"type":145,"tag":150,"props":950,"children":951},{},[952],{"type":154,"value":953},"Path to image file",{"type":145,"tag":150,"props":955,"children":956},{},[957,962,964,969,971,977],{"type":145,"tag":199,"props":958,"children":960},{"className":959},[],[961],{"type":154,"value":732},{"type":154,"value":963}," should be in the form of an absolute path for static images in ",{"type":145,"tag":199,"props":965,"children":967},{"className":966},[],[968],{"type":154,"value":472},{"type":154,"value":970}," directory.\nOtherwise path that is expected by provider that starts with ",{"type":145,"tag":199,"props":972,"children":974},{"className":973},[],[975],{"type":154,"value":976},"/",{"type":154,"value":978}," or a URL.",{"type":145,"tag":576,"props":980,"children":982},{"className":810,"code":981,"language":812,"meta":139,"style":139},"\u003CNuxtImg src=\"/nuxt.png\" />\n",[983],{"type":145,"tag":199,"props":984,"children":985},{"__ignoreMap":139},[986],{"type":145,"tag":586,"props":987,"children":988},{"class":588,"line":589},[989,993,997,1001,1005,1009,1014,1018],{"type":145,"tag":586,"props":990,"children":991},{"style":598},[992],{"type":154,"value":824},{"type":145,"tag":586,"props":994,"children":995},{"style":827},[996],{"type":154,"value":830},{"type":145,"tag":586,"props":998,"children":999},{"style":833},[1000],{"type":154,"value":836},{"type":145,"tag":586,"props":1002,"children":1003},{"style":598},[1004],{"type":154,"value":601},{"type":145,"tag":586,"props":1006,"children":1007},{"style":598},[1008],{"type":154,"value":606},{"type":145,"tag":586,"props":1010,"children":1011},{"style":609},[1012],{"type":154,"value":1013},"/nuxt.png",{"type":145,"tag":586,"props":1015,"children":1016},{"style":598},[1017],{"type":154,"value":606},{"type":145,"tag":586,"props":1019,"children":1020},{"style":598},[1021],{"type":154,"value":858},{"type":145,"tag":150,"props":1023,"children":1024},{},[1025,1027,1032,1034,1042],{"type":154,"value":1026},"For image optimization when using external urls in ",{"type":145,"tag":199,"props":1028,"children":1030},{"className":1029},[],[1031],{"type":154,"value":732},{"type":154,"value":1033},", we need to whitelist them using ",{"type":145,"tag":157,"props":1035,"children":1036},{"href":552},[1037],{"type":145,"tag":199,"props":1038,"children":1040},{"className":1039},[],[1041],{"type":154,"value":559},{"type":154,"value":561},{"type":145,"tag":230,"props":1044,"children":1046},{"id":1045},"width-height",[1047,1052,1054],{"type":145,"tag":199,"props":1048,"children":1050},{"className":1049},[],[1051],{"type":154,"value":745},{"type":154,"value":1053}," / ",{"type":145,"tag":199,"props":1055,"children":1057},{"className":1056},[],[1058],{"type":154,"value":753},{"type":145,"tag":150,"props":1060,"children":1061},{},[1062],{"type":154,"value":1063},"Specify width/height of the image.",{"type":145,"tag":175,"props":1065,"children":1066},{},[1067,1072],{"type":145,"tag":179,"props":1068,"children":1069},{},[1070],{"type":154,"value":1071},"Use desired width/height for static sized images like icons or avatars",{"type":145,"tag":179,"props":1073,"children":1074},{},[1075,1077,1086],{"type":154,"value":1076},"Use original image width/height for responsive images (when using ",{"type":145,"tag":157,"props":1078,"children":1080},{"href":1079},"#sizes",[1081],{"type":145,"tag":199,"props":1082,"children":1084},{"className":1083},[],[1085],{"type":154,"value":764},{"type":154,"value":1087},")",{"type":145,"tag":230,"props":1089,"children":1090},{"id":764},[1091],{"type":145,"tag":199,"props":1092,"children":1094},{"className":1093},[],[1095],{"type":154,"value":764},{"type":145,"tag":150,"props":1097,"children":1098},{},[1099],{"type":154,"value":1100},"Specify responsive sizes.",{"type":145,"tag":150,"props":1102,"children":1103},{},[1104,1106,1112],{"type":154,"value":1105},"This is a space-separated list of screen size/width pairs. You can ",{"type":145,"tag":157,"props":1107,"children":1109},{"href":1108},"/get-started/configuration#screens",[1110],{"type":154,"value":1111},"see a list of the defined screen sizes here",{"type":154,"value":1113},").",{"type":145,"tag":150,"props":1115,"children":1116},{},[1117,1119,1125],{"type":154,"value":1118},"By default Nuxt generates ",{"type":145,"tag":1120,"props":1121,"children":1122},"em",{},[1123],{"type":154,"value":1124},"responsive-first",{"type":154,"value":1126}," sizing.",{"type":145,"tag":175,"props":1128,"children":1129},{},[1130,1143],{"type":145,"tag":179,"props":1131,"children":1132},{},[1133,1135,1141],{"type":154,"value":1134},"If you omit a screen size prefix (like ",{"type":145,"tag":199,"props":1136,"children":1138},{"className":1137},[],[1139],{"type":154,"value":1140},"sm:",{"type":154,"value":1142},") then this size is the 'default' size of the image. Otherwise, Nuxt will pick the smallest size as the default size of the image.",{"type":145,"tag":179,"props":1144,"children":1145},{},[1146,1148,1153,1155,1161,1163,1169,1171,1176],{"type":154,"value":1147},"This default size is used up until the next specified screen width, and so on. Each specified size pair applies ",{"type":145,"tag":1120,"props":1149,"children":1150},{},[1151],{"type":154,"value":1152},"up",{"type":154,"value":1154}," - so ",{"type":145,"tag":199,"props":1156,"children":1158},{"className":1157},[],[1159],{"type":154,"value":1160},"md:400px",{"type":154,"value":1162}," means that the image will be sized ",{"type":145,"tag":199,"props":1164,"children":1166},{"className":1165},[],[1167],{"type":154,"value":1168},"400px",{"type":154,"value":1170}," on ",{"type":145,"tag":199,"props":1172,"children":1174},{"className":1173},[],[1175],{"type":154,"value":378},{"type":154,"value":1177}," screens and up.",{"type":145,"tag":150,"props":1179,"children":1180},{},[1181],{"type":145,"tag":532,"props":1182,"children":1183},{},[1184],{"type":154,"value":1185},"Example:",{"type":145,"tag":576,"props":1187,"children":1189},{"className":810,"code":1188,"language":812,"meta":139,"style":139},"\u003CNuxtImg\n  src=\"/logos/nuxt.png\"\n  sizes=\"100vw sm:50vw md:400px\"\n/>\n",[1190],{"type":145,"tag":199,"props":1191,"children":1192},{"__ignoreMap":139},[1193,1205,1230,1255],{"type":145,"tag":586,"props":1194,"children":1195},{"class":588,"line":589},[1196,1200],{"type":145,"tag":586,"props":1197,"children":1198},{"style":598},[1199],{"type":154,"value":824},{"type":145,"tag":586,"props":1201,"children":1202},{"style":827},[1203],{"type":154,"value":1204},"NuxtImg\n",{"type":145,"tag":586,"props":1206,"children":1207},{"class":588,"line":367},[1208,1213,1217,1221,1226],{"type":145,"tag":586,"props":1209,"children":1210},{"style":833},[1211],{"type":154,"value":1212},"  src",{"type":145,"tag":586,"props":1214,"children":1215},{"style":598},[1216],{"type":154,"value":601},{"type":145,"tag":586,"props":1218,"children":1219},{"style":598},[1220],{"type":154,"value":606},{"type":145,"tag":586,"props":1222,"children":1223},{"style":609},[1224],{"type":154,"value":1225},"/logos/nuxt.png",{"type":145,"tag":586,"props":1227,"children":1228},{"style":598},[1229],{"type":154,"value":617},{"type":145,"tag":586,"props":1231,"children":1232},{"class":588,"line":372},[1233,1238,1242,1246,1251],{"type":145,"tag":586,"props":1234,"children":1235},{"style":833},[1236],{"type":154,"value":1237},"  sizes",{"type":145,"tag":586,"props":1239,"children":1240},{"style":598},[1241],{"type":154,"value":601},{"type":145,"tag":586,"props":1243,"children":1244},{"style":598},[1245],{"type":154,"value":606},{"type":145,"tag":586,"props":1247,"children":1248},{"style":609},[1249],{"type":154,"value":1250},"100vw sm:50vw md:400px",{"type":145,"tag":586,"props":1252,"children":1253},{"style":598},[1254],{"type":154,"value":617},{"type":145,"tag":586,"props":1256,"children":1258},{"class":588,"line":1257},4,[1259],{"type":145,"tag":586,"props":1260,"children":1261},{"style":598},[1262],{"type":154,"value":1263},"/>\n",{"type":145,"tag":230,"props":1265,"children":1267},{"id":1266},"densities",[1268],{"type":145,"tag":199,"props":1269,"children":1271},{"className":1270},[],[1272],{"type":154,"value":1266},{"type":145,"tag":150,"props":1274,"children":1275},{},[1276],{"type":154,"value":1277},"To generate special versions of images for screens with increased pixel density.",{"type":145,"tag":150,"props":1279,"children":1280},{},[1281],{"type":145,"tag":532,"props":1282,"children":1283},{},[1284],{"type":154,"value":1185},{"type":145,"tag":576,"props":1286,"children":1288},{"className":810,"code":1287,"language":812,"meta":139,"style":139},"\u003CNuxtImg\n  src=\"/logos/nuxt.png\"\n  height=\"50\"\n  densities=\"x1 x2\"\n/>\n\u003C!--\n\u003Cimg\n  src=\"/_ipx/w_50/logos/nuxt.png\" \n  srcset=\"/_ipx/w_100/logos/nuxt.png x2\"\n/>\n-->\n",[1289],{"type":145,"tag":199,"props":1290,"children":1291},{"__ignoreMap":139},[1292,1303,1326,1351,1376,1384,1394,1403,1412,1421,1429],{"type":145,"tag":586,"props":1293,"children":1294},{"class":588,"line":589},[1295,1299],{"type":145,"tag":586,"props":1296,"children":1297},{"style":598},[1298],{"type":154,"value":824},{"type":145,"tag":586,"props":1300,"children":1301},{"style":827},[1302],{"type":154,"value":1204},{"type":145,"tag":586,"props":1304,"children":1305},{"class":588,"line":367},[1306,1310,1314,1318,1322],{"type":145,"tag":586,"props":1307,"children":1308},{"style":833},[1309],{"type":154,"value":1212},{"type":145,"tag":586,"props":1311,"children":1312},{"style":598},[1313],{"type":154,"value":601},{"type":145,"tag":586,"props":1315,"children":1316},{"style":598},[1317],{"type":154,"value":606},{"type":145,"tag":586,"props":1319,"children":1320},{"style":609},[1321],{"type":154,"value":1225},{"type":145,"tag":586,"props":1323,"children":1324},{"style":598},[1325],{"type":154,"value":617},{"type":145,"tag":586,"props":1327,"children":1328},{"class":588,"line":372},[1329,1334,1338,1342,1347],{"type":145,"tag":586,"props":1330,"children":1331},{"style":833},[1332],{"type":154,"value":1333},"  height",{"type":145,"tag":586,"props":1335,"children":1336},{"style":598},[1337],{"type":154,"value":601},{"type":145,"tag":586,"props":1339,"children":1340},{"style":598},[1341],{"type":154,"value":606},{"type":145,"tag":586,"props":1343,"children":1344},{"style":609},[1345],{"type":154,"value":1346},"50",{"type":145,"tag":586,"props":1348,"children":1349},{"style":598},[1350],{"type":154,"value":617},{"type":145,"tag":586,"props":1352,"children":1353},{"class":588,"line":1257},[1354,1359,1363,1367,1372],{"type":145,"tag":586,"props":1355,"children":1356},{"style":833},[1357],{"type":154,"value":1358},"  densities",{"type":145,"tag":586,"props":1360,"children":1361},{"style":598},[1362],{"type":154,"value":601},{"type":145,"tag":586,"props":1364,"children":1365},{"style":598},[1366],{"type":154,"value":606},{"type":145,"tag":586,"props":1368,"children":1369},{"style":609},[1370],{"type":154,"value":1371},"x1 x2",{"type":145,"tag":586,"props":1373,"children":1374},{"style":598},[1375],{"type":154,"value":617},{"type":145,"tag":586,"props":1377,"children":1379},{"class":588,"line":1378},5,[1380],{"type":145,"tag":586,"props":1381,"children":1382},{"style":598},[1383],{"type":154,"value":1263},{"type":145,"tag":586,"props":1385,"children":1387},{"class":588,"line":1386},6,[1388],{"type":145,"tag":586,"props":1389,"children":1391},{"style":1390},"--shiki-light:#90A4AE;--shiki-default:#546E7A;--shiki-dark:#676E95;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[1392],{"type":154,"value":1393},"\u003C!--\n",{"type":145,"tag":586,"props":1395,"children":1397},{"class":588,"line":1396},7,[1398],{"type":145,"tag":586,"props":1399,"children":1400},{"style":1390},[1401],{"type":154,"value":1402},"\u003Cimg\n",{"type":145,"tag":586,"props":1404,"children":1406},{"class":588,"line":1405},8,[1407],{"type":145,"tag":586,"props":1408,"children":1409},{"style":1390},[1410],{"type":154,"value":1411},"  src=\"/_ipx/w_50/logos/nuxt.png\" \n",{"type":145,"tag":586,"props":1413,"children":1415},{"class":588,"line":1414},9,[1416],{"type":145,"tag":586,"props":1417,"children":1418},{"style":1390},[1419],{"type":154,"value":1420},"  srcset=\"/_ipx/w_100/logos/nuxt.png x2\"\n",{"type":145,"tag":586,"props":1422,"children":1424},{"class":588,"line":1423},10,[1425],{"type":145,"tag":586,"props":1426,"children":1427},{"style":1390},[1428],{"type":154,"value":1263},{"type":145,"tag":586,"props":1430,"children":1432},{"class":588,"line":1431},11,[1433],{"type":145,"tag":586,"props":1434,"children":1435},{"style":1390},[1436],{"type":154,"value":1437},"-->\n",{"type":145,"tag":230,"props":1439,"children":1441},{"id":1440},"placeholder",[1442],{"type":145,"tag":199,"props":1443,"children":1445},{"className":1444},[],[1446],{"type":154,"value":1440},{"type":145,"tag":150,"props":1448,"children":1449},{},[1450],{"type":154,"value":1451},"Display a placeholder image before the actual image is fully loaded.",{"type":145,"tag":150,"props":1453,"children":1454},{},[1455],{"type":154,"value":1456},"The placeholder prop can be either a string, a boolean, a number, or an array. The usage is shown below for each case.",{"type":145,"tag":576,"props":1458,"children":1460},{"className":810,"code":1459,"language":812,"meta":139,"style":139},"\u003C!-- Automatically generate a placeholder based on the original image -->\n\u003Cnuxt-img src=\"/nuxt.png\" placeholder />\n\n\u003C!-- Set a width, height for the automatically generated placeholder  -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"[50, 25]\" />\n\n\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"[50, 25, 75, 5]\" />\n\n\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n\u003Cnuxt-img src=\"/nuxt.png\" :placeholder=\"15\" />\n\n\u003C!-- Provide your own image -->\n\u003Cnuxt-img src=\"/nuxt.png\" placeholder=\"./placeholder.png\" />\n",[1461],{"type":145,"tag":199,"props":1462,"children":1463},{"__ignoreMap":139},[1464,1472,1513,1522,1530,1587,1594,1602,1658,1665,1673,1729,1737,1746],{"type":145,"tag":586,"props":1465,"children":1466},{"class":588,"line":589},[1467],{"type":145,"tag":586,"props":1468,"children":1469},{"style":1390},[1470],{"type":154,"value":1471},"\u003C!-- Automatically generate a placeholder based on the original image -->\n",{"type":145,"tag":586,"props":1473,"children":1474},{"class":588,"line":367},[1475,1479,1484,1488,1492,1496,1500,1504,1509],{"type":145,"tag":586,"props":1476,"children":1477},{"style":598},[1478],{"type":154,"value":824},{"type":145,"tag":586,"props":1480,"children":1481},{"style":827},[1482],{"type":154,"value":1483},"nuxt-img",{"type":145,"tag":586,"props":1485,"children":1486},{"style":833},[1487],{"type":154,"value":836},{"type":145,"tag":586,"props":1489,"children":1490},{"style":598},[1491],{"type":154,"value":601},{"type":145,"tag":586,"props":1493,"children":1494},{"style":598},[1495],{"type":154,"value":606},{"type":145,"tag":586,"props":1497,"children":1498},{"style":609},[1499],{"type":154,"value":1013},{"type":145,"tag":586,"props":1501,"children":1502},{"style":598},[1503],{"type":154,"value":606},{"type":145,"tag":586,"props":1505,"children":1506},{"style":833},[1507],{"type":154,"value":1508}," placeholder",{"type":145,"tag":586,"props":1510,"children":1511},{"style":598},[1512],{"type":154,"value":858},{"type":145,"tag":586,"props":1514,"children":1515},{"class":588,"line":372},[1516],{"type":145,"tag":586,"props":1517,"children":1519},{"emptyLinePlaceholder":1518},true,[1520],{"type":154,"value":1521},"\n",{"type":145,"tag":586,"props":1523,"children":1524},{"class":588,"line":1257},[1525],{"type":145,"tag":586,"props":1526,"children":1527},{"style":1390},[1528],{"type":154,"value":1529},"\u003C!-- Set a width, height for the automatically generated placeholder  -->\n",{"type":145,"tag":586,"props":1531,"children":1532},{"class":588,"line":1378},[1533,1537,1541,1545,1549,1553,1557,1561,1566,1570,1574,1579,1583],{"type":145,"tag":586,"props":1534,"children":1535},{"style":598},[1536],{"type":154,"value":824},{"type":145,"tag":586,"props":1538,"children":1539},{"style":827},[1540],{"type":154,"value":1483},{"type":145,"tag":586,"props":1542,"children":1543},{"style":833},[1544],{"type":154,"value":836},{"type":145,"tag":586,"props":1546,"children":1547},{"style":598},[1548],{"type":154,"value":601},{"type":145,"tag":586,"props":1550,"children":1551},{"style":598},[1552],{"type":154,"value":606},{"type":145,"tag":586,"props":1554,"children":1555},{"style":609},[1556],{"type":154,"value":1013},{"type":145,"tag":586,"props":1558,"children":1559},{"style":598},[1560],{"type":154,"value":606},{"type":145,"tag":586,"props":1562,"children":1563},{"style":833},[1564],{"type":154,"value":1565}," :placeholder",{"type":145,"tag":586,"props":1567,"children":1568},{"style":598},[1569],{"type":154,"value":601},{"type":145,"tag":586,"props":1571,"children":1572},{"style":598},[1573],{"type":154,"value":606},{"type":145,"tag":586,"props":1575,"children":1576},{"style":609},[1577],{"type":154,"value":1578},"[50, 25]",{"type":145,"tag":586,"props":1580,"children":1581},{"style":598},[1582],{"type":154,"value":606},{"type":145,"tag":586,"props":1584,"children":1585},{"style":598},[1586],{"type":154,"value":858},{"type":145,"tag":586,"props":1588,"children":1589},{"class":588,"line":1386},[1590],{"type":145,"tag":586,"props":1591,"children":1592},{"emptyLinePlaceholder":1518},[1593],{"type":154,"value":1521},{"type":145,"tag":586,"props":1595,"children":1596},{"class":588,"line":1396},[1597],{"type":145,"tag":586,"props":1598,"children":1599},{"style":1390},[1600],{"type":154,"value":1601},"\u003C!-- Set a width, height, quality & blur for the automatically generated placeholder  -->\n",{"type":145,"tag":586,"props":1603,"children":1604},{"class":588,"line":1405},[1605,1609,1613,1617,1621,1625,1629,1633,1637,1641,1645,1650,1654],{"type":145,"tag":586,"props":1606,"children":1607},{"style":598},[1608],{"type":154,"value":824},{"type":145,"tag":586,"props":1610,"children":1611},{"style":827},[1612],{"type":154,"value":1483},{"type":145,"tag":586,"props":1614,"children":1615},{"style":833},[1616],{"type":154,"value":836},{"type":145,"tag":586,"props":1618,"children":1619},{"style":598},[1620],{"type":154,"value":601},{"type":145,"tag":586,"props":1622,"children":1623},{"style":598},[1624],{"type":154,"value":606},{"type":145,"tag":586,"props":1626,"children":1627},{"style":609},[1628],{"type":154,"value":1013},{"type":145,"tag":586,"props":1630,"children":1631},{"style":598},[1632],{"type":154,"value":606},{"type":145,"tag":586,"props":1634,"children":1635},{"style":833},[1636],{"type":154,"value":1565},{"type":145,"tag":586,"props":1638,"children":1639},{"style":598},[1640],{"type":154,"value":601},{"type":145,"tag":586,"props":1642,"children":1643},{"style":598},[1644],{"type":154,"value":606},{"type":145,"tag":586,"props":1646,"children":1647},{"style":609},[1648],{"type":154,"value":1649},"[50, 25, 75, 5]",{"type":145,"tag":586,"props":1651,"children":1652},{"style":598},[1653],{"type":154,"value":606},{"type":145,"tag":586,"props":1655,"children":1656},{"style":598},[1657],{"type":154,"value":858},{"type":145,"tag":586,"props":1659,"children":1660},{"class":588,"line":1414},[1661],{"type":145,"tag":586,"props":1662,"children":1663},{"emptyLinePlaceholder":1518},[1664],{"type":154,"value":1521},{"type":145,"tag":586,"props":1666,"children":1667},{"class":588,"line":1423},[1668],{"type":145,"tag":586,"props":1669,"children":1670},{"style":1390},[1671],{"type":154,"value":1672},"\u003C!-- Set the width & height of the automatically generated placeholder, image will be a square -->\n",{"type":145,"tag":586,"props":1674,"children":1675},{"class":588,"line":1431},[1676,1680,1684,1688,1692,1696,1700,1704,1708,1712,1716,1721,1725],{"type":145,"tag":586,"props":1677,"children":1678},{"style":598},[1679],{"type":154,"value":824},{"type":145,"tag":586,"props":1681,"children":1682},{"style":827},[1683],{"type":154,"value":1483},{"type":145,"tag":586,"props":1685,"children":1686},{"style":833},[1687],{"type":154,"value":836},{"type":145,"tag":586,"props":1689,"children":1690},{"style":598},[1691],{"type":154,"value":601},{"type":145,"tag":586,"props":1693,"children":1694},{"style":598},[1695],{"type":154,"value":606},{"type":145,"tag":586,"props":1697,"children":1698},{"style":609},[1699],{"type":154,"value":1013},{"type":145,"tag":586,"props":1701,"children":1702},{"style":598},[1703],{"type":154,"value":606},{"type":145,"tag":586,"props":1705,"children":1706},{"style":833},[1707],{"type":154,"value":1565},{"type":145,"tag":586,"props":1709,"children":1710},{"style":598},[1711],{"type":154,"value":601},{"type":145,"tag":586,"props":1713,"children":1714},{"style":598},[1715],{"type":154,"value":606},{"type":145,"tag":586,"props":1717,"children":1718},{"style":609},[1719],{"type":154,"value":1720},"15",{"type":145,"tag":586,"props":1722,"children":1723},{"style":598},[1724],{"type":154,"value":606},{"type":145,"tag":586,"props":1726,"children":1727},{"style":598},[1728],{"type":154,"value":858},{"type":145,"tag":586,"props":1730,"children":1732},{"class":588,"line":1731},12,[1733],{"type":145,"tag":586,"props":1734,"children":1735},{"emptyLinePlaceholder":1518},[1736],{"type":154,"value":1521},{"type":145,"tag":586,"props":1738,"children":1740},{"class":588,"line":1739},13,[1741],{"type":145,"tag":586,"props":1742,"children":1743},{"style":1390},[1744],{"type":154,"value":1745},"\u003C!-- Provide your own image -->\n",{"type":145,"tag":586,"props":1747,"children":1749},{"class":588,"line":1748},14,[1750,1754,1758,1762,1766,1770,1774,1778,1782,1786,1790,1795,1799],{"type":145,"tag":586,"props":1751,"children":1752},{"style":598},[1753],{"type":154,"value":824},{"type":145,"tag":586,"props":1755,"children":1756},{"style":827},[1757],{"type":154,"value":1483},{"type":145,"tag":586,"props":1759,"children":1760},{"style":833},[1761],{"type":154,"value":836},{"type":145,"tag":586,"props":1763,"children":1764},{"style":598},[1765],{"type":154,"value":601},{"type":145,"tag":586,"props":1767,"children":1768},{"style":598},[1769],{"type":154,"value":606},{"type":145,"tag":586,"props":1771,"children":1772},{"style":609},[1773],{"type":154,"value":1013},{"type":145,"tag":586,"props":1775,"children":1776},{"style":598},[1777],{"type":154,"value":606},{"type":145,"tag":586,"props":1779,"children":1780},{"style":833},[1781],{"type":154,"value":1508},{"type":145,"tag":586,"props":1783,"children":1784},{"style":598},[1785],{"type":154,"value":601},{"type":145,"tag":586,"props":1787,"children":1788},{"style":598},[1789],{"type":154,"value":606},{"type":145,"tag":586,"props":1791,"children":1792},{"style":609},[1793],{"type":154,"value":1794},"./placeholder.png",{"type":145,"tag":586,"props":1796,"children":1797},{"style":598},[1798],{"type":154,"value":606},{"type":145,"tag":586,"props":1800,"children":1801},{"style":598},[1802],{"type":154,"value":858},{"type":145,"tag":150,"props":1804,"children":1805},{},[1806,1808,1816],{"type":154,"value":1807},"You can also leverage ",{"type":145,"tag":157,"props":1809,"children":1810},{"href":32},[1811],{"type":145,"tag":199,"props":1812,"children":1814},{"className":1813},[],[1815],{"type":154,"value":31},{"type":154,"value":1817}," to generate a placeholder image based on the original image, can be useful if the source is an SVG or you want better control on the modifiers:",{"type":145,"tag":576,"props":1819,"children":1823},{"className":1820,"code":1821,"language":1822,"meta":139,"style":139},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nconst img = useImage()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CNuxtImg :placeholder=\"img(`/nuxt.svg`, { h: 10, f: 'png', blur: 2, q: 50 })\" src=\"/nuxt.svg`\" />\n\u003C/template>\n","vue",[1824],{"type":145,"tag":199,"props":1825,"children":1826},{"__ignoreMap":139},[1827,1849,1877,1893,1900,1916,2086],{"type":145,"tag":586,"props":1828,"children":1829},{"class":588,"line":589},[1830,1834,1839,1844],{"type":145,"tag":586,"props":1831,"children":1832},{"style":598},[1833],{"type":154,"value":824},{"type":145,"tag":586,"props":1835,"children":1836},{"style":827},[1837],{"type":154,"value":1838},"script",{"type":145,"tag":586,"props":1840,"children":1841},{"style":833},[1842],{"type":154,"value":1843}," setup",{"type":145,"tag":586,"props":1845,"children":1846},{"style":598},[1847],{"type":154,"value":1848},">\n",{"type":145,"tag":586,"props":1850,"children":1851},{"class":588,"line":367},[1852,1857,1862,1866,1872],{"type":145,"tag":586,"props":1853,"children":1854},{"style":833},[1855],{"type":154,"value":1856},"const",{"type":145,"tag":586,"props":1858,"children":1859},{"style":593},[1860],{"type":154,"value":1861}," img ",{"type":145,"tag":586,"props":1863,"children":1864},{"style":598},[1865],{"type":154,"value":601},{"type":145,"tag":586,"props":1867,"children":1869},{"style":1868},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[1870],{"type":154,"value":1871}," useImage",{"type":145,"tag":586,"props":1873,"children":1874},{"style":593},[1875],{"type":154,"value":1876},"()\n",{"type":145,"tag":586,"props":1878,"children":1879},{"class":588,"line":372},[1880,1885,1889],{"type":145,"tag":586,"props":1881,"children":1882},{"style":598},[1883],{"type":154,"value":1884},"\u003C/",{"type":145,"tag":586,"props":1886,"children":1887},{"style":827},[1888],{"type":154,"value":1838},{"type":145,"tag":586,"props":1890,"children":1891},{"style":598},[1892],{"type":154,"value":1848},{"type":145,"tag":586,"props":1894,"children":1895},{"class":588,"line":1257},[1896],{"type":145,"tag":586,"props":1897,"children":1898},{"emptyLinePlaceholder":1518},[1899],{"type":154,"value":1521},{"type":145,"tag":586,"props":1901,"children":1902},{"class":588,"line":1378},[1903,1907,1912],{"type":145,"tag":586,"props":1904,"children":1905},{"style":598},[1906],{"type":154,"value":824},{"type":145,"tag":586,"props":1908,"children":1909},{"style":827},[1910],{"type":154,"value":1911},"template",{"type":145,"tag":586,"props":1913,"children":1914},{"style":598},[1915],{"type":154,"value":1848},{"type":145,"tag":586,"props":1917,"children":1918},{"class":588,"line":1386},[1919,1924,1928,1933,1937,1941,1945,1949,1954,1959,1964,1968,1973,1978,1983,1989,1994,1999,2003,2008,2013,2017,2021,2026,2030,2035,2039,2044,2048,2052,2057,2061,2065,2069,2073,2078,2082],{"type":145,"tag":586,"props":1920,"children":1921},{"style":598},[1922],{"type":154,"value":1923},"  \u003C",{"type":145,"tag":586,"props":1925,"children":1926},{"style":827},[1927],{"type":154,"value":830},{"type":145,"tag":586,"props":1929,"children":1930},{"style":598},[1931],{"type":154,"value":1932}," :",{"type":145,"tag":586,"props":1934,"children":1935},{"style":833},[1936],{"type":154,"value":1440},{"type":145,"tag":586,"props":1938,"children":1939},{"style":598},[1940],{"type":154,"value":601},{"type":145,"tag":586,"props":1942,"children":1943},{"style":598},[1944],{"type":154,"value":606},{"type":145,"tag":586,"props":1946,"children":1947},{"style":1868},[1948],{"type":154,"value":798},{"type":145,"tag":586,"props":1950,"children":1951},{"style":598},[1952],{"type":154,"value":1953},"(",{"type":145,"tag":586,"props":1955,"children":1956},{"style":598},[1957],{"type":154,"value":1958},"`",{"type":145,"tag":586,"props":1960,"children":1961},{"style":609},[1962],{"type":154,"value":1963},"/nuxt.svg",{"type":145,"tag":586,"props":1965,"children":1966},{"style":598},[1967],{"type":154,"value":1958},{"type":145,"tag":586,"props":1969,"children":1970},{"style":598},[1971],{"type":154,"value":1972},", { ",{"type":145,"tag":586,"props":1974,"children":1975},{"style":827},[1976],{"type":154,"value":1977},"h",{"type":145,"tag":586,"props":1979,"children":1980},{"style":598},[1981],{"type":154,"value":1982},": ",{"type":145,"tag":586,"props":1984,"children":1986},{"style":1985},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[1987],{"type":154,"value":1988},"10",{"type":145,"tag":586,"props":1990,"children":1991},{"style":598},[1992],{"type":154,"value":1993},", ",{"type":145,"tag":586,"props":1995,"children":1996},{"style":827},[1997],{"type":154,"value":1998},"f",{"type":145,"tag":586,"props":2000,"children":2001},{"style":598},[2002],{"type":154,"value":1982},{"type":145,"tag":586,"props":2004,"children":2005},{"style":598},[2006],{"type":154,"value":2007},"'",{"type":145,"tag":586,"props":2009,"children":2010},{"style":609},[2011],{"type":154,"value":2012},"png",{"type":145,"tag":586,"props":2014,"children":2015},{"style":598},[2016],{"type":154,"value":2007},{"type":145,"tag":586,"props":2018,"children":2019},{"style":598},[2020],{"type":154,"value":1993},{"type":145,"tag":586,"props":2022,"children":2023},{"style":827},[2024],{"type":154,"value":2025},"blur",{"type":145,"tag":586,"props":2027,"children":2028},{"style":598},[2029],{"type":154,"value":1982},{"type":145,"tag":586,"props":2031,"children":2032},{"style":1985},[2033],{"type":154,"value":2034},"2",{"type":145,"tag":586,"props":2036,"children":2037},{"style":598},[2038],{"type":154,"value":1993},{"type":145,"tag":586,"props":2040,"children":2041},{"style":827},[2042],{"type":154,"value":2043},"q",{"type":145,"tag":586,"props":2045,"children":2046},{"style":598},[2047],{"type":154,"value":1982},{"type":145,"tag":586,"props":2049,"children":2050},{"style":1985},[2051],{"type":154,"value":1346},{"type":145,"tag":586,"props":2053,"children":2054},{"style":598},[2055],{"type":154,"value":2056}," })",{"type":145,"tag":586,"props":2058,"children":2059},{"style":598},[2060],{"type":154,"value":606},{"type":145,"tag":586,"props":2062,"children":2063},{"style":833},[2064],{"type":154,"value":836},{"type":145,"tag":586,"props":2066,"children":2067},{"style":598},[2068],{"type":154,"value":601},{"type":145,"tag":586,"props":2070,"children":2071},{"style":598},[2072],{"type":154,"value":606},{"type":145,"tag":586,"props":2074,"children":2075},{"style":609},[2076],{"type":154,"value":2077},"/nuxt.svg`",{"type":145,"tag":586,"props":2079,"children":2080},{"style":598},[2081],{"type":154,"value":606},{"type":145,"tag":586,"props":2083,"children":2084},{"style":598},[2085],{"type":154,"value":858},{"type":145,"tag":586,"props":2087,"children":2088},{"class":588,"line":1396},[2089,2093,2097],{"type":145,"tag":586,"props":2090,"children":2091},{"style":598},[2092],{"type":154,"value":1884},{"type":145,"tag":586,"props":2094,"children":2095},{"style":827},[2096],{"type":154,"value":1911},{"type":145,"tag":586,"props":2098,"children":2099},{"style":598},[2100],{"type":154,"value":1848},{"type":145,"tag":230,"props":2102,"children":2104},{"id":2103},"provider",[2105],{"type":145,"tag":199,"props":2106,"children":2108},{"className":2107},[],[2109],{"type":154,"value":2103},{"type":145,"tag":150,"props":2111,"children":2112},{},[2113,2115,2121,2123],{"type":154,"value":2114},"Use other provider instead of default ",{"type":145,"tag":157,"props":2116,"children":2118},{"href":2117},"/get-started/configuration#provider",[2119],{"type":154,"value":2120},"provider option",{"type":154,"value":2122}," specified in ",{"type":145,"tag":199,"props":2124,"children":2126},{"className":2125},[],[2127],{"type":154,"value":2128},"nuxt.config",{"type":145,"tag":150,"props":2130,"children":2131},{},[2132],{"type":145,"tag":532,"props":2133,"children":2134},{},[2135],{"type":154,"value":1185},{"type":145,"tag":2137,"props":2138,"children":2139},"code-group",{},[2140,2297],{"type":145,"tag":576,"props":2141,"children":2144},{"className":810,"code":2142,"filename":2143,"language":812,"meta":139,"style":139},"\u003Ctemplate>\n  \u003CNuxtImg\n    provider=\"cloudinary\"\n    src=\"/remote/nuxt-org/blog/going-full-static/main.png\"\n    width=\"300\"\n    height=\"169\"\n  />\n\u003C/template>\n","index.vue",[2145],{"type":145,"tag":199,"props":2146,"children":2147},{"__ignoreMap":139},[2148,2163,2174,2199,2224,2249,2274,2282],{"type":145,"tag":586,"props":2149,"children":2150},{"class":588,"line":589},[2151,2155,2159],{"type":145,"tag":586,"props":2152,"children":2153},{"style":598},[2154],{"type":154,"value":824},{"type":145,"tag":586,"props":2156,"children":2157},{"style":827},[2158],{"type":154,"value":1911},{"type":145,"tag":586,"props":2160,"children":2161},{"style":598},[2162],{"type":154,"value":1848},{"type":145,"tag":586,"props":2164,"children":2165},{"class":588,"line":367},[2166,2170],{"type":145,"tag":586,"props":2167,"children":2168},{"style":598},[2169],{"type":154,"value":1923},{"type":145,"tag":586,"props":2171,"children":2172},{"style":827},[2173],{"type":154,"value":1204},{"type":145,"tag":586,"props":2175,"children":2176},{"class":588,"line":372},[2177,2182,2186,2190,2195],{"type":145,"tag":586,"props":2178,"children":2179},{"style":833},[2180],{"type":154,"value":2181},"    provider",{"type":145,"tag":586,"props":2183,"children":2184},{"style":598},[2185],{"type":154,"value":601},{"type":145,"tag":586,"props":2187,"children":2188},{"style":598},[2189],{"type":154,"value":606},{"type":145,"tag":586,"props":2191,"children":2192},{"style":609},[2193],{"type":154,"value":2194},"cloudinary",{"type":145,"tag":586,"props":2196,"children":2197},{"style":598},[2198],{"type":154,"value":617},{"type":145,"tag":586,"props":2200,"children":2201},{"class":588,"line":1257},[2202,2207,2211,2215,2220],{"type":145,"tag":586,"props":2203,"children":2204},{"style":833},[2205],{"type":154,"value":2206},"    src",{"type":145,"tag":586,"props":2208,"children":2209},{"style":598},[2210],{"type":154,"value":601},{"type":145,"tag":586,"props":2212,"children":2213},{"style":598},[2214],{"type":154,"value":606},{"type":145,"tag":586,"props":2216,"children":2217},{"style":609},[2218],{"type":154,"value":2219},"/remote/nuxt-org/blog/going-full-static/main.png",{"type":145,"tag":586,"props":2221,"children":2222},{"style":598},[2223],{"type":154,"value":617},{"type":145,"tag":586,"props":2225,"children":2226},{"class":588,"line":1378},[2227,2232,2236,2240,2245],{"type":145,"tag":586,"props":2228,"children":2229},{"style":833},[2230],{"type":154,"value":2231},"    width",{"type":145,"tag":586,"props":2233,"children":2234},{"style":598},[2235],{"type":154,"value":601},{"type":145,"tag":586,"props":2237,"children":2238},{"style":598},[2239],{"type":154,"value":606},{"type":145,"tag":586,"props":2241,"children":2242},{"style":609},[2243],{"type":154,"value":2244},"300",{"type":145,"tag":586,"props":2246,"children":2247},{"style":598},[2248],{"type":154,"value":617},{"type":145,"tag":586,"props":2250,"children":2251},{"class":588,"line":1386},[2252,2257,2261,2265,2270],{"type":145,"tag":586,"props":2253,"children":2254},{"style":833},[2255],{"type":154,"value":2256},"    height",{"type":145,"tag":586,"props":2258,"children":2259},{"style":598},[2260],{"type":154,"value":601},{"type":145,"tag":586,"props":2262,"children":2263},{"style":598},[2264],{"type":154,"value":606},{"type":145,"tag":586,"props":2266,"children":2267},{"style":609},[2268],{"type":154,"value":2269},"169",{"type":145,"tag":586,"props":2271,"children":2272},{"style":598},[2273],{"type":154,"value":617},{"type":145,"tag":586,"props":2275,"children":2276},{"class":588,"line":1396},[2277],{"type":145,"tag":586,"props":2278,"children":2279},{"style":598},[2280],{"type":154,"value":2281},"  />\n",{"type":145,"tag":586,"props":2283,"children":2284},{"class":588,"line":1405},[2285,2289,2293],{"type":145,"tag":586,"props":2286,"children":2287},{"style":598},[2288],{"type":154,"value":1884},{"type":145,"tag":586,"props":2290,"children":2291},{"style":827},[2292],{"type":154,"value":1911},{"type":145,"tag":586,"props":2294,"children":2295},{"style":598},[2296],{"type":154,"value":1848},{"type":145,"tag":576,"props":2298,"children":2303},{"className":2299,"code":2300,"filename":2301,"language":2302,"meta":139,"style":139},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  image: {\n    cloudinary: {\n      baseURL: 'https://res.cloudinary.com/nuxt/image/upload/',\n    },\n  },\n})\n","nuxt.config.ts","ts",[2304],{"type":145,"tag":199,"props":2305,"children":2306},{"__ignoreMap":139},[2307,2335,2353,2369,2400,2408,2416],{"type":145,"tag":586,"props":2308,"children":2309},{"class":588,"line":589},[2310,2316,2321,2326,2330],{"type":145,"tag":586,"props":2311,"children":2313},{"style":2312},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[2314],{"type":154,"value":2315},"export",{"type":145,"tag":586,"props":2317,"children":2318},{"style":2312},[2319],{"type":154,"value":2320}," default",{"type":145,"tag":586,"props":2322,"children":2323},{"style":1868},[2324],{"type":154,"value":2325}," defineNuxtConfig",{"type":145,"tag":586,"props":2327,"children":2328},{"style":593},[2329],{"type":154,"value":1953},{"type":145,"tag":586,"props":2331,"children":2332},{"style":598},[2333],{"type":154,"value":2334},"{\n",{"type":145,"tag":586,"props":2336,"children":2337},{"class":588,"line":367},[2338,2343,2348],{"type":145,"tag":586,"props":2339,"children":2340},{"style":827},[2341],{"type":154,"value":2342},"  image",{"type":145,"tag":586,"props":2344,"children":2345},{"style":598},[2346],{"type":154,"value":2347},":",{"type":145,"tag":586,"props":2349,"children":2350},{"style":598},[2351],{"type":154,"value":2352}," {\n",{"type":145,"tag":586,"props":2354,"children":2355},{"class":588,"line":372},[2356,2361,2365],{"type":145,"tag":586,"props":2357,"children":2358},{"style":827},[2359],{"type":154,"value":2360},"    cloudinary",{"type":145,"tag":586,"props":2362,"children":2363},{"style":598},[2364],{"type":154,"value":2347},{"type":145,"tag":586,"props":2366,"children":2367},{"style":598},[2368],{"type":154,"value":2352},{"type":145,"tag":586,"props":2370,"children":2371},{"class":588,"line":1257},[2372,2377,2381,2386,2391,2395],{"type":145,"tag":586,"props":2373,"children":2374},{"style":827},[2375],{"type":154,"value":2376},"      baseURL",{"type":145,"tag":586,"props":2378,"children":2379},{"style":598},[2380],{"type":154,"value":2347},{"type":145,"tag":586,"props":2382,"children":2383},{"style":598},[2384],{"type":154,"value":2385}," '",{"type":145,"tag":586,"props":2387,"children":2388},{"style":609},[2389],{"type":154,"value":2390},"https://res.cloudinary.com/nuxt/image/upload/",{"type":145,"tag":586,"props":2392,"children":2393},{"style":598},[2394],{"type":154,"value":2007},{"type":145,"tag":586,"props":2396,"children":2397},{"style":598},[2398],{"type":154,"value":2399},",\n",{"type":145,"tag":586,"props":2401,"children":2402},{"class":588,"line":1378},[2403],{"type":145,"tag":586,"props":2404,"children":2405},{"style":598},[2406],{"type":154,"value":2407},"    },\n",{"type":145,"tag":586,"props":2409,"children":2410},{"class":588,"line":1386},[2411],{"type":145,"tag":586,"props":2412,"children":2413},{"style":598},[2414],{"type":154,"value":2415},"  },\n",{"type":145,"tag":586,"props":2417,"children":2418},{"class":588,"line":1396},[2419,2424],{"type":145,"tag":586,"props":2420,"children":2421},{"style":598},[2422],{"type":154,"value":2423},"}",{"type":145,"tag":586,"props":2425,"children":2426},{"style":593},[2427],{"type":154,"value":2428},")\n",{"type":145,"tag":230,"props":2430,"children":2432},{"id":2431},"preset",[2433],{"type":145,"tag":199,"props":2434,"children":2436},{"className":2435},[],[2437],{"type":154,"value":2431},{"type":145,"tag":150,"props":2439,"children":2440},{},[2441],{"type":154,"value":2442},"Presets are predefined sets of image modifiers that can be used create unified form of images in your projects.",{"type":145,"tag":146,"props":2444,"children":2445},{},[2446],{"type":145,"tag":150,"props":2447,"children":2448},{},[2449,2451,2457,2459],{"type":154,"value":2450},"We can define presets using ",{"type":145,"tag":157,"props":2452,"children":2454},{"href":2453},"/get-started/configuration#presets",[2455],{"type":154,"value":2456},"presets options",{"type":154,"value":2458}," in ",{"type":145,"tag":199,"props":2460,"children":2462},{"className":2461},[],[2463],{"type":154,"value":2128},{"type":145,"tag":2137,"props":2465,"children":2466},{},[2467,2561],{"type":145,"tag":576,"props":2468,"children":2470},{"className":810,"code":2469,"filename":2143,"language":812,"meta":139,"style":139},"\u003Ctemplate>\n  \u003CNuxtImg preset=\"cover\" src=\"/nuxt-icon.png\" />\n\u003C/template>\n",[2471],{"type":145,"tag":199,"props":2472,"children":2473},{"__ignoreMap":139},[2474,2489,2546],{"type":145,"tag":586,"props":2475,"children":2476},{"class":588,"line":589},[2477,2481,2485],{"type":145,"tag":586,"props":2478,"children":2479},{"style":598},[2480],{"type":154,"value":824},{"type":145,"tag":586,"props":2482,"children":2483},{"style":827},[2484],{"type":154,"value":1911},{"type":145,"tag":586,"props":2486,"children":2487},{"style":598},[2488],{"type":154,"value":1848},{"type":145,"tag":586,"props":2490,"children":2491},{"class":588,"line":367},[2492,2496,2500,2505,2509,2513,2518,2522,2526,2530,2534,2538,2542],{"type":145,"tag":586,"props":2493,"children":2494},{"style":598},[2495],{"type":154,"value":1923},{"type":145,"tag":586,"props":2497,"children":2498},{"style":827},[2499],{"type":154,"value":830},{"type":145,"tag":586,"props":2501,"children":2502},{"style":833},[2503],{"type":154,"value":2504}," preset",{"type":145,"tag":586,"props":2506,"children":2507},{"style":598},[2508],{"type":154,"value":601},{"type":145,"tag":586,"props":2510,"children":2511},{"style":598},[2512],{"type":154,"value":606},{"type":145,"tag":586,"props":2514,"children":2515},{"style":609},[2516],{"type":154,"value":2517},"cover",{"type":145,"tag":586,"props":2519,"children":2520},{"style":598},[2521],{"type":154,"value":606},{"type":145,"tag":586,"props":2523,"children":2524},{"style":833},[2525],{"type":154,"value":836},{"type":145,"tag":586,"props":2527,"children":2528},{"style":598},[2529],{"type":154,"value":601},{"type":145,"tag":586,"props":2531,"children":2532},{"style":598},[2533],{"type":154,"value":606},{"type":145,"tag":586,"props":2535,"children":2536},{"style":609},[2537],{"type":154,"value":849},{"type":145,"tag":586,"props":2539,"children":2540},{"style":598},[2541],{"type":154,"value":606},{"type":145,"tag":586,"props":2543,"children":2544},{"style":598},[2545],{"type":154,"value":858},{"type":145,"tag":586,"props":2547,"children":2548},{"class":588,"line":372},[2549,2553,2557],{"type":145,"tag":586,"props":2550,"children":2551},{"style":598},[2552],{"type":154,"value":1884},{"type":145,"tag":586,"props":2554,"children":2555},{"style":827},[2556],{"type":154,"value":1911},{"type":145,"tag":586,"props":2558,"children":2559},{"style":598},[2560],{"type":154,"value":1848},{"type":145,"tag":576,"props":2562,"children":2564},{"className":2299,"code":2563,"filename":2301,"language":2302,"meta":139,"style":139},"export default defineNuxtConfig({\n  image: {\n    presets: {\n      cover: {\n        modifiers: {\n          fit: 'cover',\n          format: 'jpg',\n          width: 300,\n          height: 300,\n        },\n      },\n    },\n  },\n})\n",[2565],{"type":145,"tag":199,"props":2566,"children":2567},{"__ignoreMap":139},[2568,2591,2606,2622,2638,2654,2682,2711,2732,2752,2760,2768,2775,2782],{"type":145,"tag":586,"props":2569,"children":2570},{"class":588,"line":589},[2571,2575,2579,2583,2587],{"type":145,"tag":586,"props":2572,"children":2573},{"style":2312},[2574],{"type":154,"value":2315},{"type":145,"tag":586,"props":2576,"children":2577},{"style":2312},[2578],{"type":154,"value":2320},{"type":145,"tag":586,"props":2580,"children":2581},{"style":1868},[2582],{"type":154,"value":2325},{"type":145,"tag":586,"props":2584,"children":2585},{"style":593},[2586],{"type":154,"value":1953},{"type":145,"tag":586,"props":2588,"children":2589},{"style":598},[2590],{"type":154,"value":2334},{"type":145,"tag":586,"props":2592,"children":2593},{"class":588,"line":367},[2594,2598,2602],{"type":145,"tag":586,"props":2595,"children":2596},{"style":827},[2597],{"type":154,"value":2342},{"type":145,"tag":586,"props":2599,"children":2600},{"style":598},[2601],{"type":154,"value":2347},{"type":145,"tag":586,"props":2603,"children":2604},{"style":598},[2605],{"type":154,"value":2352},{"type":145,"tag":586,"props":2607,"children":2608},{"class":588,"line":372},[2609,2614,2618],{"type":145,"tag":586,"props":2610,"children":2611},{"style":827},[2612],{"type":154,"value":2613},"    presets",{"type":145,"tag":586,"props":2615,"children":2616},{"style":598},[2617],{"type":154,"value":2347},{"type":145,"tag":586,"props":2619,"children":2620},{"style":598},[2621],{"type":154,"value":2352},{"type":145,"tag":586,"props":2623,"children":2624},{"class":588,"line":1257},[2625,2630,2634],{"type":145,"tag":586,"props":2626,"children":2627},{"style":827},[2628],{"type":154,"value":2629},"      cover",{"type":145,"tag":586,"props":2631,"children":2632},{"style":598},[2633],{"type":154,"value":2347},{"type":145,"tag":586,"props":2635,"children":2636},{"style":598},[2637],{"type":154,"value":2352},{"type":145,"tag":586,"props":2639,"children":2640},{"class":588,"line":1378},[2641,2646,2650],{"type":145,"tag":586,"props":2642,"children":2643},{"style":827},[2644],{"type":154,"value":2645},"        modifiers",{"type":145,"tag":586,"props":2647,"children":2648},{"style":598},[2649],{"type":154,"value":2347},{"type":145,"tag":586,"props":2651,"children":2652},{"style":598},[2653],{"type":154,"value":2352},{"type":145,"tag":586,"props":2655,"children":2656},{"class":588,"line":1386},[2657,2662,2666,2670,2674,2678],{"type":145,"tag":586,"props":2658,"children":2659},{"style":827},[2660],{"type":154,"value":2661},"          fit",{"type":145,"tag":586,"props":2663,"children":2664},{"style":598},[2665],{"type":154,"value":2347},{"type":145,"tag":586,"props":2667,"children":2668},{"style":598},[2669],{"type":154,"value":2385},{"type":145,"tag":586,"props":2671,"children":2672},{"style":609},[2673],{"type":154,"value":2517},{"type":145,"tag":586,"props":2675,"children":2676},{"style":598},[2677],{"type":154,"value":2007},{"type":145,"tag":586,"props":2679,"children":2680},{"style":598},[2681],{"type":154,"value":2399},{"type":145,"tag":586,"props":2683,"children":2684},{"class":588,"line":1396},[2685,2690,2694,2698,2703,2707],{"type":145,"tag":586,"props":2686,"children":2687},{"style":827},[2688],{"type":154,"value":2689},"          format",{"type":145,"tag":586,"props":2691,"children":2692},{"style":598},[2693],{"type":154,"value":2347},{"type":145,"tag":586,"props":2695,"children":2696},{"style":598},[2697],{"type":154,"value":2385},{"type":145,"tag":586,"props":2699,"children":2700},{"style":609},[2701],{"type":154,"value":2702},"jpg",{"type":145,"tag":586,"props":2704,"children":2705},{"style":598},[2706],{"type":154,"value":2007},{"type":145,"tag":586,"props":2708,"children":2709},{"style":598},[2710],{"type":154,"value":2399},{"type":145,"tag":586,"props":2712,"children":2713},{"class":588,"line":1405},[2714,2719,2723,2728],{"type":145,"tag":586,"props":2715,"children":2716},{"style":827},[2717],{"type":154,"value":2718},"          width",{"type":145,"tag":586,"props":2720,"children":2721},{"style":598},[2722],{"type":154,"value":2347},{"type":145,"tag":586,"props":2724,"children":2725},{"style":1985},[2726],{"type":154,"value":2727}," 300",{"type":145,"tag":586,"props":2729,"children":2730},{"style":598},[2731],{"type":154,"value":2399},{"type":145,"tag":586,"props":2733,"children":2734},{"class":588,"line":1414},[2735,2740,2744,2748],{"type":145,"tag":586,"props":2736,"children":2737},{"style":827},[2738],{"type":154,"value":2739},"          height",{"type":145,"tag":586,"props":2741,"children":2742},{"style":598},[2743],{"type":154,"value":2347},{"type":145,"tag":586,"props":2745,"children":2746},{"style":1985},[2747],{"type":154,"value":2727},{"type":145,"tag":586,"props":2749,"children":2750},{"style":598},[2751],{"type":154,"value":2399},{"type":145,"tag":586,"props":2753,"children":2754},{"class":588,"line":1423},[2755],{"type":145,"tag":586,"props":2756,"children":2757},{"style":598},[2758],{"type":154,"value":2759},"        },\n",{"type":145,"tag":586,"props":2761,"children":2762},{"class":588,"line":1431},[2763],{"type":145,"tag":586,"props":2764,"children":2765},{"style":598},[2766],{"type":154,"value":2767},"      },\n",{"type":145,"tag":586,"props":2769,"children":2770},{"class":588,"line":1731},[2771],{"type":145,"tag":586,"props":2772,"children":2773},{"style":598},[2774],{"type":154,"value":2407},{"type":145,"tag":586,"props":2776,"children":2777},{"class":588,"line":1739},[2778],{"type":145,"tag":586,"props":2779,"children":2780},{"style":598},[2781],{"type":154,"value":2415},{"type":145,"tag":586,"props":2783,"children":2784},{"class":588,"line":1748},[2785,2789],{"type":145,"tag":586,"props":2786,"children":2787},{"style":598},[2788],{"type":154,"value":2423},{"type":145,"tag":586,"props":2790,"children":2791},{"style":593},[2792],{"type":154,"value":2428},{"type":145,"tag":230,"props":2794,"children":2796},{"id":2795},"format",[2797],{"type":145,"tag":199,"props":2798,"children":2800},{"className":2799},[],[2801],{"type":154,"value":2795},{"type":145,"tag":150,"props":2803,"children":2804},{},[2805],{"type":154,"value":2806},"In case you want to serve images in a specific format, use this prop.",{"type":145,"tag":576,"props":2808,"children":2810},{"className":810,"code":2809,"language":812,"meta":139,"style":139},"\u003CNuxtImg format=\"webp\" src=\"/nuxt-icon.png\" ... />\n",[2811],{"type":145,"tag":199,"props":2812,"children":2813},{"__ignoreMap":139},[2814],{"type":145,"tag":586,"props":2815,"children":2816},{"class":588,"line":589},[2817,2821,2825,2830,2834,2838,2843,2847,2851,2855,2859,2863,2867,2872],{"type":145,"tag":586,"props":2818,"children":2819},{"style":598},[2820],{"type":154,"value":824},{"type":145,"tag":586,"props":2822,"children":2823},{"style":827},[2824],{"type":154,"value":830},{"type":145,"tag":586,"props":2826,"children":2827},{"style":833},[2828],{"type":154,"value":2829}," format",{"type":145,"tag":586,"props":2831,"children":2832},{"style":598},[2833],{"type":154,"value":601},{"type":145,"tag":586,"props":2835,"children":2836},{"style":598},[2837],{"type":154,"value":606},{"type":145,"tag":586,"props":2839,"children":2840},{"style":609},[2841],{"type":154,"value":2842},"webp",{"type":145,"tag":586,"props":2844,"children":2845},{"style":598},[2846],{"type":154,"value":606},{"type":145,"tag":586,"props":2848,"children":2849},{"style":833},[2850],{"type":154,"value":836},{"type":145,"tag":586,"props":2852,"children":2853},{"style":598},[2854],{"type":154,"value":601},{"type":145,"tag":586,"props":2856,"children":2857},{"style":598},[2858],{"type":154,"value":606},{"type":145,"tag":586,"props":2860,"children":2861},{"style":609},[2862],{"type":154,"value":849},{"type":145,"tag":586,"props":2864,"children":2865},{"style":598},[2866],{"type":154,"value":606},{"type":145,"tag":586,"props":2868,"children":2869},{"style":833},[2870],{"type":154,"value":2871}," ...",{"type":145,"tag":586,"props":2873,"children":2874},{"style":598},[2875],{"type":154,"value":858},{"type":145,"tag":150,"props":2877,"children":2878},{},[2879,2881,2886,2887,2893,2894,2900,2901,2906,2907,2912,2913,2919,2920,2926],{"type":154,"value":2880},"Available formats are ",{"type":145,"tag":199,"props":2882,"children":2884},{"className":2883},[],[2885],{"type":154,"value":2842},{"type":154,"value":1993},{"type":145,"tag":199,"props":2888,"children":2890},{"className":2889},[],[2891],{"type":154,"value":2892},"avif",{"type":154,"value":1993},{"type":145,"tag":199,"props":2895,"children":2897},{"className":2896},[],[2898],{"type":154,"value":2899},"jpeg",{"type":154,"value":1993},{"type":145,"tag":199,"props":2902,"children":2904},{"className":2903},[],[2905],{"type":154,"value":2702},{"type":154,"value":1993},{"type":145,"tag":199,"props":2908,"children":2910},{"className":2909},[],[2911],{"type":154,"value":2012},{"type":154,"value":1993},{"type":145,"tag":199,"props":2914,"children":2916},{"className":2915},[],[2917],{"type":154,"value":2918},"gif",{"type":154,"value":747},{"type":145,"tag":199,"props":2921,"children":2923},{"className":2922},[],[2924],{"type":154,"value":2925},"svg",{"type":154,"value":2927},". If the format is not specified, it will respect the default image format.",{"type":145,"tag":230,"props":2929,"children":2931},{"id":2930},"quality",[2932],{"type":145,"tag":199,"props":2933,"children":2935},{"className":2934},[],[2936],{"type":154,"value":2930},{"type":145,"tag":150,"props":2938,"children":2939},{},[2940],{"type":154,"value":2941},"The quality for the generated image(s).",{"type":145,"tag":576,"props":2943,"children":2945},{"className":810,"code":2944,"language":812,"meta":139,"style":139},"\u003CNuxtImg src=\"/nuxt.jpg\" quality=\"80\" width=\"200\" height=\"100\" />\n",[2946],{"type":145,"tag":199,"props":2947,"children":2948},{"__ignoreMap":139},[2949],{"type":145,"tag":586,"props":2950,"children":2951},{"class":588,"line":589},[2952,2956,2960,2964,2968,2972,2977,2981,2986,2990,2994,2999,3003,3008,3012,3016,3021,3025,3030,3034,3038,3043,3047],{"type":145,"tag":586,"props":2953,"children":2954},{"style":598},[2955],{"type":154,"value":824},{"type":145,"tag":586,"props":2957,"children":2958},{"style":827},[2959],{"type":154,"value":830},{"type":145,"tag":586,"props":2961,"children":2962},{"style":833},[2963],{"type":154,"value":836},{"type":145,"tag":586,"props":2965,"children":2966},{"style":598},[2967],{"type":154,"value":601},{"type":145,"tag":586,"props":2969,"children":2970},{"style":598},[2971],{"type":154,"value":606},{"type":145,"tag":586,"props":2973,"children":2974},{"style":609},[2975],{"type":154,"value":2976},"/nuxt.jpg",{"type":145,"tag":586,"props":2978,"children":2979},{"style":598},[2980],{"type":154,"value":606},{"type":145,"tag":586,"props":2982,"children":2983},{"style":833},[2984],{"type":154,"value":2985}," quality",{"type":145,"tag":586,"props":2987,"children":2988},{"style":598},[2989],{"type":154,"value":601},{"type":145,"tag":586,"props":2991,"children":2992},{"style":598},[2993],{"type":154,"value":606},{"type":145,"tag":586,"props":2995,"children":2996},{"style":609},[2997],{"type":154,"value":2998},"80",{"type":145,"tag":586,"props":3000,"children":3001},{"style":598},[3002],{"type":154,"value":606},{"type":145,"tag":586,"props":3004,"children":3005},{"style":833},[3006],{"type":154,"value":3007}," width",{"type":145,"tag":586,"props":3009,"children":3010},{"style":598},[3011],{"type":154,"value":601},{"type":145,"tag":586,"props":3013,"children":3014},{"style":598},[3015],{"type":154,"value":606},{"type":145,"tag":586,"props":3017,"children":3018},{"style":609},[3019],{"type":154,"value":3020},"200",{"type":145,"tag":586,"props":3022,"children":3023},{"style":598},[3024],{"type":154,"value":606},{"type":145,"tag":586,"props":3026,"children":3027},{"style":833},[3028],{"type":154,"value":3029}," height",{"type":145,"tag":586,"props":3031,"children":3032},{"style":598},[3033],{"type":154,"value":601},{"type":145,"tag":586,"props":3035,"children":3036},{"style":598},[3037],{"type":154,"value":606},{"type":145,"tag":586,"props":3039,"children":3040},{"style":609},[3041],{"type":154,"value":3042},"100",{"type":145,"tag":586,"props":3044,"children":3045},{"style":598},[3046],{"type":154,"value":606},{"type":145,"tag":586,"props":3048,"children":3049},{"style":598},[3050],{"type":154,"value":858},{"type":145,"tag":230,"props":3052,"children":3054},{"id":3053},"fit",[3055],{"type":145,"tag":199,"props":3056,"children":3058},{"className":3057},[],[3059],{"type":154,"value":3053},{"type":145,"tag":150,"props":3061,"children":3062},{},[3063,3065,3070],{"type":154,"value":3064},"The ",{"type":145,"tag":199,"props":3066,"children":3068},{"className":3067},[],[3069],{"type":154,"value":3053},{"type":154,"value":3071}," property specifies the size of the images.\nThere are five standard values you can use with this property.",{"type":145,"tag":175,"props":3073,"children":3074},{},[3075,3085,3096,3107,3118],{"type":145,"tag":179,"props":3076,"children":3077},{},[3078,3083],{"type":145,"tag":199,"props":3079,"children":3081},{"className":3080},[],[3082],{"type":154,"value":2517},{"type":154,"value":3084},": (default) Preserving aspect ratio, ensure the image covers both provided dimensions by cropping/clipping to fit",{"type":145,"tag":179,"props":3086,"children":3087},{},[3088,3094],{"type":145,"tag":199,"props":3089,"children":3091},{"className":3090},[],[3092],{"type":154,"value":3093},"contain",{"type":154,"value":3095},": Preserving aspect ratio, contain within both provided dimensions using \"letterboxing\" where necessary.",{"type":145,"tag":179,"props":3097,"children":3098},{},[3099,3105],{"type":145,"tag":199,"props":3100,"children":3102},{"className":3101},[],[3103],{"type":154,"value":3104},"fill",{"type":154,"value":3106},": Ignore the aspect ratio of the input and stretch to both provided dimensions.",{"type":145,"tag":179,"props":3108,"children":3109},{},[3110,3116],{"type":145,"tag":199,"props":3111,"children":3113},{"className":3112},[],[3114],{"type":154,"value":3115},"inside",{"type":154,"value":3117},": Preserving aspect ratio, resize the image to be as large as possible while ensuring its dimensions are less than or equal to both those specified.",{"type":145,"tag":179,"props":3119,"children":3120},{},[3121,3127],{"type":145,"tag":199,"props":3122,"children":3124},{"className":3123},[],[3125],{"type":154,"value":3126},"outside",{"type":154,"value":3128},": Preserving aspect ratio, resize the image to be as small as possible while ensuring its dimensions are greater than or equal to both those specified.",{"type":145,"tag":576,"props":3130,"children":3132},{"className":810,"code":3131,"language":812,"meta":139,"style":139},"\u003CNuxtImg fit=\"cover\" src=\"/nuxt-icon.png\" width=\"200\" height=\"100\" />\n",[3133],{"type":145,"tag":199,"props":3134,"children":3135},{"__ignoreMap":139},[3136],{"type":145,"tag":586,"props":3137,"children":3138},{"class":588,"line":589},[3139,3143,3147,3152,3156,3160,3164,3168,3172,3176,3180,3184,3188,3192,3196,3200,3204,3208,3212,3216,3220,3224,3228],{"type":145,"tag":586,"props":3140,"children":3141},{"style":598},[3142],{"type":154,"value":824},{"type":145,"tag":586,"props":3144,"children":3145},{"style":827},[3146],{"type":154,"value":830},{"type":145,"tag":586,"props":3148,"children":3149},{"style":833},[3150],{"type":154,"value":3151}," fit",{"type":145,"tag":586,"props":3153,"children":3154},{"style":598},[3155],{"type":154,"value":601},{"type":145,"tag":586,"props":3157,"children":3158},{"style":598},[3159],{"type":154,"value":606},{"type":145,"tag":586,"props":3161,"children":3162},{"style":609},[3163],{"type":154,"value":2517},{"type":145,"tag":586,"props":3165,"children":3166},{"style":598},[3167],{"type":154,"value":606},{"type":145,"tag":586,"props":3169,"children":3170},{"style":833},[3171],{"type":154,"value":836},{"type":145,"tag":586,"props":3173,"children":3174},{"style":598},[3175],{"type":154,"value":601},{"type":145,"tag":586,"props":3177,"children":3178},{"style":598},[3179],{"type":154,"value":606},{"type":145,"tag":586,"props":3181,"children":3182},{"style":609},[3183],{"type":154,"value":849},{"type":145,"tag":586,"props":3185,"children":3186},{"style":598},[3187],{"type":154,"value":606},{"type":145,"tag":586,"props":3189,"children":3190},{"style":833},[3191],{"type":154,"value":3007},{"type":145,"tag":586,"props":3193,"children":3194},{"style":598},[3195],{"type":154,"value":601},{"type":145,"tag":586,"props":3197,"children":3198},{"style":598},[3199],{"type":154,"value":606},{"type":145,"tag":586,"props":3201,"children":3202},{"style":609},[3203],{"type":154,"value":3020},{"type":145,"tag":586,"props":3205,"children":3206},{"style":598},[3207],{"type":154,"value":606},{"type":145,"tag":586,"props":3209,"children":3210},{"style":833},[3211],{"type":154,"value":3029},{"type":145,"tag":586,"props":3213,"children":3214},{"style":598},[3215],{"type":154,"value":601},{"type":145,"tag":586,"props":3217,"children":3218},{"style":598},[3219],{"type":154,"value":606},{"type":145,"tag":586,"props":3221,"children":3222},{"style":609},[3223],{"type":154,"value":3042},{"type":145,"tag":586,"props":3225,"children":3226},{"style":598},[3227],{"type":154,"value":606},{"type":145,"tag":586,"props":3229,"children":3230},{"style":598},[3231],{"type":154,"value":858},{"type":145,"tag":146,"props":3233,"children":3234},{},[3235],{"type":145,"tag":150,"props":3236,"children":3237},{},[3238],{"type":154,"value":3239},"Some providers support other values.",{"type":145,"tag":230,"props":3241,"children":3243},{"id":3242},"modifiers",[3244],{"type":145,"tag":199,"props":3245,"children":3247},{"className":3246},[],[3248],{"type":154,"value":3242},{"type":145,"tag":150,"props":3250,"children":3251},{},[3252],{"type":154,"value":3253},"In addition to the standard modifiers, each provider might have its own additional modifiers. Because these modifiers depend on the provider, refer to its documentation to know what can be used.",{"type":145,"tag":150,"props":3255,"children":3256},{},[3257,3259,3264],{"type":154,"value":3258},"Using the ",{"type":145,"tag":199,"props":3260,"children":3262},{"className":3261},[],[3263],{"type":154,"value":3242},{"type":154,"value":3265}," prop lets you use any of these transformations.",{"type":145,"tag":150,"props":3267,"children":3268},{},[3269],{"type":145,"tag":532,"props":3270,"children":3271},{},[3272],{"type":154,"value":1185},{"type":145,"tag":576,"props":3274,"children":3276},{"className":810,"code":3275,"language":812,"meta":139,"style":139},"\u003CNuxtImg\n  provider=\"cloudinary\"\n  src=\"/remote/nuxt-org/blog/going-full-static/main.png\"\n  width=\"300\"\n  height=\"169\"\n  :modifiers=\"{ roundCorner: '0:100' }\"\n/>\n",[3277],{"type":145,"tag":199,"props":3278,"children":3279},{"__ignoreMap":139},[3280,3291,3315,3338,3362,3385,3410],{"type":145,"tag":586,"props":3281,"children":3282},{"class":588,"line":589},[3283,3287],{"type":145,"tag":586,"props":3284,"children":3285},{"style":598},[3286],{"type":154,"value":824},{"type":145,"tag":586,"props":3288,"children":3289},{"style":827},[3290],{"type":154,"value":1204},{"type":145,"tag":586,"props":3292,"children":3293},{"class":588,"line":367},[3294,3299,3303,3307,3311],{"type":145,"tag":586,"props":3295,"children":3296},{"style":833},[3297],{"type":154,"value":3298},"  provider",{"type":145,"tag":586,"props":3300,"children":3301},{"style":598},[3302],{"type":154,"value":601},{"type":145,"tag":586,"props":3304,"children":3305},{"style":598},[3306],{"type":154,"value":606},{"type":145,"tag":586,"props":3308,"children":3309},{"style":609},[3310],{"type":154,"value":2194},{"type":145,"tag":586,"props":3312,"children":3313},{"style":598},[3314],{"type":154,"value":617},{"type":145,"tag":586,"props":3316,"children":3317},{"class":588,"line":372},[3318,3322,3326,3330,3334],{"type":145,"tag":586,"props":3319,"children":3320},{"style":833},[3321],{"type":154,"value":1212},{"type":145,"tag":586,"props":3323,"children":3324},{"style":598},[3325],{"type":154,"value":601},{"type":145,"tag":586,"props":3327,"children":3328},{"style":598},[3329],{"type":154,"value":606},{"type":145,"tag":586,"props":3331,"children":3332},{"style":609},[3333],{"type":154,"value":2219},{"type":145,"tag":586,"props":3335,"children":3336},{"style":598},[3337],{"type":154,"value":617},{"type":145,"tag":586,"props":3339,"children":3340},{"class":588,"line":1257},[3341,3346,3350,3354,3358],{"type":145,"tag":586,"props":3342,"children":3343},{"style":833},[3344],{"type":154,"value":3345},"  width",{"type":145,"tag":586,"props":3347,"children":3348},{"style":598},[3349],{"type":154,"value":601},{"type":145,"tag":586,"props":3351,"children":3352},{"style":598},[3353],{"type":154,"value":606},{"type":145,"tag":586,"props":3355,"children":3356},{"style":609},[3357],{"type":154,"value":2244},{"type":145,"tag":586,"props":3359,"children":3360},{"style":598},[3361],{"type":154,"value":617},{"type":145,"tag":586,"props":3363,"children":3364},{"class":588,"line":1378},[3365,3369,3373,3377,3381],{"type":145,"tag":586,"props":3366,"children":3367},{"style":833},[3368],{"type":154,"value":1333},{"type":145,"tag":586,"props":3370,"children":3371},{"style":598},[3372],{"type":154,"value":601},{"type":145,"tag":586,"props":3374,"children":3375},{"style":598},[3376],{"type":154,"value":606},{"type":145,"tag":586,"props":3378,"children":3379},{"style":609},[3380],{"type":154,"value":2269},{"type":145,"tag":586,"props":3382,"children":3383},{"style":598},[3384],{"type":154,"value":617},{"type":145,"tag":586,"props":3386,"children":3387},{"class":588,"line":1386},[3388,3393,3397,3401,3406],{"type":145,"tag":586,"props":3389,"children":3390},{"style":833},[3391],{"type":154,"value":3392},"  :modifiers",{"type":145,"tag":586,"props":3394,"children":3395},{"style":598},[3396],{"type":154,"value":601},{"type":145,"tag":586,"props":3398,"children":3399},{"style":598},[3400],{"type":154,"value":606},{"type":145,"tag":586,"props":3402,"children":3403},{"style":609},[3404],{"type":154,"value":3405},"{ roundCorner: '0:100' }",{"type":145,"tag":586,"props":3407,"children":3408},{"style":598},[3409],{"type":154,"value":617},{"type":145,"tag":586,"props":3411,"children":3412},{"class":588,"line":1396},[3413],{"type":145,"tag":586,"props":3414,"children":3415},{"style":598},[3416],{"type":154,"value":1263},{"type":145,"tag":230,"props":3418,"children":3420},{"id":3419},"preload",[3421],{"type":145,"tag":199,"props":3422,"children":3424},{"className":3423},[],[3425],{"type":154,"value":3419},{"type":145,"tag":150,"props":3427,"children":3428},{},[3429,3431,3437],{"type":154,"value":3430},"In case you want to preload the image, use this prop. This will place a corresponding ",{"type":145,"tag":199,"props":3432,"children":3434},{"className":3433},[],[3435],{"type":154,"value":3436},"link",{"type":154,"value":3438}," tag in the page's head.",{"type":145,"tag":576,"props":3440,"children":3442},{"className":810,"code":3441,"language":812,"meta":139,"style":139},"\u003CNuxtImg preload src=\"/nuxt-icon.png\" />\n",[3443],{"type":145,"tag":199,"props":3444,"children":3445},{"__ignoreMap":139},[3446],{"type":145,"tag":586,"props":3447,"children":3448},{"class":588,"line":589},[3449,3453,3457,3462,3466,3470,3474,3478,3482],{"type":145,"tag":586,"props":3450,"children":3451},{"style":598},[3452],{"type":154,"value":824},{"type":145,"tag":586,"props":3454,"children":3455},{"style":827},[3456],{"type":154,"value":830},{"type":145,"tag":586,"props":3458,"children":3459},{"style":833},[3460],{"type":154,"value":3461}," preload",{"type":145,"tag":586,"props":3463,"children":3464},{"style":833},[3465],{"type":154,"value":836},{"type":145,"tag":586,"props":3467,"children":3468},{"style":598},[3469],{"type":154,"value":601},{"type":145,"tag":586,"props":3471,"children":3472},{"style":598},[3473],{"type":154,"value":606},{"type":145,"tag":586,"props":3475,"children":3476},{"style":609},[3477],{"type":154,"value":849},{"type":145,"tag":586,"props":3479,"children":3480},{"style":598},[3481],{"type":154,"value":606},{"type":145,"tag":586,"props":3483,"children":3484},{"style":598},[3485],{"type":154,"value":858},{"type":145,"tag":230,"props":3487,"children":3489},{"id":3488},"loading",[3490],{"type":145,"tag":199,"props":3491,"children":3493},{"className":3492},[],[3494],{"type":154,"value":3488},{"type":145,"tag":150,"props":3496,"children":3497},{},[3498,3500,3507,3509,3516],{"type":154,"value":3499},"This is a ",{"type":145,"tag":157,"props":3501,"children":3504},{"href":3502,"rel":3503},"https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading",[161],[3505],{"type":154,"value":3506},"native",{"type":154,"value":3508}," attribute that provides a hint\nto the browser on how to handle the loading of an image which is outside the viewport.\nIt is ",{"type":145,"tag":157,"props":3510,"children":3513},{"href":3511,"rel":3512},"https://caniuse.com/loading-lazy-attr",[161],[3514],{"type":154,"value":3515},"supported",{"type":154,"value":3517}," by the latest version of all major browsers since March 2022.",{"type":145,"tag":150,"props":3519,"children":3520},{},[3521,3523,3529],{"type":154,"value":3522},"Set ",{"type":145,"tag":199,"props":3524,"children":3526},{"className":3525},[],[3527],{"type":154,"value":3528},"loading=\"lazy\"",{"type":154,"value":3530}," to defer loading of an image until it appears in the viewport.",{"type":145,"tag":576,"props":3532,"children":3534},{"className":810,"code":3533,"language":812,"meta":139,"style":139},"\u003CNuxtImg src=\"/nuxt-icon.png\" loading=\"lazy\" />\n",[3535],{"type":145,"tag":199,"props":3536,"children":3537},{"__ignoreMap":139},[3538],{"type":145,"tag":586,"props":3539,"children":3540},{"class":588,"line":589},[3541,3545,3549,3553,3557,3561,3565,3569,3574,3578,3582,3587,3591],{"type":145,"tag":586,"props":3542,"children":3543},{"style":598},[3544],{"type":154,"value":824},{"type":145,"tag":586,"props":3546,"children":3547},{"style":827},[3548],{"type":154,"value":830},{"type":145,"tag":586,"props":3550,"children":3551},{"style":833},[3552],{"type":154,"value":836},{"type":145,"tag":586,"props":3554,"children":3555},{"style":598},[3556],{"type":154,"value":601},{"type":145,"tag":586,"props":3558,"children":3559},{"style":598},[3560],{"type":154,"value":606},{"type":145,"tag":586,"props":3562,"children":3563},{"style":609},[3564],{"type":154,"value":849},{"type":145,"tag":586,"props":3566,"children":3567},{"style":598},[3568],{"type":154,"value":606},{"type":145,"tag":586,"props":3570,"children":3571},{"style":833},[3572],{"type":154,"value":3573}," loading",{"type":145,"tag":586,"props":3575,"children":3576},{"style":598},[3577],{"type":154,"value":601},{"type":145,"tag":586,"props":3579,"children":3580},{"style":598},[3581],{"type":154,"value":606},{"type":145,"tag":586,"props":3583,"children":3584},{"style":609},[3585],{"type":154,"value":3586},"lazy",{"type":145,"tag":586,"props":3588,"children":3589},{"style":598},[3590],{"type":154,"value":606},{"type":145,"tag":586,"props":3592,"children":3593},{"style":598},[3594],{"type":154,"value":858},{"type":145,"tag":230,"props":3596,"children":3598},{"id":3597},"nonce",[3599],{"type":145,"tag":199,"props":3600,"children":3602},{"className":3601},[],[3603],{"type":154,"value":3597},{"type":145,"tag":150,"props":3605,"children":3606},{},[3607,3608,3614,3616,3622,3624,3629],{"type":154,"value":3499},{"type":145,"tag":157,"props":3609,"children":3612},{"href":3610,"rel":3611},"https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce",[161],[3613],{"type":154,"value":3506},{"type":154,"value":3615}," global attribute that defines a cryptographic nonce (number used once) that can be used by Content Security Policy to determine whether or not a given fetch will be allowed to proceed for a given element.\nProviding a nonce allows you to avoid using the CSP ",{"type":145,"tag":199,"props":3617,"children":3619},{"className":3618},[],[3620],{"type":154,"value":3621},"unsafe-inline",{"type":154,"value":3623}," directive, which would allowlist ",{"type":145,"tag":1120,"props":3625,"children":3626},{},[3627],{"type":154,"value":3628},"all",{"type":154,"value":3630}," inline script or styles.",{"type":145,"tag":576,"props":3632,"children":3634},{"className":810,"code":3633,"language":812,"meta":139,"style":139},"\u003CNuxtImg src=\"/nuxt-icon.png\" :nonce=\"nonce\" />\n\n\u003Cscript lang=\"ts\" setup>\n// useNonce is not provided by nuxt/image but might be\n// provided by another module, for example nuxt-security\nconst nonce = useNonce()\n\u003C/script>\n",[3635],{"type":145,"tag":199,"props":3636,"children":3637},{"__ignoreMap":139},[3638,3694,3701,3741,3749,3757,3782],{"type":145,"tag":586,"props":3639,"children":3640},{"class":588,"line":589},[3641,3645,3649,3653,3657,3661,3665,3669,3674,3678,3682,3686,3690],{"type":145,"tag":586,"props":3642,"children":3643},{"style":598},[3644],{"type":154,"value":824},{"type":145,"tag":586,"props":3646,"children":3647},{"style":827},[3648],{"type":154,"value":830},{"type":145,"tag":586,"props":3650,"children":3651},{"style":833},[3652],{"type":154,"value":836},{"type":145,"tag":586,"props":3654,"children":3655},{"style":598},[3656],{"type":154,"value":601},{"type":145,"tag":586,"props":3658,"children":3659},{"style":598},[3660],{"type":154,"value":606},{"type":145,"tag":586,"props":3662,"children":3663},{"style":609},[3664],{"type":154,"value":849},{"type":145,"tag":586,"props":3666,"children":3667},{"style":598},[3668],{"type":154,"value":606},{"type":145,"tag":586,"props":3670,"children":3671},{"style":833},[3672],{"type":154,"value":3673}," :nonce",{"type":145,"tag":586,"props":3675,"children":3676},{"style":598},[3677],{"type":154,"value":601},{"type":145,"tag":586,"props":3679,"children":3680},{"style":598},[3681],{"type":154,"value":606},{"type":145,"tag":586,"props":3683,"children":3684},{"style":609},[3685],{"type":154,"value":3597},{"type":145,"tag":586,"props":3687,"children":3688},{"style":598},[3689],{"type":154,"value":606},{"type":145,"tag":586,"props":3691,"children":3692},{"style":598},[3693],{"type":154,"value":858},{"type":145,"tag":586,"props":3695,"children":3696},{"class":588,"line":367},[3697],{"type":145,"tag":586,"props":3698,"children":3699},{"emptyLinePlaceholder":1518},[3700],{"type":154,"value":1521},{"type":145,"tag":586,"props":3702,"children":3703},{"class":588,"line":372},[3704,3708,3712,3717,3721,3725,3729,3733,3737],{"type":145,"tag":586,"props":3705,"children":3706},{"style":598},[3707],{"type":154,"value":824},{"type":145,"tag":586,"props":3709,"children":3710},{"style":827},[3711],{"type":154,"value":1838},{"type":145,"tag":586,"props":3713,"children":3714},{"style":833},[3715],{"type":154,"value":3716}," lang",{"type":145,"tag":586,"props":3718,"children":3719},{"style":598},[3720],{"type":154,"value":601},{"type":145,"tag":586,"props":3722,"children":3723},{"style":598},[3724],{"type":154,"value":606},{"type":145,"tag":586,"props":3726,"children":3727},{"style":609},[3728],{"type":154,"value":2302},{"type":145,"tag":586,"props":3730,"children":3731},{"style":598},[3732],{"type":154,"value":606},{"type":145,"tag":586,"props":3734,"children":3735},{"style":833},[3736],{"type":154,"value":1843},{"type":145,"tag":586,"props":3738,"children":3739},{"style":598},[3740],{"type":154,"value":1848},{"type":145,"tag":586,"props":3742,"children":3743},{"class":588,"line":1257},[3744],{"type":145,"tag":586,"props":3745,"children":3746},{"style":1390},[3747],{"type":154,"value":3748},"// useNonce is not provided by nuxt/image but might be\n",{"type":145,"tag":586,"props":3750,"children":3751},{"class":588,"line":1378},[3752],{"type":145,"tag":586,"props":3753,"children":3754},{"style":1390},[3755],{"type":154,"value":3756},"// provided by another module, for example nuxt-security\n",{"type":145,"tag":586,"props":3758,"children":3759},{"class":588,"line":1386},[3760,3764,3769,3773,3778],{"type":145,"tag":586,"props":3761,"children":3762},{"style":833},[3763],{"type":154,"value":1856},{"type":145,"tag":586,"props":3765,"children":3766},{"style":593},[3767],{"type":154,"value":3768}," nonce ",{"type":145,"tag":586,"props":3770,"children":3771},{"style":598},[3772],{"type":154,"value":601},{"type":145,"tag":586,"props":3774,"children":3775},{"style":1868},[3776],{"type":154,"value":3777}," useNonce",{"type":145,"tag":586,"props":3779,"children":3780},{"style":593},[3781],{"type":154,"value":1876},{"type":145,"tag":586,"props":3783,"children":3784},{"class":588,"line":1396},[3785,3789,3793],{"type":145,"tag":586,"props":3786,"children":3787},{"style":598},[3788],{"type":154,"value":1884},{"type":145,"tag":586,"props":3790,"children":3791},{"style":827},[3792],{"type":154,"value":1838},{"type":145,"tag":586,"props":3794,"children":3795},{"style":598},[3796],{"type":154,"value":1848},{"type":145,"tag":168,"props":3798,"children":3800},{"id":3799},"events",[3801],{"type":154,"value":3802},"Events",{"type":145,"tag":150,"props":3804,"children":3805},{},[3806,3808,3813,3815,3820,3821,3826],{"type":154,"value":3807},"Native events emitted by the ",{"type":145,"tag":199,"props":3809,"children":3811},{"className":3810},[],[3812],{"type":154,"value":711},{"type":154,"value":3814}," element contained by ",{"type":145,"tag":199,"props":3816,"children":3818},{"className":3817},[],[3819],{"type":154,"value":25},{"type":154,"value":747},{"type":145,"tag":199,"props":3822,"children":3824},{"className":3823},[],[3825],{"type":154,"value":28},{"type":154,"value":3827}," components are re-emitted and can be listened to.",{"type":145,"tag":150,"props":3829,"children":3830},{},[3831,3835,3837,3843,3845],{"type":145,"tag":532,"props":3832,"children":3833},{},[3834],{"type":154,"value":1185},{"type":154,"value":3836}," Listen to the native ",{"type":145,"tag":199,"props":3838,"children":3840},{"className":3839},[],[3841],{"type":154,"value":3842},"onLoad",{"type":154,"value":3844}," event from ",{"type":145,"tag":199,"props":3846,"children":3848},{"className":3847},[],[3849],{"type":154,"value":25},{"type":145,"tag":576,"props":3851,"children":3853},{"className":810,"code":3852,"language":812,"meta":139,"style":139},"\u003CNuxtImg\n  src=\"/images/colors.jpg\"\n  width=\"500\"\n  height=\"500\"\n  @load=\"doSomethingOnLoad\"\n/>\n",[3854],{"type":145,"tag":199,"props":3855,"children":3856},{"__ignoreMap":139},[3857,3868,3892,3916,3939,3964],{"type":145,"tag":586,"props":3858,"children":3859},{"class":588,"line":589},[3860,3864],{"type":145,"tag":586,"props":3861,"children":3862},{"style":598},[3863],{"type":154,"value":824},{"type":145,"tag":586,"props":3865,"children":3866},{"style":827},[3867],{"type":154,"value":1204},{"type":145,"tag":586,"props":3869,"children":3870},{"class":588,"line":367},[3871,3875,3879,3883,3888],{"type":145,"tag":586,"props":3872,"children":3873},{"style":833},[3874],{"type":154,"value":1212},{"type":145,"tag":586,"props":3876,"children":3877},{"style":598},[3878],{"type":154,"value":601},{"type":145,"tag":586,"props":3880,"children":3881},{"style":598},[3882],{"type":154,"value":606},{"type":145,"tag":586,"props":3884,"children":3885},{"style":609},[3886],{"type":154,"value":3887},"/images/colors.jpg",{"type":145,"tag":586,"props":3889,"children":3890},{"style":598},[3891],{"type":154,"value":617},{"type":145,"tag":586,"props":3893,"children":3894},{"class":588,"line":372},[3895,3899,3903,3907,3912],{"type":145,"tag":586,"props":3896,"children":3897},{"style":833},[3898],{"type":154,"value":3345},{"type":145,"tag":586,"props":3900,"children":3901},{"style":598},[3902],{"type":154,"value":601},{"type":145,"tag":586,"props":3904,"children":3905},{"style":598},[3906],{"type":154,"value":606},{"type":145,"tag":586,"props":3908,"children":3909},{"style":609},[3910],{"type":154,"value":3911},"500",{"type":145,"tag":586,"props":3913,"children":3914},{"style":598},[3915],{"type":154,"value":617},{"type":145,"tag":586,"props":3917,"children":3918},{"class":588,"line":1257},[3919,3923,3927,3931,3935],{"type":145,"tag":586,"props":3920,"children":3921},{"style":833},[3922],{"type":154,"value":1333},{"type":145,"tag":586,"props":3924,"children":3925},{"style":598},[3926],{"type":154,"value":601},{"type":145,"tag":586,"props":3928,"children":3929},{"style":598},[3930],{"type":154,"value":606},{"type":145,"tag":586,"props":3932,"children":3933},{"style":609},[3934],{"type":154,"value":3911},{"type":145,"tag":586,"props":3936,"children":3937},{"style":598},[3938],{"type":154,"value":617},{"type":145,"tag":586,"props":3940,"children":3941},{"class":588,"line":1378},[3942,3947,3951,3955,3960],{"type":145,"tag":586,"props":3943,"children":3944},{"style":833},[3945],{"type":154,"value":3946},"  @load",{"type":145,"tag":586,"props":3948,"children":3949},{"style":598},[3950],{"type":154,"value":601},{"type":145,"tag":586,"props":3952,"children":3953},{"style":598},[3954],{"type":154,"value":606},{"type":145,"tag":586,"props":3956,"children":3957},{"style":609},[3958],{"type":154,"value":3959},"doSomethingOnLoad",{"type":145,"tag":586,"props":3961,"children":3962},{"style":598},[3963],{"type":154,"value":617},{"type":145,"tag":586,"props":3965,"children":3966},{"class":588,"line":1386},[3967],{"type":145,"tag":586,"props":3968,"children":3969},{"style":598},[3970],{"type":154,"value":1263},{"type":145,"tag":669,"props":3972,"children":3973},{},[3974],{"type":154,"value":673},{"title":139,"searchDepth":367,"depth":367,"links":3976},[3977,3978,3995],{"id":686,"depth":367,"text":21},{"id":937,"depth":367,"text":940,"children":3979},[3980,3981,3983,3984,3985,3986,3987,3988,3989,3990,3991,3992,3993,3994],{"id":732,"depth":372,"text":732},{"id":1045,"depth":372,"text":3982},"width / height",{"id":764,"depth":372,"text":764},{"id":1266,"depth":372,"text":1266},{"id":1440,"depth":372,"text":1440},{"id":2103,"depth":372,"text":2103},{"id":2431,"depth":372,"text":2431},{"id":2795,"depth":372,"text":2795},{"id":2930,"depth":372,"text":2930},{"id":3053,"depth":372,"text":3053},{"id":3242,"depth":372,"text":3242},{"id":3419,"depth":372,"text":3419},{"id":3488,"depth":372,"text":3488},{"id":3597,"depth":372,"text":3597},{"id":3799,"depth":367,"text":3802},"content:2.usage:1.nuxt-img.md","2.usage/1.nuxt-img.md",1713782166833]