我正在寻找一个转译器,给我以下内容:-
- 使用ES6语法的类,"let"作用域,胖箭头语法
- 对导入的一些支持(理想情况下是ES6建议的语法)
- 支持IE8(即编译到ES3) 与AngularJS的兼容性
- 与gulp 兼容
- 编译我所有的代码到一个单一的文件,没有要求/AMD。
现在,大部分都是由TypeScript覆盖的,但是TypeScript有自己的类型语法,我不喜欢使用,因为它似乎需要我下载/设置接口/定义文件。
我试了一下,但没有多大成功。您可以看到下面的代码。有人可以建议一个替代方案(不,我不想使用Dart),或者告诉我我做错了什么。
应用程序。t(我的"main"文件)
/// <reference path="MyController.ts"/>
/// <reference path="MyService.ts"/>
// <reference path="../bower_components/angular/angular.min.js"/>
angular.module("test")
.controller("MyController", MyController.injections)
.factory("MyService", MyService.injections);
MyController.ts
/// <reference path="MyService.ts"/>
module MyController {
class MyController {
constructor(MyService) {
this.MyService = MyService;
}
callSomething() {
this.MyService.doSomething();
}
}
export var injections = [ "MyService", MyController ];
}
MyService.ts
module MyService {
export class MyService {
constructor($http) {
}
doSomething() {
console.log("Yo");
}
}
export var injections = [ "$http", MyService ];
}
以下是typescript编译器输出的问题:-
C:devtempangulargulp>gulp compile
[gulp] Using gulpfile C:devtempangulargulpgulpfile.js
[gulp] Starting 'compile'...
[gulp] Finished 'compile' after 3.87 ms
[gulp] Compiling TypeScript files using tsc version 1.0.1.0
[gulp] [tsc] > error TS5023: Unknown option 'allowimportmodule'
[gulp] [tsc] > C:devtempangulargulpappscriptsMyController.ts(5,9): error TS2094: The property 'MyService' does not exist on value of type 'MyController'.
[gulp] [tsc] > Use the '--help' flag to see options.
[gulp] [tsc] > C:devtempangulargulpappscriptsMyController.ts(9,9): error TS2094: The property 'MyService' does not exist on value of type 'MyController'.
[gulp] [tsc] > C:devtempangulargulpappscriptsapp.ts(5,1): error TS2095: Could not find symbol 'angular'.
[gulp] Failed to compile TypeScript: Error: tsc command has exited with code:1
events.js:72
throw er; // Unhandled 'error' event
^
[←[32mgulp←[39m] Error in plugin '←[36mgulp-tsc←[39m': Failed to compile: tsc command has exited with code:1
at C:devtempangulargulpnode_modulesgulp-tscindex.js:51:33
at C:devtempangulargulpnode_modulesgulp-tsclibcompiler.js:326:8
at Array.forEach (native)
at Function.Compiler._allAborted (C:devtempangulargulpnode_modulesgulp-tsclibcompiler.js:325:13)
at Function.Compiler.abortAll (C:devtempangulargulpnode_modulesgulp-tsclibcompiler.js:303:14)
at C:devtempangulargulpnode_modulesgulp-tscindex.js:50:20
at C:devtempangulargulpnode_modulesgulp-tsclibcompiler.js:110:7
at Transform.<anonymous> (C:devtempangulargulpnode_modulesgulp-tsclibcompiler.js:205:5)
at Transform.EventEmitter.emit (events.js:117:20)
at C:devtempangulargulpnode_modulesgulp-tscnode_modulesthrough2node_modulesreadable-streamlib_stream_readable.js:942:16
我认为这个参考:
// <reference path="../bower_components/angular/angular.min.js"/>
实际上应该指向Angular的.d.ts
类型定义文件。
In this class:
class MyController {
constructor(MyService) {
this.MyService = MyService;
}
您尝试使用this.MyService
,但您从未声明过它。
class MyController {
MyService: MyService.MyService;
constructor(MyService) {
this.MyService = MyService;
}
-or-你可以自动把构造函数参数变成类变量,像这样:
class MyController {
constructor(private MyService: MyService.MyService) {
}