给出此TS文件：
export default class Rob {
Start(): void {
console.log("Hello, world!");
}
}
我正在使用类似如下的Grunt任务进行转换：
browserify: {
rob: {
src: "./rob/rob.js",
dest: "./wwwroot/rob.js",
options: {
transform: [["babelify", { "presets": ["@babel/preset-env"] }]]
}
}
}
我运行一个简单的HTML文件，如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test bed</title>
<script src="rob.js"></script>
<script>
window.addEventListener("DOMContentLoaded", function () {
var r = new Rob();
r.Start();
});
</script>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>
将得到Uncaught ReferenceError: Rob is not defined的结果
我已经在SO上看到过类似的几个问题，但是这些问题似乎与滥用上下文有关（例如，不这样做或不适当时这样做）。这里的上下文是无关紧要的。我只想在控制台中查看console.log。
我的package.json看起来像这样：
{
"version": "1.0.0",
"name": "robtest",
"private": true,
"devDependencies": {
"@babel/core": "7.9.6",
"@babel/preset-env": "7.9.6",
"babel-preset-es2015": "7.0.0-beta.3",
"babelify": "10.0.0",
"grunt": "^1.1.0",
"grunt-browserify": "5.3.0"
}
}
我的脚步已到
node_modulesnpm install（无警告或错误）grunt rob（无警告或错误）此输出的JS文件在我看来与我想要的内容有关，包括以下代码段：
var Rob = /*#__PURE__*/function () {
function Rob() {
_classCallCheck(this, Rob);
}
_createClass(Rob, [{
key: "Start",
value: function Start() {
console.log("Hello, world!");
}
}]);
return Rob;
}();
exports["default"] = Rob;
Chrome还告诉我rob.js加载正常，当HTML页面加载后，我可以在源浏览器中看到内容。
我的问题很简单：为什么在这种情况下引用错误？
编辑：作为已接受答案的补充：如果我编辑ts来称呼自己（充当自己的入口点）：
export default class Rob {
Start(): void {
console.log("Hello, world!");
}
}
const r = new Rob();
r.Start();
然后一切都会按照预期的方式运行-恰好适合我的用例。