ReferenceError: exports is not defined in TypeScript [Fixed]

# Table of Contents

# ReferenceError: exports is not defined in TypeScript

To solve the "Uncaught ReferenceError: exports is not defined", add a script tag that defines an exports variable above your JS script tag if in the browser, or remove the type attribute if set to module in your package.json file in Node.js.

# Browser - ReferenceError: exports is not defined

If you got the error in the browser, try defining a global exports variable above the script tags that load your JS files.

index.html

Copied!
<script>var exports = {};</script>

<!-- 👇️ your JS script should be below -->
<script src="index.js"></script>

This defines the exports variable and sets it to an empty object, so you won't get an error if properties are accessed on it.

Browsers don't support the CommonJS syntax (unless you use a tool like Webpack) of require and module.exports which causes the error.

If you run your code in the browser, try removing the module property from your tsconfig.json file and set target to es6.

tsconfig.json

Copied!
{
  "compilerOptions": {
    "target": "es6",  // 👈️ set this to es6
    // "module": "commonjs", // 👈️ REMOVE this (if browser env)
  }
}

When you remove the module option and set target to es6, your ES6 modules imports and exports won't get compiled to the older CommonJS syntax that browsers don't support.

Modern browsers support all ES6 features so ES6 is a good choice.

# Set `type` to `module` on your `script` tags

If this doesn't work, try setting the type attribute to module on your script tags.

index.html

Copied!
<!-- 👇️ correct path according to your setup -->
<script type="module" src="index.js"></script>

And import and export using the ES6 Modules syntax.

index.ts

Copied!
import {v4} from 'uuid'

export function sum(a, b) {
  return a + b;
}

When you set module to commonjs in your tsconfig.json, you instruct TypeScript to emit CommonJS files and browsers don't support the CommonJS syntax, so this is a very likely cause of the error.

I've also written a detailed guide on how to import values from another file in TS.

# Node.js - ReferenceError: exports is not defined

If you got the error in a Node.js application, try removing the type attribute from your package.json file if it's set to module.

package.json

Copied!
{
  "type": "module", // 👈️ remove this
}

When type is set to module we aren't able to use the exports and require syntax of CommonJS and we have to stick to ES Modules syntax for all of our imports and exports.

This happens when you have type set to module in your package.json file, but have module set to commonjs in your tsconfig.json file.

These two options aren't compatible because type = module instructs Node.js to use the ES Modules syntax and module = commonjs instructs TypeScript to emit CommonJS files.

Open your tsconfig.json file and make sure it looks something like the following.

tsconfig.json

Copied!
{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "esModuleInterop": true,
    "moduleResolution": "node",
    // ... your other options
  }
}

Your target option should be at least es6 and module should be set to commonjs.

Make sure you use the ES6 modules syntax for your imports and exports.

index.ts

Copied!
import {myFunction} from './myFile'

export function sum(a:number, b:number) {
  return a + b;
}

Node.js supports the CommonJS syntax.

When you use the ES modules syntax and instruct TypeScript to emit CommonJS code by setting module to commonjs, the export in the example gets compiled to CommonJS and should work.

The only reason for it not to work is when you emit CommonJS files but have instructed Node.js to use the ES6 Module syntax to read them.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.

You can use the search field on my Home Page to filter through all of my articles.

ReferenceError: exports is not defined in TypeScript [Fixed]

# Table of Contents