Typescript & Electron exports is not defined

Question

I'm trying to run my simple electron app. I use Typescript as a development language which compiles into JavaScript. When I run the app I get the following error:

ReferenceError: exports is not defined[Learn More]
file:///Users/ahmet/Documents/JumbleUp-Desktop/dist/Login/Login.js:5
exports.__esModule = true;

My login.ts file looks like this

    import firebase from "firebase";

firebase.auth().onAuthStateChanged(function(user) {
    if (user) {
        location.replace("index.html");
    } else {
        location.replace("login.html");
    }
  });
function login() {
    const userEmail = (document.getElementById("inputEmail") as HTMLInputElement).value;
    const userPassword = (document.getElementById("inputPassword") as HTMLInputElement).value;

    firebase.auth().createUserWithEmailAndPassword(userEmail, userPassword).catch(function(error) {
        // Handle Errors here.
        var errorCode = error.code;
        var errorMessage = error.message;
        // ...

        window.alert("Alert : " + errorMessage);
      });
}

and here my tsconfig file

{
    "compilerOptions": {
      "module": "commonjs",
      "noImplicitAny": true,
      "sourceMap": true,
      "esModuleInterop": true,
      "outDir": "dist",
      "baseUrl": ".",
      "paths": {
        "*": ["node_modules/*"]
      }
    },
    "include": [
      "src/**/*"
    ]
  } 

Answer 1

I've encountered the same problem. For me the problem was not in the way the files are transpiled, but by how they were included in the project in index.html.

Changing:

<script src="./main.js"></script>

to

<script>
   require("./main.js")
</script>

in index.html

solved it for me