title: Stripe error in Express/React: You did not set a publishable key
body: <p>I'm able to run my Express/React app locally without Stripe errors, paying successfully in test mode, but when on Heroku, I get this error on button click: <code>You did not set a valid publishable key. Call Stripe.setStripePublishableKey() with your publishable key.</code> Here is my setup:</p>
  
  <p>in heroku, I have my keys added there as config vars</p>
  
  <p>in <strong>config/dev.js</strong> I have all keys set as strings</p>
  
  <p>in <strong>config/prod.js</strong>: </p>
  
  <pre><code>module.exports = {
    googleClientID: process.env.GOOGLE_CLIENT_ID,
    googleClientSecret: process.env.GOOGLE_CLIENT_SECRET,
    mongoURI: process.env.MONGO_URI,
    cookieKey: process.env.COOKIE_KEY,
    stripePublishableKey: process.env.STRIPE_PUBLISHABLE_KEY,
    stripeSecretKey: process.env.STRIPE_SECRET_KEY
  };
  </code></pre>
  
  <p>in <strong>client/src/components/Payments.js</strong></p>
  
  <pre><code>import React, {Component} from 'react';
  import StripeCheckout from 'react-stripe-checkout';
  import { connect } from 'react-redux';
  import * as actions from '../actions';
  
  class Payments extends Component {
    render() {
  
      return (
        &lt;StripeCheckout 
          name="Emaily"
          description="Add $5 for 5 email credits"
          amount={ 500 }
          token={ token =&gt; this.props.handleToken(token) }
          stripeKey={ process.env.REACT_APP_STRIPE_KEY }
        &gt;
        &lt;button className="btn"&gt;
        Add Credits
        &lt;/button&gt;
        &lt;/StripeCheckout&gt;
      );
    }
  }
  
  export default connect(null, actions)(Payments);
  </code></pre>
  
  <p>Create React App requires I use REACT_APP_STRIPE_KEY rather than stripePublishableKey or STRIPE_PUBLISHABLE_KEY, and I've tried changing it my env variables instead to no avail. Any ideas?  </p>