#mindegg_reactnative-web

1 messages · Page 1 of 1 (latest)

north sluiceBOT
#

👋 Welcome to your new thread!

⏲️ We'll be here soon! We typically respond in a few minutes, but in some cases we might need a bit more time (e.g., server's busy, you've got a complex question, etc.).

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1259901236212138086

📝 Have more to share? Add details, code, screenshots, videos, etc. below.

robust light
deep saddle
#

Can you be more specific? What doesn't work? What errors are you getting?

robust light
#

In the parent component I wrapped it like this but it's still causing issues with my web build.

#

{Platform.OS != 'web' && (
<StripeProvider
publishableKey=""
urlScheme='exp://192.168.12.94:8081/--/'
merchantIdentifier="merchant.com.patshala"
setReturnUrlSchemeOnAndroid={true}>
<ProviderPayButton
userId={userId}
orderId={orderId}
amount={openPrice ? openPrice : totalAmount}
objectId={""}
currency={AmountCurrencyEnum.Usd}
transactionType={TransactionType.Purchase}
buttonText={"Checkout"}
allowsDelayedPaymentMethods={true}
onPaymentSuccess={() => {
console.log("Payment successful!");
setModalVisible(false)
}}
/>
</StripeProvider>
)}

#

This is the error I am getting: Unable to resolve "../../Utilities/Platform" from "node_modules/react-native/Libraries/Components/TextInput/TextInputState.js"

robust light
#

This is the error I am getting Unable to resolve "../../Utilities/Platform" from "node_modules/react-native/Libraries/Components/TextInput/TextInputState.js"

undone jolt
#

@robust light I don't think we support a web build with ReactNative. Also the error doesn't seem to be with Stripe right? Seems closer to https://github.com/expo/web-examples/issues/73 for example
But really our ReactNative SDK is for iOS and Android, not web

#

mindegg_reactnative-web

robust light
#

But this only appears when I uncomment my stripe button.

undone jolt
#

it's possible that our SDK is incompatible with your web build, likely because this isn't a platform we support. Also our Expo support is limited, they pin to a really old version of our own SDK too

robust light
#

How am I supposed to use Stripe on my mobile app and my web app. Even when when I use a conditional statement where it's just supposed to work on mobile app, it crashes my web.

#

Here is my code

#

{Platform.OS != 'web' && (
<StripeProvider
publishableKey=""
urlScheme='exp://192.168.12.94:8081/--/'
merchantIdentifier="merchant.com.patshala"
setReturnUrlSchemeOnAndroid={true}>
<ProviderPayButton
userId={userId}
orderId={orderId}
amount={openPrice ? openPrice : totalAmount}
objectId={""}
currency={AmountCurrencyEnum.Usd}
transactionType={TransactionType.Purchase}
buttonText={"Checkout"}
allowsDelayedPaymentMethods={true}
onPaymentSuccess={() => {
console.log("Payment successful!");
setModalVisible(false)
}}
/>
</StripeProvider>
)}

undone jolt
#

I don't know sorry. You'll need to have different version of your apps/codebase. One for mobile and one for web without the SDK

robust light
#

This is the Provider button

robust light
#

But I am not even at the point where I am putting anything for web. Even with the conditional statement it's breaking my web build.

undone jolt
#

You need to make it so that "@stripe/stripe-react-native": "^0.37.3", is not included in your web build

robust light
#

See this condition, it's still breaking my web build. {Platform.OS != 'web' && (
<StripeProvider
publishableKey=""
urlScheme='exp://192.168.12.94:8081/--/'
merchantIdentifier="merchant.com.patshala"
setReturnUrlSchemeOnAndroid={true}>
<ProviderPayButton
userId={userId}
orderId={orderId}
amount={openPrice ? openPrice : totalAmount}
objectId={""}
currency={AmountCurrencyEnum.Usd}
transactionType={TransactionType.Purchase}
buttonText={"Checkout"}
allowsDelayedPaymentMethods={true}
onPaymentSuccess={() => {
console.log("Payment successful!");
setModalVisible(false)
}}
/>
</StripeProvider>
)}

undone jolt
robust light
undone jolt
#

you likely need to do something like this where you only have the dependency for iOS or Android.

#

I don't know more sorry, this is something you'll need to figure out as it's more a ReactNative/Expo question and not really specific to Stripe

robust light
#

It's very Stripe related

#

and it's a huge deal breaker when using stripe

#

It's documented in previous questions here and in the actual github discussions page

#

I only get this error and can remove it when I comment out stripe code

undone jolt
#

@robust light sorry I think you're too focused on "this doesn't work". I did explain what to do now. You need to figure out how to make our ReactNative SDK and the related code only be built on iOS and Android targets and not web.
I don't know exactly how to do this, I'm sorry. You're the developer here, now that I explained the issue, you need to look for an answer for example online like the example I gave you above.
It is likely common when building a ReactNative mobile app to have parts of the code that are iOS or Android or web specific so it's what you need to focus on now.

robust light
#

That's okay but it's breaking my web build. Even if I don't include stripe payments in my web app, and just my mobile app it's breaking my web app.