未捕获的 ReferenceError：导入函数时未定义导出 - TypeScript

Question

我正在学习打字稿。 我从console.ts导入了output函数：

export function output(value: any): void {
  console.log(value);
}

编译为console.js ：

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var console_1 = require("./console");
console_1.output('Hello');
//# sourceMappingURL=functional.js.map

在目标文件中导入和使用：

import {output} from "./console";
output('Hello');

tsconfig.json：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "sourceMap": true
  },
  "exclude": [
    "node_modules"
  ]
}

我没有编译错误，但不明白为什么在浏览器中出现以下错误：

Uncaught ReferenceError: exports is not defined at functional.js:2

Answer 1

我在 Vue.js / TypeScript 项目中遇到了类似的问题。 Vue.js 项目在幕后使用了 Webpack，我在外部模块开发期间运行了npm link 。

最终，我发现这个问题是由 Webpack 试图跟踪我用npm link命令链接的依赖项的符号链接引起的。

解决方案是指示 Webpack 停止跟踪符号链接。

相关的WebPack文档部分： resolve.symlinks 。

相关 Vue.js 故障排除部分： Vue.js 和 npm 链接。

Answer 2

我有完全相同的问题。 告诉 webpack 停止跟随符号链接有帮助，这是vue.config.js的片段

chainWebpack: config => {
  config.resolve.symlinks(false);
},