Uncaught ReferenceError: exports is not defined in filed generated by Typescript

Question

I'm trying to get started with Typescript for Electron development. After wrestling with getting typing for node and jQuery, I finally got my .ts file error free.

The problem is now that when I run my app, I get this error:

index.js:2 Uncaught ReferenceError: exports is not defined

These are the first two lines in index.js:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

I don't know that that line does. Typescript added it when compiling. My app works fine if I remove it.

How do I get rid of this error?

Oh and here's my tsconfig, if that's relevant.

{
    "compilerOptions": {
        "target": "es6",
        "module": "commonjs",
        "moduleResolution": "node",
        "isolatedModules": false,
        "jsx": "react",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "declaration": false,
        "noImplicitAny": false,
        "noImplicitUseStrict": false,
        "removeComments": true,
        "noLib": false,
        "preserveConstEnums": true,
        "suppressImplicitAnyIndexErrors": true
    },
    "exclude": [
        "node_modules",
        "typings/browser",
        "typings/browser.d.ts"
    ],
    "compileOnSave": true,
    "buildOnSave": false,
    "atom": {
        "rewriteTsconfig": false
    }
}

Answer 1

I solved it with a hack in the embedding HTML:

<script> var exports = {}; </script>
<script src="index.js"></script>

Basically giving it what it wants, a global exports variable.

With that my TypeScript (2.3.2) generated file (es6) loads.

Answer 2

I was also facing the same issue and tried changing to different versions of the typescript but did not work.

Finally, I got it - There was a "type": "module" in package.json

, and when I removed it - it worked

Answer 3

There is an issue with the new version of typescript 2.2.1, try using the older version 2.1.6, that solved the exact same issue which you have for me.

Version 2.2.1 on compiling adds this line Object.defineProperty(exports, "__esModule", { value: true }); while the older 2.1.6 does not.

Answer 4

I've fixed mine with the following:

tsconfig.json

{
    "compilerOptions": {
        "target": "ESNext",
        "module": "CommonJS",
        "lib": [
            "DOM",
            "ES5"
        ],
        "esModuleInterop": true
    }
}

Adding the esModuleInterop

Removing the "type": "module" from the package.json

Answer 5

I had the same issue with a js file generated by the Typescript compiler. Same line :

Object.defineProperty(exports, "__esModule", { value: true });

And same error :

game.js:2 Uncaught ReferenceError: exports is not defined

I was defining a Game class in this file. I solved the issue by adding this at the end of my game.ts file:

export = Game;

With this, the Typescript compiler replaced:

Object.defineProperty(exports, "__esModule", { value: true });

with:

module.exports = Game;

No more error for me after this.

Answer 6

Change your tsconfig.json module to es2015 and moduleResolution to node.

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node"
  }
}

Taken from this answer

The exports.__esModule and require('lib') are what happen when we transpile from an ES module to commonjs (with babel or with TypeScript).

Answer 7

Solution

tsconfig.json

"module": "ESNext",

"target": "ESNext",

index.html

<script type="module" src="script.js"></script>

Answer 8

If your code doesn't require export and it doesn't crash application:

You can try to add a global variable to your code:

window.exports = {};

Answer 9

I was having the same issue, I just modified the systemjs.config.js file as mentioned below

'npm:': '/node_modules/' -- // Its value was just 'node_modules/' and I added '/' in the beginning

'app': '/src/app' -- // Its value was just 'app' and as my app folder path was different so is changed it accordingly

loader: '/src/systemjs-angular-loader.js' -- // Its value was just 'systemjs-angular-loader.js' and as its location was different in my project so pointed it to the correct path

Answer 10

This might not work for everyone, but my mistake in the ES module was to refer the import with a .ts

We know in ES module, we are supposed to import local modules with:

import { Car } from "../models/car.js";

For TypeScript, I decided to use:

import { Car } from "../models/car.ts";

This made my code break.

Hence, make sure the import is:

import { Car } from "../models/car";

If it does not work, check your package.json, and make sure that it does not have

"type": "module" 

in the surface level. Delete the "type": "module" in your package.json

Then, in my tsconfig.json, make sure you have your targets and modules set to this:

"target" : "es6"
"module" : "CommonJS"

TLDR: The sole problem was my import, but if it doesn't work make sure to check your package.json to have no type of module and your tsconfig.json to have their target and module to be set to es6 and CommonJS respectively.

As if anyone has extra explanations to why the import should be like that feel free to add.

Answer 11

Took me almost one hour to solve this: In my typescript file I acidently had this import line on top: import { request } from "express";

I didn't use it, it was the only import. After removing the line, the error was gone. Extra information, my package.json doesn't have 'type' line: "type": "module"

Answer 12

QuickFix

Change "target": "es6" to "target": "es5" in your tsconfig.json.