typescript 打字稿参考错误：未定义导出
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/43042889/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Typescript ReferenceError: exports is not defined
提问by George C.
Trying to implement a module following the official handbook, I get this error message:
尝试按照官方手册实现一个模块，我收到此错误消息：
Uncaught ReferenceError: exports is not defined
at app.js:2
未捕获的 ReferenceError：未定义导出
在 app.js:2
But nowhere in my code do I ever use the name exports.
但是在我的代码中没有任何地方使用过 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
模块-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"
]
}
采纳答案by iFreilicht
EDIT:
编辑：
This answer might not work depending if you're not targeting es5anymore, I'll try to make the answer more complete.
如果您不再定位es5，这个答案可能不起作用，我会尽量使答案更完整。
Original Answer
原答案
If CommonJS isn't installed (which defines exports), you have to remove this line from your tsconfig.json:
如果未安装 CommonJS（定义了exports），您必须从您的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.
根据评论，仅此一项可能不适用于更高版本的tsc. 如果是这种情况，您可以安装像 CommonJS、SystemJS 或 RequireJS 这样的模块加载器，然后指定它。
Note:
笔记：
Look at your main.jsfile that tscgenerated. You will find this at the very top:
查看生成的main.js文件tsc。你会在最顶部找到这个：
Object.defineProperty(exports, "__esModule", { value: true });
It is the root of the error message, and after removing "module": "commonjs",, it will vanish.
它是错误信息的根源，删除后"module": "commonjs",，它将消失。
回答by Venkatesh Muniyandi
Few other Solutions for this issue
此问题的其他解决方案很少
- Add the following line before other references to Javascript. This is a nice little hack.
- 在对 Javascript 的其他引用之前添加以下行。这是一个不错的小技巧。
<script>var exports = {};</script>
- This issue occurs with the latest version of TypeScript, this error can be eliminated by referring to typescript version 2.1.6
- 最新版本的TypeScript会出现这个问题，参考typescript 2.1.6版本可以消除这个错误
回答by Yi Zhang
npm install @babel/plugin-transform-modules-commonjs
npm install @babel/plugin-transform-modules-commonjs
and add to to .babelrc plugins resolved my question.
并添加到 .babelrc 插件解决了我的问题。
回答by Hocine Abdellatif
my solution is a sum up of everything above with little tricks I added, basically I added this to my html code
我的解决方案是对上面所有内容的总结，并添加了一些小技巧，基本上我将其添加到我的 html 代码中
<script>var exports = {"__esModule": true};</script>
<script src="js/file.js"></script>
this even allows you to use importinstead of requireif you're using electron or something, and it works fine with typescript 3.5.1, target: es3 -> esnext.
这甚至允许您使用import而不是require使用电子或其他东西，并且它适用于打字稿 3.5.1，目标：es3 -> esnext。
回答by Cezar Augusto
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 .babelrcfile
对于仍然有这个问题的人，如果你的编译器目标设置为 ES6，你需要告诉 babel 跳过模块转换。为此，请将其添加到您的.babelrc文件中
{
"presets": [ ["env", {"modules": false} ]]
}
回答by rubensa
I had the same problem and solved it adding "es5" library to tsconfig.json like this:
我遇到了同样的问题并解决了它，将“ es5”库添加到 tsconfig.json 中，如下所示：
{
"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"
]
}
}
回答by MatX
I had this same error too. In my case it was because we had an old-fashioned import statement in our TypeScript AngularJS project like this:
我也有同样的错误。就我而言，这是因为我们的 TypeScript AngularJS 项目中有一个老式的 import 语句，如下所示：
import { IAttributes, IScope } from "angular";
which was compiled to JavaScript like this:
它被编译成这样的 JavaScript：
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
This was needed back in the old days because we then used IAttributesin the code and TypeScript wouldn't have known what to do with it otherwise.
But after removing the import statement, and converting IAttributesto ng.IAttributesthose two JavaScript lines disappeared - and so did the error message.
这在过去是需要的，因为我们随后IAttributes在代码中使用了它，否则 TypeScript 将不知道如何处理它。但是在删除 import 语句后，转换IAttributes为ng.IAttributes那两行 JavaScript 行就消失了 - 错误消息也是如此。
回答by Code Whisperer
This is fixed by setting the modulecompiler option to es6:
这是通过将module编译器选项设置为es6：
{
"compilerOptions": {
"module": "es6",
"target": "es5",
}
}
回答by Daniel Danielecki
Simply add libraryTarget: 'umd', like so
简单地添加libraryTarget: 'umd'，像这样
const webpackConfig = {
output: {
libraryTarget: 'umd' // Fix: "Uncaught ReferenceError: exports is not defined".
}
};
module.exports = webpackConfig; // Export all custom Webpack configs.
回答by user3033599
for me, removing "esModuleInterop": truefrom tsconfig.json did the trick.
对我来说，"esModuleInterop": true从 tsconfig.json 中删除可以解决问题。
