Express/React中的条带错误:您没有设置可发布的密钥

我可以在本地运行我的Express/React应用程序而不会出现条带错误,在测试模式下成功付款,但在Heroku上,我在单击按钮时会出现以下错误: You did not set a valid publishable key. Call Stripe.setStripePublishableKey() with your publishable key. 以下是我的设置:

在heroku中,我将我的密钥作为配置变量添加到那里

配置/开发js 我把所有的钥匙都设置成琴弦了

在里面 :

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
};

在里面

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 (
      <StripeCheckout 
        name="Emaily"
        description="Add $5 for 5 email credits"
        amount={ 500 }
        token={ token => this.props.handleToken(token) }
        stripeKey={ process.env.REACT_APP_STRIPE_KEY }
      >
      <button className="btn">
      Add Credits
      </button>
      </StripeCheckout>
    );
  }
}

export default connect(null, actions)(Payments);

Create React App要求我使用React_App_STRIPE_KEY而不是stripePublishableKey或STRIPE_publisheable_KEY,我尝试更改它我的env变量,但没有成功。有什么想法吗?