{"_path":"/getting-started/setup","_draft":false,"_partial":false,"_empty":false,"title":"Setup","description":"Learn how to setup newsletter module in your Nuxt 3 application.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/docs/directory-structure/nuxt.config#buildmodules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3 documentation"}]},{"type":"text","value":" for more information about installing and using modules."}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt-newsletter"}]},{"type":"text","value":" dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add nuxt-newsletter\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"yarn add nuxt-newsletter\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install nuxt-newsletter --save\n","filename":"NPM","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npm install nuxt-newsletter --save\n"}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt-newsletter"}]},{"type":"text","value":" to the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/api/configuration/nuxt.config#modules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]}]},{"type":"text","value":" section of your Nuxt configuration:"}]},{"type":"element","tag":"code","props":{"code":"export default defineNuxtConfig({\n  modules: [\n    [\n      \"nuxt-newsletter\",\n      {\n        // Options\n      },\n    ],\n  ],\n  // Or\n  newsletter: {\n    // Options\n  },\n});\n","filename":"nuxt.config.js|ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export default defineNuxtConfig({\n  modules: [\n    [\n      \"nuxt-newsletter\",\n      {\n        // Options\n      },\n    ],\n  ],\n  // Or\n  newsletter: {\n    // Options\n  },\n});\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Defaults:"}]},{"type":"element","tag":"code","props":{"code":"{\n  <NEWSLETTER_PROVIDER>: {\n    apiKey: process.env.BUTTONDOWN_API_KEY,\n    component: true\n  },\n}\n","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n  <NEWSLETTER_PROVIDER>: {\n    apiKey: process.env.BUTTONDOWN_API_KEY,\n    component: true\n  },\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"apikey"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"apiKey"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"API Key that will allow the module to communicate with the newsletter API"}]},{"type":"element","tag":"h3","props":{"id":"component"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"component"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If set to true, it will automatically import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"NewsletterForm.vue"}]},{"type":"text","value":" component."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/docs/directory-structure/nuxt.config#buildmodules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3 documentation"}]},{"type":"text","value":" for more information about installing and using modules."}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt-newsletter"}]},{"type":"text","value":" dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add nuxt-newsletter\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"yarn add nuxt-newsletter"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install nuxt-newsletter --save\n","filename":"NPM","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"npm install nuxt-newsletter --save"}]}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt-newsletter"}]},{"type":"text","value":" to the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/api/configuration/nuxt.config#modules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]}]},{"type":"text","value":" section of your Nuxt configuration:"}]},{"type":"element","tag":"code","props":{"code":"export default defineNuxtConfig({\n  modules: [\n    [\n      \"nuxt-newsletter\",\n      {\n        // Options\n      },\n    ],\n  ],\n  // Or\n  newsletter: {\n    // Options\n  },\n});\n","filename":"nuxt.config.js|ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-cee462"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-cee462"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-11a4e1"},"children":[{"type":"text","value":"defineNuxtConfig"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1f7f"},"children":[{"type":"text","value":"modules"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":": ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"    ["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"      "}]},{"type":"element","tag":"span","props":{"class":"ct-27c876"},"children":[{"type":"text","value":"\"nuxt-newsletter\""}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"      {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"        "}]},{"type":"element","tag":"span","props":{"class":"ct-f3f647"},"children":[{"type":"text","value":"// Options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"      },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"    ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  ],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-f3f647"},"children":[{"type":"text","value":"// Or"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1f7f"},"children":[{"type":"text","value":"newsletter"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-f3f647"},"children":[{"type":"text","value":"// Options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Defaults:"}]},{"type":"element","tag":"code","props":{"code":"{\n  <NEWSLETTER_PROVIDER>: {\n    apiKey: process.env.BUTTONDOWN_API_KEY,\n    component: true\n  },\n}\n","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  <"}]},{"type":"element","tag":"span","props":{"class":"ct-0ef5d7"},"children":[{"type":"text","value":"NEWSLETTER_PROVIDER"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":">: {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1f7f"},"children":[{"type":"text","value":"apiKey"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-0ef5d7"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-0ef5d7"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-3e1f7f"},"children":[{"type":"text","value":"BUTTONDOWN_API_KEY"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-3e1f7f"},"children":[{"type":"text","value":"component"}]},{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"class":"ct-cafbe2"},"children":[{"type":"text","value":"true"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"  },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-21dbde"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"apikey"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"apiKey"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"API Key that will allow the module to communicate with the newsletter API"}]},{"type":"element","tag":"h3","props":{"id":"component"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"component"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If set to true, it will automatically import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"NewsletterForm.vue"}]},{"type":"text","value":" component."}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-cafbe2{color:#D19A66}.ct-0ef5d7{color:#E5C07B}.ct-f3f647{color:#7F848E}.ct-27c876{color:#98C379}.ct-3e1f7f{color:#E06C75}.ct-11a4e1{color:#61AFEF}.ct-cee462{color:#C678DD}.ct-21dbde{color:#ABB2BF}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"installation","depth":2,"text":"Installation"},{"id":"options","depth":2,"text":"Options","children":[{"id":"apikey","depth":3,"text":"apiKey"},{"id":"component","depth":3,"text":"component"}]}]}},"_type":"markdown","_id":"content:1.getting-started:1.setup.md","_source":"content","_file":"1.getting-started/1.setup.md","_extension":"md"}