CINXE.COM

<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Build Plugins | Netlify Docs</title> <meta name="generator" content="VuePress 1.9.9"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,500,700,400italic|Roboto+Mono:400"> <link rel="icon" href="/netlify-icon.svg" type="image/svg+xml"> <link rel="apple-touch-icon" href="/apple-touch-icon.png"> <link rel="icon" href="/favicon-32x32.png" type="image/png" sizes="32x32"> <link rel="icon" href="/favicon-16x16.png" type="image/png" sizes="16x16"> <script>(function (w) { if (!w) return; const darkQuery = w.matchMedia('(prefers-color-scheme: dark)'); const root = document.documentElement; function setTheme(newTheme) { if (newTheme === 'dark' || (newTheme === 'system' && darkQuery.matches)) { root.classList.add('dark-mode'); } else { root.classList.remove('dark-mode'); } w.__theme = newTheme; } w.__setPreferredTheme = function (newTheme) { setTheme(newTheme); try { localStorage.setItem('nf-docs-theme', w.__theme); } catch (err) {} }; // If using system theme, change colors in real time // in response to user settings darkQuery.addEventListener('change', function (event) { if (w.__theme === 'system') { if (event.matches) { root.classList.add('dark-mode'); } else { root.classList.remove('dark-mode'); } } }); let preferredTheme; // Try to get saved theme try { preferredTheme = localStorage.getItem('nf-docs-theme') || 'system'; } catch (err) {} // Initialize preferredTheme setTheme(preferredTheme); })(window);</script> <script src="/rum.js" data-application-id="ededf59a-7705-4933-b2a0-5efa8b35b293" data-client-token="pub1b84fc7c7429f37e025e8160c02da8bb" data-service="docs" data-env="production" defer="true"></script> <meta name="description" content="Install, configure, and manage plugins for our platform. Learn how Build Plugins expand your development options."> <meta property="og:title" content="Build Plugins"> <meta property="og:url" content="https://docs.netlify.com/build-plugins/"> <meta property="og:description" content="Install, configure, and manage plugins for our platform. Learn how Build Plugins expand your development options."> <meta property="og:image" content="https://docs.netlify.com/og-image.png"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta prefix="og: http://ogp.me/ns#" property="og:type" content="article"> <meta prefix="og: http://ogp.me/ns#" property="og:article:author" content="Netlify"> <meta name="google-site-verification" content="G4JqDTXMHpDyWoqIRwgw8PBqg-AncXqtdkHehcOR7kc"> <meta name="slack-app-id" content="A05P27DR8C8"> <link href="https://docs.netlify.com/build-plugins/" rel="canonical" /> <link rel="preload" href="/assets/css/0.styles.bebdbd1c.css" as="style"><link rel="preload" href="/assets/js/app.cc2f9ad6.js" as="script"><link rel="preload" href="/assets/js/10.a8fb7bb3.js" as="script"><link rel="preload" href="/assets/js/2.01499542.js" as="script"><link rel="preload" href="/assets/js/46.5ef779a2.js" as="script"><link rel="preload" href="/assets/js/9.ad446dfa.js" as="script"><link rel="preload" href="/assets/js/16.dc8f34ea.js" as="script"><link rel="preload" href="/assets/js/15.6d589b72.js" as="script"><link rel="preload" href="/assets/js/3.9ee141f4.js" as="script"> <link rel="stylesheet" href="/assets/css/0.styles.bebdbd1c.css"> </head> <body> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NMKKF2M" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar-header"><div class="navbar"><div class="navbar__logo-link"><a href="/" class="router-link-active"><span class="visuallyhidden">Netlify Docs</span> <svg width="146" height="40" viewBox="0 0 146 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="netlify-lockup" data-v-4ee6c329><path d="M22.794 39.79V29.687l.21-.21h2.526l.21.21V39.79l-.21.209h-2.527l-.209-.21ZM22.794 10.314V.21l.21-.209h2.526l.21.21v10.104l-.21.21h-2.527l-.209-.21ZM14.1 32.687h-.347l-1.738-1.738v-.347l3.256-3.26 1.84.004.245.242v1.84L14.1 32.686ZM12.015 9.49v-.35l1.738-1.735h.347l3.256 3.256v1.836l-.246.248h-1.839L12.015 9.49ZM.582 18.524h14.316l.21.21v2.53l-.21.209H.582l-.21-.21v-2.53l.21-.209Z" fill="var(--lockup-lines-fill)" data-v-4ee6c329></path> <path d="M29.005 25.265h-2.526l-.21-.21v-5.912c0-1.054-.412-1.869-1.682-1.895-.654-.016-1.4 0-2.199.033l-.12.12v7.651l-.21.21h-2.526l-.21-.21V14.948l.21-.21h5.684a3.998 3.998 0 0 1 3.998 3.999v6.315l-.21.21v.003ZM41.24 20.841l-.21.21H34.5l-.21.209c0 .422.423 1.685 2.108 1.685.631 0 1.263-.21 1.476-.631l.21-.21h2.525l.21.21c-.21 1.263-1.263 3.16-4.424 3.16-3.58 0-5.265-2.526-5.265-5.477 0-2.952 1.685-5.478 5.055-5.478 3.37 0 5.056 2.526 5.056 5.478v.844Zm-3.161-2.107c0-.21-.21-1.686-1.895-1.686s-1.895 1.476-1.895 1.686l.21.21h3.37l.21-.21ZM47.136 22.104c0 .422.21.632.632.632h1.895l.209.209v2.107l-.21.21h-1.894c-1.895 0-3.58-.845-3.58-3.161v-4.634l-.21-.21h-1.475l-.21-.209v-2.107l.21-.21h1.476l.21-.209v-1.894l.209-.21h2.526l.21.21v1.894l.209.21h2.316l.21.21v2.106l-.21.21h-2.316l-.21.21V22.1l.003.003ZM54.93 25.265h-2.525l-.21-.21V10.73l.21-.21h2.526l.21.21v14.322l-.21.21v.003ZM60.618 13.046h-2.526l-.21-.209V10.73l.21-.21h2.526l.21.21v2.107l-.21.21Zm0 12.22h-2.526l-.21-.21V14.944l.21-.21h2.526l.21.21v10.112l-.21.21ZM70.52 10.73v2.107l-.21.21h-1.894c-.422 0-.632.209-.632.631v.844l.21.21H70.1l.21.21v2.106l-.21.21h-2.107l-.21.21v7.581l-.21.21H65.05l-.21-.21v-7.582l-.21-.21h-1.475l-.21-.209v-2.107l.21-.21h1.476l.21-.209v-.844c0-2.317 1.684-3.161 3.58-3.161h1.894l.21.21-.004.003ZM78.311 25.474c-.844 2.108-1.685 3.37-4.633 3.37h-1.054l-.21-.209v-2.107l.21-.21h1.054c1.053 0 1.263-.209 1.475-.84v-.21l-3.37-8.216v-2.108l.21-.21h1.894l.21.21 2.526 7.163h.21l2.525-7.163.21-.21h1.894l.21.21v2.108l-3.37 8.426.01-.004Z" fill="var(--lockup-wordmark-fill)" data-v-4ee6c329></path> <path d="M94.699 25.205V10.707l-.213-.214H92.78l-.213.214v5.117h-.213c-.661-.853-1.706-1.28-2.772-1.28-2.985 0-4.69 2.346-4.69 5.544 0 3.198 1.705 5.543 4.69 5.543 1.13 0 2.132-.469 2.772-1.28h.213l.213.854.213.213h1.493l.213-.213Zm-2.132-5.117c0 2.558-1.066 3.624-2.772 3.624-1.705 0-2.771-1.258-2.771-3.624 0-2.367 1.066-3.625 2.771-3.625 1.706 0 2.772 1.066 2.772 3.625ZM96.614 20.088c0 3.411 1.918 5.543 5.117 5.543 3.198 0 5.117-2.132 5.117-5.543 0-3.412-1.919-5.544-5.117-5.544s-5.117 2.133-5.117 5.544Zm2.132 0c0-2.346 1.066-3.625 2.985-3.625 1.918 0 2.985 1.28 2.985 3.625 0 2.345-1.067 3.624-2.985 3.624-1.92 0-2.985-1.279-2.985-3.624ZM110.26 20.088c0-2.346 1.066-3.625 2.985-3.625 1.705 0 2.345.853 2.558 1.706l.213.213h1.706l.213-.213c-.213-1.919-1.706-3.625-4.69-3.625-3.199 0-5.117 2.133-5.117 5.544 0 3.411 1.918 5.543 5.117 5.543 2.984 0 4.477-1.706 4.69-3.624l-.213-.213h-1.706l-.213.213c-.213.852-.853 1.705-2.558 1.705-1.919 0-2.985-1.279-2.985-3.624ZM127.733 22.433c0-1.919-1.066-2.772-3.199-3.198-2.132-.426-2.984-.64-2.984-1.706 0-.852.852-1.066 1.918-1.066 1.493 0 1.919.64 1.919 1.28l.214.213h1.705l.213-.213c0-2.132-1.705-3.198-4.051-3.198-2.984 0-4.05 1.492-4.05 2.984 0 1.92 1.279 2.772 3.411 3.198 2.132.427 2.772.64 2.772 1.706 0 .853-.64 1.28-2.133 1.28-1.492 0-2.132-.64-2.132-1.706l-.213-.213h-1.705l-.214.213c0 2.345 1.493 3.624 4.264 3.624 2.985 0 4.265-1.492 4.265-3.198Z" fill="var(--lockup-secondary-text-fill)" data-v-4ee6c329></path> <path d="M131.138 18.524h14.316l.209.21v2.53l-.209.209h-14.316l-.21-.21v-2.53l.21-.209Z" fill="var(--lockup-lines-fill)" data-v-4ee6c329></path></svg></a></div> <div class="navbar__actions-wrapper"><form id="search-form" role="search" class="algolia-search-wrapper search-form"><label class="search-form__label"><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 32 32" class="search-form__label-icon-search"><path d="M20.571 15.143c0-4.411-3.589-8-8-8s-8 3.589-8 8 3.589 8 8 8 8-3.589 8-8zM29.714 30c0 1.25-1.036 2.286-2.286 2.286-0.607 0-1.196-0.25-1.607-0.679l-6.125-6.107c-2.089 1.446-4.589 2.214-7.125 2.214-6.946 0-12.571-5.625-12.571-12.571s5.625-12.571 12.571-12.571 12.571 5.625 12.571 12.571c0 2.536-0.768 5.036-2.214 7.125l6.125 6.125c0.411 0.411 0.661 1 0.661 1.607z" fill="rgba(175, 180, 182, 0.87)"></path></svg> <input id="algolia-search-input" placeholder="Search our docs by topic..." class="search-form__input"></label> <button tabindex="-1" type="reset" class="search-form__label-icon-close"><span class="visuallyhidden">Close search</span> <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 18 18"><g fill="#A3A9AC" transform="scale(-1 1) rotate(45 .571 -12.959)"><rect width="2.333" height="18.667" x="8.164" y=".003"></rect> <polygon points="8.164 .003 10.497 .003 10.497 18.67 8.164 18.67" transform="rotate(-90 9.33 9.336)"></polygon></g></svg></button> <div class="search-form__content-overlay"></div></form> <div class="navbar__right-actions"><a href="/ask-netlify/" aria-label="ask netlify" class="navbar__ask-netlify-link"><span class="navbar__ask-netlify-icon"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 44 44" class="wrapper__icon-ask-netlify"><path fill="currentColor" d="M18.77 23.56a1.8 1.8 0 1 1-3.6 0 1.8 1.8 0 0 1 3.6 0Zm8.26 1.8a1.8 1.8 0 1 0 0-3.6 1.8 1.8 0 0 0 0 3.6Zm-3.86-1.54.03.07v.38l-.03.07-.87 1.77-.12.09h-.32l-.13-.1-.9-1.76-.03-.07v-.38l.03-.07 1-.66h.31l1.03.66Z"></path> <path fill="currentColor" fill-rule="evenodd" d="M22.32 13C28.77 13 34 17.22 34 23.67a6.97 6.97 0 0 1-6.97 6.97H10v-6.97C10 17.22 15.23 13 21.68 13h.64ZM11.55 23.16a5.24 5.24 0 0 1 10.07-2.05h.76l.01-.03a5.24 5.24 0 0 1 10.06 2.08c0 2.65-2.13 5.17-4.53 5.23H16.5a5.24 5.24 0 0 1-4.95-5.23Z" clip-rule="evenodd"></path> <path fill="currentColor" d="m24.47 8.12.07-.16 1.16-.4.15.08.63 1.95-.4.82-.16.06-.82-.4-.63-1.95Zm9.88 3.27.16.06.48 1.13-.07.16-1.9.76-.85-.34-.07-.16.35-.85 1.9-.76ZM30.04 8l.16-.06 1.1.54.05.16-1.14 2.43-.87.3-.15-.08-.3-.86L30.04 8Z" class="ask-netlify-flair"></path></svg></span> <span class="navbar__ask-netlify-label">Ask Netlify</span></a> <div class="user-menu"> <button href="#menu" aria-label="menu" class="menu-trigger is-not-visible-mamabear"><svg viewBox="0 0 31 25" xmlns="http://www.w3.org/2000/svg" class="wrapper__icon-menu"><rect x="0.581177" y="0.71875" width="30" height="4" fill="currentcolor"></rect> <rect x="0.581177" y="10.7188" width="30" height="4" fill="currentcolor"></rect> <rect x="0.581177" y="20.7188" width="30" height="4" fill="currentcolor"></rect></svg></button> <nav aria-label="Netlify navigation" class="navbar__nav is-visible-mamabear navbar__authlinks" data-v-1733a580><div class="navbar__nav-list" data-v-1733a580><a href="https://app.netlify.com/login" rel="noopener noreferrer" class="navbar__nav-link" data-v-1733a580> Log in </a> <a href="https://app.netlify.com/signup" target="self" rel="noopener noreferrer" class="navbar__nav-link signup-button" data-v-1733a580> Sign up </a></div></nav></div></div></div></div></header> <main class="wrapper wrapper--main"><div class="wrapper__sidebar wrapper__navigation"><a class="button button--icon button--close is-not-visible-mamabear"><svg aria-hidden="true" width="24" height="24" viewBox="0 0 16 16" class="icon"><path d="M8,15 C4.13400675,15 1,11.8659932 1,8 C1,4.13400675 4.13400675,1 8,1 C11.8659932,1 15,4.13400675 15,8 C15,11.8659932 11.8659932,15 8,15 Z M10.44352,10.7233105 L10.4528296,10.7326201 L10.7326201,10.4528296 C11.0310632,10.1543865 11.0314986,9.66985171 10.7335912,9.37194437 L9.36507937,8.0034325 L10.7360526,6.63245928 C11.0344957,6.33401613 11.0349311,5.84948135 10.7370237,5.55157401 L10.448426,5.26297627 C10.1505186,4.96506892 9.66598387,4.96550426 9.36754072,5.26394741 L8.00589385,6.62559428 L6.63738198,5.25708241 C6.33947464,4.95917507 5.85493986,4.95961041 5.55649671,5.25805356 L5.26737991,5.54717036 C4.96893676,5.84561351 4.96850142,6.33014829 5.26640876,6.62805563 L6.62561103,7.9872579 L5.25463781,9.35823112 C4.95619466,9.65667427 4.95575932,10.141209 5.25366666,10.4391164 L5.5422644,10.7277141 C5.84017175,11.0256215 6.32470652,11.0251861 6.62314967,10.726743 L7.99412289,9.35576976 L9.36263476,10.7242816 C9.66054211,11.022189 10.1450769,11.0217536 10.44352,10.7233105 Z"></path></svg></a> <div aria-label="Docs" class="sidebar wrapper__sidebar-interior"><nav aria-label="Docs"><div><div class="sidebar__section"><span class="sidebar__section-label">Welcome</span> <ul class="sidebar__links"><li class="sidebar__link-item"><div><a href="/" aria-current="page" class="sidebar__link">Home</a></div></li><li class="sidebar__link-item"><div><a href="/get-started/" class="sidebar__link">Get started</a></div></li><li class="sidebar__link-item"><div><a href="/welcome/add-new-site/" class="sidebar__link">Add new site</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Get help </button>  </section></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Platform</span> <ul class="sidebar__links"><li class="sidebar__link-item"><div><a href="/platform/what-is-netlify/" class="sidebar__link">What is Netlify?</a></div></li><li class="sidebar__link-item"><div><a href="/platform/who-is-netlify-for/" class="sidebar__link">Who is Netlify for?</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Checklists </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> How we release </button>  </section></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Platform primitives</span> <ul class="sidebar__links"><li class="sidebar__link-item"><div><a href="/platform/primitives/" class="sidebar__link">Overview</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Functions </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Edge Functions </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Image CDN </button>  </section></li><li class="sidebar__link-item"><div><a href="/blobs/overview/" class="sidebar__link">Blobs</a></div></li><li class="sidebar__link-item"><div><a href="/platform/caching/" class="sidebar__link">Caching</a></div></li><li class="sidebar__link-item"><div><a href="/platform/dev-server/" class="sidebar__link">Dev Server</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Platform extensions </button>  </section></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Frameworks</span> <ul class="sidebar__links"><li class="sidebar__link-item"><div><a href="/frameworks/" class="sidebar__link">Overview</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Framework support </button>  </section></li><li class="sidebar__link-item"><div><a href="/frameworks/environment-variables/" class="sidebar__link">Use environment variables with frameworks</a></div></li><li class="sidebar__link-item"><div><a href="/frameworks-api/" class="sidebar__link">Frameworks API</a></div></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Developer tools</span> <ul class="sidebar__links"><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> CLI </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> API </button>  </section></li><li class="sidebar__link-item"><div><a href="/terraform-provider/" class="sidebar__link">Terraform Provider</a></div></li><li class="sidebar__link-item"><div><a href="https://developers.netlify.app/sdk/get-started/introduction/" target="_blank" rel="noopener noreferrer" class="sidebar__link">Netlify SDK</a></div></li><li class="sidebar__link-item"><div><a href="/welcome/command-palette/" class="sidebar__link">Command Palette</a></div></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Integrate & extend</span> <ul class="sidebar__links"><li class="sidebar__link-item"><div><a href="/integrations/overview/" class="sidebar__link">Overview</a></div></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Integrations </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button aria-expanded="true" tabIndex="-1" class="sidebar__group-heading open"> Build Plugins </button> <ul class="sidebar__links sidebar__group-items"><li class="sidebar__link-item"><div><a href="/build-plugins/" aria-current="page" class="active sidebar__link">Overview</a></div></li><li class="sidebar__link-item"><div><a href="/build-plugins/create-plugins/" class="sidebar__link">Create plugins</a></div></li><li class="sidebar__link-item"><div><a href="/build-plugins/share-plugins/" class="sidebar__link">Share plugins</a></div></li></ul> </section></li><li class="sidebar__link-item"><div><a href="/slack-app/" class="sidebar__link">Netlify App for Slack</a></div></li><li class="sidebar__link-item"><div><a href="/integrations/extend-netlify/" class="sidebar__link">Extend Netlify</a></div></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Configure & deploy site</span> <ul class="sidebar__links"><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Git </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Environment variables </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Configure builds </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Site deploys </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Domains & HTTPS </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Static routing </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Forms </button>  </section></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Visual editing</span> <ul class="sidebar__links"><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Visual Editor </button>  </section></li><li class="sidebar__link-item"><div><a href="/ai-assisted-publishing/" class="sidebar__link">AI-Assisted Publishing</a></div></li><li class="sidebar__link-item"><div><a href="https://visual-editor-reference.netlify.com/" target="_blank" rel="noopener noreferrer" class="sidebar__link">Visual editor reference</a></div></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Manage data</span> <ul class="sidebar__links"><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Connect </button>  </section></li></ul></div><div class="sidebar__section"><span class="sidebar__section-label">Site & team management</span> <ul class="sidebar__links"><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Accounts & billing </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Security </button>  </section></li><li class="sidebar__link-item"><section tabIndex="-1" class="sidebar__group collapsable is-sub-group"><button tabIndex="-1" class="sidebar__group-heading"> Monitor sites </button>  </section></li></ul></div></div></nav> <div aria-labelledby="#external-link__header" class="external-links" data-v-bad94b42><p id="external-link__header" class="external-links__header" data-v-bad94b42> Contact </p> <ul class="external-links__list" data-v-bad94b42><li class="external-links__item" data-v-bad94b42><a href="https://answers.netlify.com" target="_blank" rel="noopener noreferrer" class="external-links__link" data-v-bad94b42> Forums </a></li> <li class="external-links__item" data-v-bad94b42><a href="https://www.netlify.com/support/" target="_blank" rel="noopener noreferrer" class="external-links__link" data-v-bad94b42> Contact support </a></li></ul></div> <nav aria-label="Netlify navigation" class="navbar__nav is-visible-mamabear navbar__authlinks is-not-visible-mamabear" data-v-1733a580><div class="navbar__nav-list" data-v-1733a580><a href="https://app.netlify.com/login" rel="noopener noreferrer" class="navbar__nav-link" data-v-1733a580> Log in </a> <a href="https://app.netlify.com/signup" target="self" rel="noopener noreferrer" class="navbar__nav-link signup-button" data-v-1733a580> Sign up </a></div></nav></div></div> <div class="wrapper__sidebar wrapper__toc"><nav aria-label="On this page" data-toc="" class="contents wrapper__sidebar-interior"> <details><summary class="contents__header">On this page</summary> <ol><li><a href="/build-plugins/#install-a-plugin" data-slug="install-a-plugin">Install a plugin</a> <ul><li><a href="/build-plugins/#ui-installation" data-slug="ui-installation">UI installation</a> <ul></ul></li><li><a href="/build-plugins/#file-based-installation" data-slug="file-based-installation">File-based installation</a> <ul></ul></li><li><a href="/build-plugins/#automatic-installation" data-slug="automatic-installation">Automatic installation</a> </li></ul></li><li><a href="/build-plugins/#manage-plugin-versions" data-slug="manage-plugin-versions">Manage plugin versions</a> </li><li><a href="/build-plugins/#remove-a-plugin" data-slug="remove-a-plugin">Remove a plugin</a> </li><li><a href="/build-plugins/#create-a-plugin" data-slug="create-a-plugin">Create a plugin</a> </li><li><a href="/build-plugins/#get-help" data-slug="get-help">Get help</a> </li><li><a href="/build-plugins/#more-build-plugins-resources" data-slug="more-build-plugins-resources">More Build Plugins resources</a> </li></ol></details></nav></div> <section class="wrapper__content"><header class="content__default"><div class="wrapper__breadcrumbs"><span class="breadcrumb__item"><span>Integrate & extend</span> <span class="breadcrumb__break">/</span></span><span class="breadcrumb__item"><span>Build Plugins</span> <span class="breadcrumb__break">/</span></span></div> <h1>Build Plugins</h1></header> <div class="content__default"><p>Netlify Build Plugins extend the functionality of the Netlify Build process. You can <a href="#install-a-plugin">install plugins</a> made by others, or <a href="/build-plugins/create-plugins/">write your own</a>. You can <a href="/build-plugins/create-plugins/#local-plugins">save them locally</a> in your repository, or <a href="/build-plugins/share-plugins/">share them with others</a>.</p> <p>Build Plugins expand what your Netlify builds are capable of. For example, you can use plugins to:</p> <ul><li>speed up builds by optimizing and debugging your build cache</li> <li>import and convert data from external sources</li> <li>check for broken links in a site after building</li> <li>analyze and optimize site asset handling for better runtime performance</li> <li>generate content like sitemaps, RSS feeds, and search indexes</li></ul> <h2 id="install-a-plugin"><a href="#install-a-plugin" class="header-anchor">#</a> Install a plugin</h2> <p>To get a sampling of what plugins can do, navigate to <div aria-label="Navigation path" class="nav-path-container"><strong>Site configuration <span aria-hidden="true">></span> Build & deploy <span aria-hidden="true">></span> Build plugins</strong></div> for your site. You’ll find different types of plugins, including plugins from our partners and plugins from the community. Plugins can be <a href="#ui-installation">installed directly from the Netlify UI</a>. They can also be <a href="#file-based-installation">installed using the Netlify configuration file</a>, which allows more configuration options. Netlify <a href="#automatic-installation">automatically installs</a> plugins or runtimes recommended for certain frontend frameworks when you link a repository for a new site.</p> <div class="custom-block netlify-note"><p class="custom-block-title">Use a compatible Node.js version</p> <p>For optimum compatibility while developing or running plugins, we recommend using the <a href="/configure-builds/available-software-at-build-time/">default version</a> of Node.js installed by Netlify. However, you can also <a href="/configure-builds/manage-dependencies/#node-js-and-javascript">specify a different version</a> for your project’s setup, if needed.</p></div> <div id="legacy-build-image" class="legacy-anchor"></div> <h3 id="ui-installation"><a href="#ui-installation" class="header-anchor">#</a> UI installation</h3> <ol><li>In the Netlify UI, navigate to <div aria-label="Navigation path" class="nav-path-container"><strong>Site configuration <span aria-hidden="true">></span> Build & deploy <span aria-hidden="true">></span> Build plugins</strong></div> for your site.</li> <li>Search or browse for the plugin you want.</li> <li>Select <strong>Enable</strong>.</li> <li>Follow the installation guidance in the Netlify UI to install the plugin on a site. You may be prompted to add <a href="/configure-builds/environment-variables/">build environment variables</a> required by the plugin.</li> <li>To use your new plugin, visit the <strong>Deploys</strong> tab for your site and select <strong>Trigger deploy</strong>.</li></ol> <div class="custom-block netlify-tip"><p class="custom-block-title">Consider the context</p> <p>UI-installed plugins run in all <a href="/site-deploys/overview/#deploy-contexts">deploy contexts</a>. To limit the context for the plugin, consider using <a href="#file-based-installation">file-based installation</a> instead.</p></div> <h4 id="required-environment-variables"><a href="#required-environment-variables" class="header-anchor">#</a> Required environment variables</h4> <p>Though many plugins listed in the Netlify UI require no configuration for default operation, some may require you to set one or more <a href="/configure-builds/environment-variables/">build environment variables</a> for your site during or after installation. Refer to the plugin’s documentation, linked from <strong>Options</strong> menu in the plugin’s listing.</p> <h3 id="file-based-installation"><a href="#file-based-installation" class="header-anchor">#</a> File-based installation</h3> <p>File-based plugin installation allows advanced plugin configuration.</p> <p>You can use file-based installation for either of the following:</p> <ul><li>installing <a href="/build-plugins/create-plugins/#local-plugins">local plugins</a> that you write and store in your repository</li> <li>accessing a wide selection of plugins published by the community on <a href="https://www.npmjs.com/search?q=netlify-plugin" target="_blank" rel="noopener noreferrer">npm</a></li></ul> <p>In both cases, you <a href="#configure-settings">configure settings</a> in <code>netlify.toml</code>. For a plugin published to npm, you also <a href="#add-dependency">add it as a dependency</a>. Then you can <a href="#run-and-test">test or run</a> the plugin as part of a build.</p> <h4 id="configure-settings"><a href="#configure-settings" class="header-anchor">#</a> Configure settings</h4> <p>To run a plugin during your build, add it to a <a href="/configure-builds/file-based-configuration/">Netlify configuration file</a> stored in your site’s <a href="/configure-builds/overview/#definitions-1">base directory</a>. A plugin configured globally with <code>[[plugins]]</code> runs in all <a href="/site-deploys/overview/#deploy-contexts">deploy contexts</a>, but you can also <a href="#configure-by-deploy-context">configure a plugin by deploy context</a>.</p> <p>Here’s a sample configuration with two plugins installed in all deploy contexts.</p> <div class="language-toml extra-class"><pre class="language-toml"><code><span class="token comment"># Configuration for a plugin published to npm</span> <span class="token punctuation">[</span><span class="token punctuation">[</span><span class="token table class-name">plugins</span><span class="token punctuation">]</span><span class="token punctuation">]</span> <span class="token key property">package</span> <span class="token punctuation">=</span> <span class="token string">"netlify-plugin-lighthouse"</span> <span class="token punctuation">[</span><span class="token table class-name">plugins.inputs</span><span class="token punctuation">]</span> <span class="token key property">output_path</span> <span class="token punctuation">=</span> <span class="token string">"reports/lighthouse.html"</span> <span class="token comment"># Configuration for a local plugin</span> <span class="token punctuation">[</span><span class="token punctuation">[</span><span class="token table class-name">plugins</span><span class="token punctuation">]</span><span class="token punctuation">]</span> <span class="token key property">package</span> <span class="token punctuation">=</span> <span class="token string">"/plugins/netlify-plugin-hello-world"</span> </code></pre></div><p>Each <code>[[plugins]]</code> entry accepts two keys:</p> <ul><li><strong><code>package</code></strong> (required)<strong>:</strong> <ul><li>for a plugin installed from npm, the npm package name of the plugin.</li> <li>for a <a href="/build-plugins/create-plugins/#local-plugins">local plugin</a>, the absolute path to a directory containing the plugin’s <code>index.js</code> and <code>manifest.yml</code> files. The <code>package</code> value for a local plugin must start with <code>.</code> or <code>/</code>.</li></ul></li> <li><strong><code>inputs</code>:</strong> custom settings that the plugin author may specify as required or available for configuring the plugin. To specify <code>inputs</code> per deploy context, refer to <a href="#configure-by-deploy-context">configure by deploy context</a>.</li></ul> <p>For npm-published plugins, you can find these details in each plugin’s package documentation on the <a href="https://www.npmjs.com/" target="_blank" rel="noopener noreferrer">npm Public Registry</a>.</p> <div class="custom-block netlify-tip"><p class="custom-block-title">Sometimes order matters</p> <p>Different plugins run during different stages of your build. When multiple plugins are set to run in the same stage, they will run in the order they are listed in the Netlify configuration file. An npm-published plugin’s README should indicate if order is important to that plugin’s functionality.</p></div> <h5 id="configure-by-deploy-context"><a href="#configure-by-deploy-context" class="header-anchor">#</a> Configure by deploy context</h5> <p>Using specific settings in your Netlify configuration file, you can limit a build plugin to run in a certain <a href="/site-deploys/overview/#deploy-contexts">deploy context</a> only, or you can configure a plugin’s <code>inputs</code> settings differently per context.</p> <p>Here’s an example configuration that runs the Sitemap plugin in the context of production deploys only.</p> <div class="language-toml extra-class"><pre class="language-toml"><code><span class="token comment"># Use double brackets since `plugins` is an array of tables.</span> <span class="token punctuation">[</span><span class="token punctuation">[</span><span class="token table class-name">context.production.plugins</span><span class="token punctuation">]</span><span class="token punctuation">]</span> <span class="token key property">package</span> <span class="token punctuation">=</span> <span class="token string">"@netlify/plugin-sitemap"</span> </code></pre></div><p>And here’s an example configuration that runs the Cypress plugin differently based on deploy contexts.</p> <div class="language-toml extra-class"><pre class="language-toml"><code><span class="token comment"># Use Cypress plugin for this site.</span> <span class="token comment"># This section, by itself, configures the plugin</span> <span class="token comment"># for all deploy contexts (production, branch deploys, Deploy Previews).</span> <span class="token punctuation">[</span><span class="token punctuation">[</span><span class="token table class-name">plugins</span><span class="token punctuation">]</span><span class="token punctuation">]</span> <span class="token key property">package</span> <span class="token punctuation">=</span> <span class="token string">"netlify-plugin-cypress"</span> <span class="token punctuation">[</span><span class="token table class-name">plugins.inputs</span><span class="token punctuation">]</span> <span class="token key property">record</span> <span class="token punctuation">=</span> <span class="token boolean">true</span> <span class="token comment"># Don’t record Cypress tests in Deploy Previews.</span> <span class="token comment"># Since this entry is more specific, it overrides the entry above.</span> <span class="token comment"># `context.deploy-preview.plugins` and `package` must be included.</span> <span class="token punctuation">[</span><span class="token punctuation">[</span><span class="token table class-name">context.deploy-preview.plugins</span><span class="token punctuation">]</span><span class="token punctuation">]</span> <span class="token key property">package</span> <span class="token punctuation">=</span> <span class="token string">"netlify-plugin-cypress"</span> <span class="token comment"># Use single brackets since `inputs` is an object property</span> <span class="token punctuation">[</span><span class="token table class-name">context.deploy-preview.plugins.inputs</span><span class="token punctuation">]</span> <span class="token key property">record</span> <span class="token punctuation">=</span> <span class="token boolean">false</span> </code></pre></div><p>This configuration records test results and artifacts on the Cypress Dashboard for production and branch deploys only, not Deploy Previews.</p> <div class="custom-block netlify-tip"><p class="custom-block-title">UI-installed plugins run on all contexts</p> <p>To limit a plugin to certain deploy contexts, ensure that you’ve configured the plugin for your site using file-based installation only and not UI installation.</p></div> <h5 id="next-steps"><a href="#next-steps" class="header-anchor">#</a> Next steps</h5> <p>If you’re installing a local plugin, you can <a href="#run-and-test">run and test it</a> after configuration. Otherwise, you’ll <a href="#add-dependency">add a dependency</a> to <code>package.json</code>.</p> <h4 id="add-dependency"><a href="#add-dependency" class="header-anchor">#</a> Add dependency</h4> <p>For a plugin from npm, there’s an additional step beyond editing the Netlify configuration file. You must use <a href="https://docs.npmjs.com/specifying-dependencies-and-devdependencies-in-a-package-json-file" target="_blank" rel="noopener noreferrer">npm</a>, <a href="https://classic.yarnpkg.com/en/docs/cli/add/" target="_blank" rel="noopener noreferrer">yarn</a>, or another Node.js package manager to add the plugin to <code>devDependencies</code> in your site’s <code>package.json</code>.</p> <div class="custom-block netlify-warning"><p class="custom-block-title">Evaluate the plugin code</p> <p>Plugins available on npm but not yet listed in the Netlify UI have not been reviewed or approved by Netlify staff. We strongly recommend you review the plugin code and author for security concerns before installing.</p></div> <p>From your project’s base directory, use a command like this to add the dependency:</p> <div class="theme-code-group" data-v-5f0a03e0><div class="theme-code-group__nav" data-v-5f0a03e0><ul role="tablist" class="theme-code-group__ul" data-v-5f0a03e0><li class="theme-code-group__li" data-v-5f0a03e0><button class="theme-code-group__nav-tab" data-v-5f0a03e0> Loading error: Refresh the page to access this code sample </button></li></ul></div> <div role="tabpanel" id="npm-tab" tabindex="0" class="theme-code-block" data-v-12d54b40><div class="language-bash extra-class" data-v-12d54b40><pre class="language-bash" data-v-12d54b40><code data-v-12d54b40><span class="token comment" data-v-12d54b40># Replace `BUILD_PLUGIN_NAME` with a real plugin name, </span> <span class="token comment" data-v-12d54b40># like `netlify-plugin-lighthouse`</span> <span class="token function" data-v-12d54b40>npm</span> <span class="token function" data-v-12d54b40>install</span> <span class="token parameter variable" data-v-12d54b40>-D</span> BUILD_PLUGIN_NAME </code></pre></div></div> <div role="tabpanel" id="yarn-tab" tabindex="0" class="theme-code-block" data-v-12d54b40><div class="language-bash extra-class" data-v-12d54b40><pre class="language-bash" data-v-12d54b40><code data-v-12d54b40><span class="token comment" data-v-12d54b40># Replace `BUILD_PLUGIN_NAME` with a real plugin name, </span> <span class="token comment" data-v-12d54b40># like `netlify-plugin-lighthouse`</span> <span class="token function" data-v-12d54b40>yarn</span> <span class="token function" data-v-12d54b40>add</span> <span class="token parameter variable" data-v-12d54b40>-D</span> BUILD_PLUGIN_NAME </code></pre></div></div></div> <h4 id="run-and-test"><a href="#run-and-test" class="header-anchor">#</a> Run and test</h4> <p>When you save your changes to your repository and push them to your Git provider, the build that’s triggered on Netlify will run with plugins installed for that deploy context. If you would like to test a plugin before running it in a production build, you can use a <a href="/site-deploys/overview/#branches-and-deploys">branch deploy or Deploy Preview</a>, or you can <a href="/cli/get-started/#run-builds-locally">run the build locally with Netlify CLI</a>.</p> <h3 id="automatic-installation"><a href="#automatic-installation" class="header-anchor">#</a> Automatic installation</h3> <p>When you link a repository for a new site, Netlify runs a <a href="https://github.com/netlify/build/tree/main/packages/framework-info" target="_blank" rel="noopener noreferrer">framework detection utility</a> to determine whether your site uses a particular frontend framework. Certain frameworks have recommended Build Plugins or runtimes. These help extend the functionality of the Netlify Build process to support key framework-specific features. Recommended plugins and runtimes may have site conditions requirements, such as a minimum Node.js version.</p> <p>If your new site uses a framework with recommended plugins or runtimes, Netlify checks whether these are already <a href="#file-based-installation">installed in a Netlify configuration file</a>. If not, Netlify automatically installs them. These automatically installed plugins run in all deploy contexts.</p> <p>For an existing site that’s already linked to Netlify, you can choose to install framework-specific recommended plugins yourself.</p> <h2 id="manage-plugin-versions"><a href="#manage-plugin-versions" class="header-anchor">#</a> Manage plugin versions</h2> <p>Netlify encourages plugin authors to regularly update functionality and release new versions using <a href="https://docs.npmjs.com/about-semantic-versioning" target="_blank" rel="noopener noreferrer">semantic versioning</a>. Minor plugin version updates introduce only backward compatible new features, while major plugin version updates can introduce breaking changes. Refer to the plugin’s changelog, linked from the <strong>Options</strong> menu for the plugin listing in the Netlify UI, for version details.</p> <p>The steps for managing plugin versions for your site depend on the plugin installation method.</p> <p>For plugins <a href="#ui-installation">installed in the UI</a> or <a href="#automatic-installation">installed automatically</a>, Netlify updates your site for minor plugin version releases automatically. To manage major plugin updates for a site, take the following steps:</p> <ol><li>Navigate to <div aria-label="Navigation path" class="nav-path-container"><strong>Site configuration <span aria-hidden="true">></span> Build & deploy <span aria-hidden="true">></span> Build plugins</strong></div> for your site.</li> <li>Search or browse to find the plugin you want to manage.</li> <li>Select <div aria-label="Navigation path" class="nav-path-container"><strong>Options <span aria-hidden="true">></span> Change version</strong></div>.</li> <li>Select the desired major version.</li> <li>Select <strong>Change version</strong> to save.</li></ol> <p>Subsequent builds will use the plugin version that you’ve chosen and confirmed.</p> <p>For plugins <a href="#file-based-installation">installed through file-based installation</a>, you can <a href="https://docs.npmjs.com/about-semantic-versioning#using-semantic-versioning-to-specify-update-types-your-package-can-accept" target="_blank" rel="noopener noreferrer">manage versions</a> in your site’s <code>package.json</code> file under <code>devDependencies</code>.</p> <h2 id="remove-a-plugin"><a href="#remove-a-plugin" class="header-anchor">#</a> Remove a plugin</h2> <p>The steps for removing a plugin depend on how it was installed or whether it is an Essential Gatsby or Next.js Runtime plugin.</p> <p>For plugins <a href="#ui-installation">installed in the UI</a> or <a href="#automatic-installation">installed automatically</a>:</p> <ol><li><p>For your selected site, go to <div aria-label="Navigation path" class="nav-path-container"><strong>Site configuration <span aria-hidden="true">></span> Build & deploy <span aria-hidden="true">></span> Build plugins</strong></div>.</p></li> <li><p>Find the plugin you want to remove.</p></li> <li><p>In the plugin’s card select <strong>Disable</strong>.</p> <p>Subsequent builds will not use the uninstalled plugin and environment variables entered for this integration <strong>will not be deleted</strong>.</p></li></ol> <p>For plugins <a href="#file-based-installation">installed through file-based installation</a>:</p> <ol><li><p>Open your site’s <code>netlify.toml</code>.</p></li> <li><p>Delete or comment out the plugin’s configuration fields.</p> <p>When you push your committed changes, the resulting build will run without the plugin. If you’re removing an npm-published plugin and want to avoid installing code you won’t use, you can <a href="https://docs.npmjs.com/uninstalling-packages-and-dependencies" target="_blank" rel="noopener noreferrer">uninstall the plugin package using npm</a>.</p></li></ol> <div class="custom-block netlify-tip"><p class="custom-block-title">Plugin not uninstalling correctly? Check for conflicting configurations</p> <p>It’s possible to configure a plugin both in the Netlify UI and your site’s <code>netlify.toml</code> — though the configuration file takes precedence. If you follow the above steps to remove a plugin from <code>netlify.toml</code> and the plugin is still installed, make sure it’s not also configured in the Netlify UI, and vice versa. Removing the plugin from one does not automatically remove it from the other.</p></div> <p>For the <a href="/frameworks/gatsby/?gatsby-version=essential#essential-gatsby-build-plugin">Essential Gatsby</a> and <a href="/frameworks/next-js/runtime-v4/overview/#next-js-runtime-v4">Next.js Runtime v4</a> plugins:</p> <ol><li>For your selected site, go to <div aria-label="Navigation path" class="nav-path-container"><strong>Site configuration <span aria-hidden="true">></span> Build & deploy</strong></div>.</li> <li>In <strong>Build settings</strong>, find your plugin in the <strong>Runtime</strong> field and select <strong>Remove</strong>.</li></ol> <div id="create-your-own" class="legacy-anchor"></div> <h2 id="create-a-plugin"><a href="#create-a-plugin" class="header-anchor">#</a> Create a plugin</h2> <p>Once you’ve had a chance to try out plugins, you may want to make one of your own. To learn how, visit the <a href="/build-plugins/create-plugins/">create plugins doc</a>.</p> <div class="custom-block netlify-tip"><p class="custom-block-title">A new way to build deep integrations and extensions</p> <p>Visit the <a href="https://developers.netlify.app/sdk/get-started/introduction/" target="_blank" rel="noopener noreferrer">Netlify SDK docs</a> to learn about new tools and options for extending and integrating with Netlify. With the SDK, you can make an extension that interacts with more parts of the Netlify platform than a build plugin can. This new toolset also provides a streamlined experience for both developers and users.</p></div> <h2 id="get-help"><a href="#get-help" class="header-anchor">#</a> Get help</h2> <p>Netlify Build Plugins are created by our partners and developers at Netlify and in the community. If you need help with a plugin, contact the plugin author by submitting an issue on the plugin repository. For plugins in the Netlify UI, you can find a link to the plugin issues under the <strong>Options</strong> menu for the plugin listing. If a plugin author doesn’t respond to an issue within a week, you can <a href="https://github.com/netlify/plugins/issues/new" target="_blank" rel="noopener noreferrer">request deactivation</a> of the plugin from the Netlify UI.</p> <p>For more general questions, or to discuss Build Plugins with other members of the community, visit the <a href="https://answers.netlify.com/c/netlify-support/build-plugins/49" target="_blank" rel="noopener noreferrer">Netlify Support Forums</a>.</p> <h2 id="more-build-plugins-resources"><a href="#more-build-plugins-resources" class="header-anchor">#</a> More Build Plugins resources</h2> <ul><li><a href="/build-plugins/create-plugins/">Create Build Plugins</a> using <a href="/build-plugins/create-plugins/#plug-in-to-build-events">build events</a></li> <li><a href="/build-plugins/share-plugins/">Share Build Plugins</a></li> <li><a href="/blobs/overview/">Use the Netlify Blobs API in a build plugin</a></li></ul></div>  <div class="content__default wrapper__last_updated has_page_nav"><time datetime="2024-10-02"> Last updated: October 2, 2024 </time></div> <div class="footer-page-nav"><p class="inner"> <span class="next"><a href="/build-plugins/create-plugins/"> Create Build Plugins </a> → </span></p></div> <div class="feedback"><div class="media"><div class="media__body"><h4 class="media__title"> Did you find this doc useful? </h4>  <p class="media__copy"> Your feedback helps us improve our docs. </p>  </div> <div class="media__figure"><button aria-label="upvote" class="feedback__vote feedback__vote--upvote"><svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" aria-hidden="true"><g fill="none" fill-rule="evenodd"><circle cx="32" cy="32" r="32" fill="none" fill-rule="nonzero"></circle> <g stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M40 29h-7.645l1.473-3.889c.377-.996.042-2.135-.803-2.73-.963-.679-2.263-.427-2.936.569L26 29v9a4 4 0 0 0 4 4h6.517c1.51 0 2.893-.852 3.573-2.203L42 36v-5a2 2 0 0 0-2-2zM22 29v12"></path></g></g></svg></button><button aria-label="downvote" class="feedback__vote feedback__vote--downvote"><svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" aria-hidden="true"><g fill="none" fill-rule="evenodd"><circle cx="32" cy="32" r="32" fill="none" fill-rule="nonzero"></circle> <g stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M23 35h7.645l-1.473 3.889c-.377.996-.042 2.135.803 2.73.963.679 2.263.427 2.936-.569l4.09-6.05v-9a4 4 0 0 0-4-4h-6.518c-1.51 0-2.893.852-3.573 2.202L21 28v5a2 2 0 0 0 2 2zM41 35V23"></path></g></g></svg></button></div></div> <div><form class='form form--floating-labels feedback__form--appear' method='post' name='feedback'><input type="hidden" name="form-name" value="feedback"> <input type="hidden" name="path" value="/build-plugins/"> <input type="hidden" name="vote" value=""> <label class="visuallyhidden"> Do not fill in this field <input name="verification" value=""></label> <div class="form__field"><label><div class="form__label"> What else would you like to tell us about this doc? </div> <textarea name="feedback" class="form__textarea"></textarea></label></div> <div class="btn-group"><button disabled="disabled" class="btn"> Send </button></div></form></div></div> <footer class="footer"><div class="footer-wrapper"><nav aria-label="Footer navigation" class="footer-nav"><ul class="footer__nav"><li class="footer__nav-item"><a href="https://netlify.com/" class="footer__nav-link"> Netlify </a></li> <li class="footer__nav-item"><a href="https://netlify.com/careers/" class="footer__nav-link"> Careers </a></li> <li class="footer__nav-item"><a href="https://netlify.com/blog/" class="footer__nav-link"> Blog </a></li> <li class="footer__nav-item"><a href="https://www.netlify.com/legal/terms-of-use/" class="footer__nav-link"> Terms </a></li> <li class="footer__nav-item"><a href="https://www.netlify.com/privacy/" class="footer__nav-link"> Privacy </a></li></ul></nav> <div class="dark-mode-widget footer__theme-toggle" data-v-0d17f8d5><label for="theme-select" class="visuallyhidden" data-v-0d17f8d5>Select a theme</label> <div class="forms-select-c" data-v-0d17f8d5><div class="theme-toggle-icon" data-v-0d17f8d5><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg" data-v-0d17f8d5><path fill-rule="evenodd" clip-rule="evenodd" d="M14 7C14 10.866 10.866 14 7 14C3.13401 14 0 10.866 0 7C0 3.13401 3.13401 0 7 0C10.866 0 14 3.13401 14 7ZM7 12.2C6.99999 12.2 7.00001 12.2 7 12.2C4.12812 12.2 1.8 9.87188 1.8 7C1.8 4.12812 4.12812 1.8 7 1.8C7.00001 1.8 6.99999 1.8 7 1.8V12.2Z" fill="currentColor"></path></svg>  </div> <select value="system" name="theme-select" id="theme-select" class="forms-input"> <option value="system" data-v-0d17f8d5>System</option><option value="light" data-v-0d17f8d5>Light</option><option value="dark" data-v-0d17f8d5>Dark</option></select> <svg width="21" height="13" viewBox="0 0 21 13" fill="none" xmlns="http://www.w3.org/2000/svg" class="icon-arrow-down forms-select-c-arrow"><path d="M20.7656 1.82812C21.0156 2.10938 21.0156 2.375 20.7656 2.625L10.9219 12.4688C10.6719 12.7188 10.4219 12.7188 10.1719 12.4688L0.328125 2.625C0.078125 2.375 0.078125 2.10938 0.328125 1.82812L1.26562 0.9375C1.51562 0.65625 1.78125 0.65625 2.0625 0.9375L10.5469 9.375L19.0312 0.9375C19.3125 0.65625 19.5781 0.65625 19.8281 0.9375L20.7656 1.82812Z"></path></svg></div></div></div> <p class="footer__copyright">© 2024 Netlify</p></footer></section></main></div><div class="global-ui"></div></div> <script src="/assets/js/app.cc2f9ad6.js" defer></script><script src="/assets/js/10.a8fb7bb3.js" defer></script><script src="/assets/js/2.01499542.js" defer></script><script src="/assets/js/46.5ef779a2.js" defer></script><script src="/assets/js/9.ad446dfa.js" defer></script><script src="/assets/js/16.dc8f34ea.js" defer></script><script src="/assets/js/15.6d589b72.js" defer></script><script src="/assets/js/3.9ee141f4.js" defer></script> <script src="/netlify-cnm/cnm.js" async defer></script> <script async id="netlify-rum-container" src="/.netlify/scripts/rum" data-netlify-rum-site-id="90a54386-9477-4113-bd6a-b9227b573d00" data-netlify-deploy-branch="main" data-netlify-deploy-context="production" data-netlify-cwv-token="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzaXRlX2lkIjoiOTBhNTQzODYtOTQ3Ny00MTEzLWJkNmEtYjkyMjdiNTczZDAwIiwiYWNjb3VudF9pZCI6IjU4ZGE4ODkzZDY4NjVkMzVjOTJhNzJiOCIsImRlcGxveV9pZCI6IjY3NDYyNTk0MTY2YmQ1MDAwOGJkMjJiOCIsImlzc3VlciI6Im5mc2VydmVyIn0.5JYS7P1qEHDOiNJnm4w671aLfC1I2tJgug7qA8UN6IM"></script><script type="text/javascript"> if (window.location.host === "docs.netlify.com") { !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.src="https://cdn.segment.com/analytics.js/v1/" + key + "/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._loadOptions=e};analytics.SNIPPET_VERSION="4.13.1"; analytics.load("kjz0qkJslzzHMcNGI3GkDb9HDZ6vspYZ"); }}(); } </script></body> </html>