我的问题如下:
我使用gulp + browserify将我的TypeScript编译为可以在普通HTML页面上使用的JavaScript,问题是我的类在浏览器上永远不可用:
VM633:1 Uncaught ReferenceError: Test is not defined
at <anonymous>:1:13
这是我的TypeScript文件:
class Test {
public test(): void {
console.log("aa");
}
}
&#13;
这是我的gulpfile
var gulp = require("gulp");
var browserify = require("browserify");
var source = require('vinyl-source-stream');
var tsify = require("tsify");
gulp.task("default", function () {
return browserify({
//basedir: '.',
debug: true,
entries: ['app/Resources/typescript/Test.ts'],
cache: {},
packageCache: {}
})
.plugin(tsify)
.bundle()
.pipe(source('bundle.js'))
.pipe(gulp.dest("web/bundles/framework/js"));
});
&#13;
文件编译没有问题,并且包含在我的index.html(已编译的js文件)中。
但是当我尝试时:
var t = new Test();
&#13;
我收到以下错误:
VM633:1 Uncaught ReferenceError: Test is not defined
at <anonymous>:1:13
我无法解决这个问题,我已经阅读了很多内容,而且我没有发现任何明确的内容,我尝试了所有内容,但没有任何效果。
答案 0 :(得分:1)
这里缺少一些东西:
如果您希望自己的课程可以在模块之外访问,则必须export
:
export class Test {
// ...
}
Browserify在您定义的类之上创建函数。因此它无法在全球范围内访问(这是一件好事)。通常你会将它导入另一个文件并使用它:
// in any TS file that wants to use `Test` class. Make sure this is included in the gulp entries as well
import {Test} from "test";
var t = new Test();
console.log(t);
或者如果真的希望它可以全局访问,您可以将它附加到window
对象:
//在Test.ts文件中:
(window as any).Test = Test; // This can be useful when debuging. But don't do this in production code.