How can you let Typescript know you're sharing data across <scripts> in HTML?

Question

I'm using Firebase specifically, but this is a general question that applies to any multi-script use case.

Basically I'm declaring const firebaseConfig = { ... }; in one script, and then referring to that variable in my React code in separate files which are going through a bundling process.

Of course, VS Code says "Hey, firebaseConfig doesn't exist! Error! Error!" But in fact it does.

How can I resolve this so that I'm not getting misleading errors while developing?

Answer 1

For Typescript, just use:

declare global {
   const firebaseConfig: any; // or give it a proper type, up to you
}