Typescript ReferenceError: exports is not defined

问题:

Trying to implement a module following the official handbook, I get this error message:

Uncaught ReferenceError: exports is not defined

at app.js:2

But nowhere in my code do I ever use the name exports.

How can I fix this?

---

Files

app.ts

let a = 2; let b:number = 3;  import Person = require ('./mods/module-1'); 

module-1.t

 export class Person {   constructor(){     console.log('Person Class');   } } export default Person; 

tsconfig.json

{    "compilerOptions": {         "module": "commonjs",         "target": "es5",         "noImplicitAny": false,         "sourceMap": true,         "outDir": "scripts/"     },     "exclude": [         "node_modules"     ] } 

回答1:

EDIT:

This answer might not work depending if you're not targeting es5 anymore, I'll try to make the answer more complete.

Original Answer

If CommonJS isn't installed (which defines exports), you have to remove this line from your tsconfig.json:

 "module": "commonjs", 

As per the comments, this alone may not work with later versions of tsc. If that is the case, you can install a module loader like CommonJS, SystemJS or RequireJS and then specify that.

Note:

Look at your main.js file that tsc generated. You will find this at the very top:

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

It is the root of the error message, and after removing "module": "commonjs",, it will vanish.

回答2:

Few other Solutions for this issue

• Add the following line before other references to Javascript. This is a nice little hack.

• This issue occurs with the latest version of TypeScript, this error can be eliminated by referring to typescript version 2.1.6

回答3:

There is a relationship between the "module" option and the "target" option in the compiler options (as documented here):

--module -m

string

target === "ES3" or "ES5" ? "CommonJS" : "ES6"

As the default value of module, is conditional of the target, you have to consider both options and the way you are using to load your modules to have the right options that fits with your code.

If you target ES5, you have to consider another option than the default value, and change the way you load your module accordingly.

回答4:

For people still having this issue, if your compiler target is set to ES6 you need to tell babel to skip module transformation. To do so add this to your .babelrc file

{   "presets": [ ["env", {"modules": false} ]] } 

回答5:

The accepted answer didn't solve the problem for me. Instead I setup to use RequireJS (AMD Implementation). I wrote my solution at https://stackoverflow.com/a/48436147/1019307.

回答6:

I had the same problem and solved it adding "es5" library to tsconfig.json like this:

{     "compilerOptions": {         "target": "es5", //defines what sort of code ts generates, es5 because it's what most browsers currently UNDERSTANDS.         "module": "commonjs",         "moduleResolution": "node",         "sourceMap": true,         "emitDecoratorMetadata": true, //for angular to be able to use metadata we specify in our components.         "experimentalDecorators": true, //angular needs decorators like @Component, @Injectable, etc.         "removeComments": false,         "noImplicitAny": false,         "lib": [             "es2016",             "dom",             "es5"         ]     } } 

回答7:

I was really confused when I had to setup a test runner for the first time on a backend because I usually have that setup beforehand or I had to setup tests on frontend project.

So I thought... that using Karma for a backend project was a good idea *facepalm*.

Spoiler alert: It's not. Karma will always run your tests in a browser, but your backend code is meant to be read by Node. And the first difference between the 2, is that Node can read exports statements while a browser cannot.

So I just ended up using ts-node (for Typescript support), jasmine and watch to start again all the tests when I update a file.

文章来源: Typescript ReferenceError: exports is not defined