In my Next JS application, I encountered a situation where a line of code relies on a variable from a script src in the app.tsx page. Here's how it looks:
app.tsx:
<script src="https://js.stripe.com/v3/"></script>
config.ts:
declare var Stripe:any
const stripe = Stripe("stripe publishable key")
This setup works because TypeScript doesn't recognize the 'Stripe' variable, but during build time, it's fetched from the script and can be initialized. The 'declare' statement helps to avoid errors without assigning an initial value to the variable. However, when the TypeScript is compiled to JavaScript using 'npm run build', the 'declare' statement disappears, leading to an error before completing the build process. So, I'm curious if there are alternative methods similar to 'declare' or perhaps better ways to import the script to bypass this issue?