gatsby-plugin-mailchimp icon indicating copy to clipboard operation
gatsby-plugin-mailchimp copied to clipboard

_GATSBY_PLUGIN_MAILCHIMP_ADDRESS__ is not defined

Open isaacsultan opened this issue 5 years ago • 15 comments

System details

  • node v8.9.3
  • npm 6.5.0
  • gatsby: "^2.13.23"
  • gatsby-plugin-mailchimp: "^5.1.2",

Usage

The endpoint is defined in gatsby-config.js as:

{
      resolve: 'gatsby-plugin-mailchimp',
      options: {
        endpoint: `https://gmail.us3.list-manage.com/subscribe/post?u=X&id=Y`, 
      }
    }

And called:

const IndexPage = props => {
  const [email, setEmail] = useState('')

  const handleSubmit = async (e) => {
    e.preventDefault();
    const result = await addToMailChimp(email)
  }

  const handleChange = e => {
    setEmail(e.target.value)
  }
  return (
  ...
  <form onSubmit={handleSubmit}>
      <input type='text' value={email} onChange={handleChange}/>
      <input type="submit" value="Request access"/>
  </form>
}

Stacktrace



node_modules/gatsby-plugin-mailchimp/index.js:88
_callee$
src/pages/index.js:15
  12 | const IndexPage = (props) => {
  13 |   const [email, setEmail] = useState('')
  14 | 
> 15 |   const handleSubmit = async (e) => {
  16 |     e.preventDefault();
  17 |     const result = await addToMailChimp(email)
  18 |   }
View compiled
▼ 7 stack frames were expanded.
tryCatch
node_modules/regenerator-runtime/runtime.js:45
Generator.invoke [as _invoke]
node_modules/regenerator-runtime/runtime.js:271
Generator.prototype.<computed> [as next]
node_modules/regenerator-runtime/runtime.js:97
asyncGeneratorStep
node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js:3
_next
node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js:25
(anonymous function)
node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js:32
(anonymous function)
node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js:21
▲ 7 stack frames were expanded.
handleSubmit
src/pages/index.js:15
  12 | const IndexPage = (props) => {
  13 |   const [email, setEmail] = useState('')
  14 | 
> 15 |   const handleSubmit = async (e) => {
  16 |     e.preventDefault();
  17 |     const result = await addToMailChimp(email)
  18 |   }
View compiled
▼ 20 stack frames were expanded.
HTMLUnknownElement.callCallback
node_modules/react-dom/cjs/react-dom.development.js:150
invokeGuardedCallbackDev
node_modules/react-dom/cjs/react-dom.development.js:200
invokeGuardedCallback
node_modules/react-dom/cjs/react-dom.development.js:257
invokeGuardedCallbackAndCatchFirstError
node_modules/react-dom/cjs/react-dom.development.js:271
executeDispatch
node_modules/react-dom/cjs/react-dom.development.js:562
executeDispatchesInOrder
node_modules/react-dom/cjs/react-dom.development.js:584
executeDispatchesAndRelease
node_modules/react-dom/cjs/react-dom.development.js:681
executeDispatchesAndReleaseTopLevel
node_modules/react-dom/cjs/react-dom.development.js:689
forEachAccumulated
node_modules/react-dom/cjs/react-dom.development.js:663
runEventsInBatch
node_modules/react-dom/cjs/react-dom.development.js:817
runExtractedEventsInBatch
node_modules/react-dom/cjs/react-dom.development.js:825
handleTopLevel
node_modules/react-dom/cjs/react-dom.development.js:4827
batchedUpdates$1
node_modules/react-dom/cjs/react-dom.development.js:20440
batchedUpdates
node_modules/react-dom/cjs/react-dom.development.js:2152
dispatchEvent
node_modules/react-dom/cjs/react-dom.development.js:4906
(anonymous function)
node_modules/react-dom/cjs/react-dom.development.js:20491
unstable_runWithPriority
node_modules/scheduler/cjs/scheduler.development.js:255
interactiveUpdates$1
node_modules/react-dom/cjs/react-dom.development.js:20490
interactiveUpdates
node_modules/react-dom/cjs/react-dom.development.js:2171
dispatchInteractiveEvent
node_modules/react-dom/cjs/react-dom.development.js:4883

isaacsultan avatar Jul 17 '19 13:07 isaacsultan

Taking a closer look at your endpoint... are you sure that's a Mailchimp URL? I'm trying to think what else this could be... did you have this working before and it just failed? Or did you just install this?

I usually recommend removing as much as possible from your environment and slowly adding stuff back in to see if there is a conflict. For example, try using the basic starter from Gatsby with your endpoint, see if you can get that working. If not, that means there is a problem with your endpoint. But if it does work then likely there is a conflict with another plugin.

benjaminhoffman avatar Jul 17 '19 16:07 benjaminhoffman

@isaacsultan and also use the method defined in the docs i.e. addToMailchimp instead of camel case.

domtaylor avatar Aug 02 '19 10:08 domtaylor

The same issue observed in my case, which gets resolved after restarting node (npm start). I was able to add a couple of emails within the last couple of days and then I've run it today and had the same issue:

Uncaught (in promise) ReferenceError: GATSBY_PLUGIN_MAILCHIMP_ADDRESS is not defined at addToMailchimp

which points to this piece of code:

    // eslint-disable-next-line no-undef
    var endpoint = __GATSBY_PLUGIN_MAILCHIMP_ADDRESS__;

Okelm avatar Aug 27 '19 06:08 Okelm

@isaacsultan and also use the method defined in the docs i.e. addToMailchimp instead of camel case.

it's okay, addToMailchimp has a default export

@benjaminhoffman Mailchimp URL looks correct

Okelm avatar Aug 27 '19 07:08 Okelm

Having the same issue. I have also tried passing my MC endpoint URL in as a param to addToMailChimp but the same ReferenceError: GATSBY_PLUGIN_MAILCHIMP_ADDRESS is not defined is still happening. Endpoint is ok because I send a POST to the same endpoint using Postman and got a 200 back. Could be an issue with conflicting es-lint settings? (shot in the dark, no exp with es-lint)

nh273 avatar Apr 28 '20 14:04 nh273

@nh273 Any luck with this? I'm having the same issue all the sudden.

scarsam avatar May 01 '20 16:05 scarsam

this is so weird. does anyone here have repro steps i can do? no updates have been made to the plugin so 🤷‍♂️

benjaminhoffman avatar May 01 '20 17:05 benjaminhoffman

this is so weird. does anyone here have repro steps i can do? no updates have been made to the plugin so 🤷‍♂️

I'm going to try what you suggested and start removing plugins to see if there is a plugin conflict happening, I'll circle back here later today.

scarsam avatar May 01 '20 17:05 scarsam

I had a silly mistake in my gatsby-config.js causing this error. Two of my plugins were defined in the same object.. 🤦

plugins: [{
  resolve: 'gatsby-plugin-mailchimp',
  options: {
    endpoint: 'xxxxx',
  },
  resolve: `gatsby-source-stripe`,
  options: {
    objects: ['Sku', 'Product'],
    secretKey: xxxx,
    downloadFiles: true,
  },
}]

The Stripe and Mailchimp plugin was defined in the same object causing this issue.

plugins: [{
  resolve: 'gatsby-plugin-mailchimp',
  options: {
    endpoint: 'xxxxx',
  },
},
{
  resolve: `gatsby-source-stripe`,
  options: {
    objects: ['Sku', 'Product'],
    secretKey: xxxx,
    downloadFiles: true,
  },
}]

scarsam avatar May 01 '20 18:05 scarsam

No worries we've all been there, including me 🤦. I have just checked what's happening on my site and I can see it's still working, but it takes a super long time for the state to change and display the message (anyone else have this). Also sometimes get a cors warning in my console. I thought I'd taken care of that through micro-cors package but apparently not.

On Fri, May 1, 2020 at 7:26 PM Sam Ojling [email protected] wrote:

I had a silly mistake in my gatsby-config.js causing this error. Two of my plugins were defined in the same object.. 🤦

{

  resolve: 'gatsby-plugin-mailchimp',

  options: {

    endpoint: 'xxxxx',

  },

  resolve: `gatsby-source-stripe`,

  options: {

    objects: ['Sku', 'Product'],

    secretKey: xxxx,

    downloadFiles: true,

  },

},

The Stripe and Mailchimp plugin was defined in the same object causing this issue.

{

  resolve: 'gatsby-plugin-mailchimp',

  options: {

    endpoint: 'xxxxx',

  },

  resolve: `gatsby-source-stripe`,

  options: {

    objects: ['Sku', 'Product'],

    secretKey: xxxx,

    downloadFiles: true,

  },

},

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/benjaminhoffman/gatsby-plugin-mailchimp/issues/42#issuecomment-622504999, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABCIF5RJHEMTBVRZZ5ONCQDRPMH43ANCNFSM4IEQLGEA .

domtaylor avatar May 01 '20 19:05 domtaylor

I had the same problem but I only had to restart the gatsby server and it worked again

GenisDiaz avatar May 07 '20 09:05 GenisDiaz

Looks like this may be solved? Would love to close it but if anyone is still experiencing issues, I am happy to keep it open.

benjaminhoffman avatar May 25 '20 02:05 benjaminhoffman

I have the same issue, when I try to import Mailchimp, I have this error, "Could not find a declaration file for module 'gatsby-plugin-mailchimp'. 'implicitly has an 'any' type. Try npm install @types/gatsby-plugin-mailchimp if it exists or add a new declaration (.d.ts) file containing declare module 'gatsby-plugin-mailchimp';ts(7016)"

my gatsby verson is 2.24.2, how can I get pass this error.

MuhammadSalah99 avatar Aug 22 '20 09:08 MuhammadSalah99

I'm facing the same issue ,it keep saying https is not defined. Even after restart and installing npm install gatsby-plugin-mailchimp, i'm receiving the same message.

muntiMedia avatar Mar 18 '22 04:03 muntiMedia

I had this issue and it was down to the formatting of my gatsby-config.js.

Weirdly, the previous plugin in the file didn't have a comma after a }. It was the last { in the list but putting the comma in made the the Mailchimp plugin suddenly start seeing the configured endpoint.

tobinharris avatar Sep 11 '22 08:09 tobinharris