Javascript “如何修复”；ReferenceError:未定义导出"；在纯类型脚本项目中？

如果我使用任何类型的导入或导出指令编写a.ts，那么当加载到HTML页面中时，生成的.js将生成以下错误：“ReferenceError:导出未定义”

如何复制：

在VS中创建空白Node.js web应用程序项目

添加带有导入或导出行的.ts

添加一些HTML调用生成的.js

启动HTTP服务器（

HTTP服务器-g[port]

）并访问HTML

我试过：

• 针对ES 5
• 从tsconfig.json中删除行“module”：“commonjs”`
• 安装CommonJS和SystemJS
• 使用

  tsc

• 任何其他解决方案堆栈溢出都有类似的问题
• 以上所有可能的排列

My.ts（如果有导入指令，则可以是任何内容）：

HTML只有一个引用脚本的简单主体

mypackage.json

{
  "name": "nodejs-web-app4",
  "version": "0.0.0",
  "description": "NodejsWebApp4",
  "main": "server.js",
  "author": {
    "name": ""
  },
  "devDependencies": {
    "@types/node": "^8.0.14"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "lib": ["es6"],
    "sourceMap": true
  },
  "exclude": [
    "node_modules"
  ]
}

js:

从VS构建（导致

引用错误：未定义导出

）：

从命令

tsc[filename].ts

（导致

引用错误：未定义导出

）：

从VS Build中，但从tsconfig中删除

“模块”：“commonjs”

（导致

语法错误：导入声明可能仅出现在模块的顶层

）：

所有HTML和ts将被称为“静态”（无MVC）

使用

httpserver

查看我的VS项目中的静态HTML是否错误？这就是问题所在吗

我们应该以其他方式建设吗？使用不同的设置

我有一个解决方法（即，将我需要的所有东西都保存在同一个TypeScript文件中），但它让我感到困惑的是，我无法使用Node/TS创建和可视化一个简单的项目。

浏览器不支持commonjs模块。编译后，您需要使用一些工具（webpack、rollup、browserify）来捆绑模块

如果删除tsconfig.json中的模块选项，或者设置为es2015或esnext，则导入和导出语句将保持原始文件中的状态

import { foo } from './bar.js';

export default class Baz {}

它可以工作，因为某些浏览器已经支持本机，但有必要在脚本标记中添加type属性并将其设置为module

---

如果不这样做，您将得到一些错误，如“SyntaxError:导入声明可能只出现在模块的顶层”错误。

删除

CommonJs

和添加

type=“module”

有效，但最重要的是，现在我了解了发生的情况。感谢您的解释。我遇到了一个类似的问题，但我没有删除

在
tsconfig.json
文件中的“module”

。设置

“module”：“es2015”

并在

script

标记中添加

type=“module”

属性对我有帮助。检查

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const timers_1 = require("timers");
timers_1.setTimeout(() => console.log("asdf"), 1000);
//# sourceMappingURL=home-script.js.map

"use strict";
exports.__esModule = true;
var timers_1 = require("timers");
timers_1.setTimeout(function () { return console.log("asdf"); }, 1000);

import { setTimeout } from "timers";
setTimeout(() => console.log("asdf"), 1000);
//# sourceMappingURL=asdf.js.map

import { foo } from './bar.js';

export default class Baz {}

<script type="module" src="foo.js"></script>