尝试按照官方手册实现一个模块,我得到这个错误消息:

Uncaught ReferenceError:未定义exports 在app.js: 2

但在我的代码中,我从未使用过名称exports。

我该如何解决这个问题?


文件

app.ts

let a = 2;
let b:number = 3;

import Person = require ('./mods/module-1');

模块- 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"
    ]
}

当前回答

注意:这可能不适用于OP的答案,但我得到了这个错误,这就是我解决它的方式。

所以我面临的问题是,当我从一个特定的CDN检索一个'js'库时,我得到了这个错误。

我做的唯一错误的事情是从CDN的cjs目录导入,就像这样: https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/cjs/popper.min.js

注意到dist/cjs部分了吗?这就是问题所在。

在我的例子中,我回到CDN (jsdelivr)并导航到umd文件夹。我可以找到另一组popper.min.js,这是要导入的正确文件: https://cdn.jsdelivr.net/npm/@popperjs core@2.4.0 / dist / / popper.min.js umd格式。

其他回答

对于一些ASP。NET项目的导入和导出可能根本不会在Typescripts中使用。

当我试图这样做时,问题的错误出现了,我后来才发现,我只需要像这样将生成的JS脚本添加到视图:

<script src="~/scripts/js/[GENERATED_FILE].Index.js" asp-append-version="true"></script>

由于ES5/ES2009不支持客户端/浏览器上的模块(导入/导出/要求),你必须使用库,它将模块捆绑到一个文件中,可以通过<script>标记包含,例如

Browserify Webpack

看看这个答案。

有同样的问题,并通过改变JS包的加载顺序来修复它。

检查调用所需包的顺序,并按适当的顺序加载它们。

在我的特定情况下(不使用模块绑定器),我需要加载Redux,然后Redux坦克,然后React Redux。在Redux坦克之前加载React Redux会给我出口是没有定义的。

编辑:

这个答案可能不起作用,这取决于您是否不再针对es5,我将尝试使答案更完整。

原来的答案

如果CommonJS没有安装(它定义了exports),你必须从tsconfig.json中删除这一行:

 "module": "commonjs",

根据注释,仅这一点可能不适用于tsc的后续版本。如果是这样的话,你可以安装一个模块加载器,比如CommonJS, SystemJS或RequireJS,然后指定它。

注意:

看看tsc生成的main.js文件。你会发现在最上面:

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

它是错误信息的根,删除"module": "commonjs",,它将消失。

对我来说,从tsconfig中删除“esModuleInterop”:true。Json成功了。