构成Type Script项目的多个文件

Ste*_*tes 22 javascript typescript

最近我一直在使用TypeScript,一切都很好,我真的非常喜欢..让JavaScript再次可行!:)

我们试图遵循与任何.net项目背后相同的想法,例如每个类/接口的单个​​文件

module Infrastructure {
    export interface IBaseViewModel {
        addOrRemoveClass(selector: string, className: string);
    }
}
Run Code Online (Sandbox Code Playgroud)

我们遇到的问题是 - 所有相关文件都没有被包含在内?说到跑步.

如果你查看这个文件是我们的应用程序的主要入口点,我在创建一个新的ViewModelBuilder时收到一个未定义的错误

module Infrastructure {
    export class Fusion {
        constructor() {
            this.vmBuilder = new ViewModelBuilder();
            this.setApplicationDefaults();
            this.start();
        }

        private vmBuilder: IViewModelBuilder;

        private start() {
            this.vmBuilder.process();
        }

        private setApplicationDefaults() {
            $.pnotify.defaults.styling = "jqueryui";
            $.pnotify.defaults.history = false;
            $.pnotify.defaults.auto_display = false;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

在我们的文件的顶部

/// <reference path="../Typings/jquery.d.ts" />
/// <reference path="ViewModelBuilder/ViewModelBuilder.ts" />
/// <reference path="ViewModelBuilder/IViewModelBuilder.ts" />
Run Code Online (Sandbox Code Playgroud)

还有ViewModelBuilder

module Infrastructure {

    export class ViewModelBuilder { }
}
Run Code Online (Sandbox Code Playgroud)

所以问题是这样的 - 最好的方法是什么?我们怎样才能让其他类声明工作?我们的项目将大大增加我们可能会有100个视图模型代表每个视图(项目是从Windows窗体到Web的转换)

任何帮助都会很棒,因为我们真的需要征服它并继续前进!:)

Fen*_*ton 29

我写过关于为TypeScript设置正确的设置,其中一个想法会帮助你 - 我最初从Mark Rendle那里得到了这个想法.

我们的想法是创建一个名为的文件,references.ts并在其中列出所有依赖项.有点像这样:

/// <reference path="modulea.ts" />
/// <reference path="moduleb.ts" />
/// <reference path="modulec.ts" />
/// <reference path="moduled.ts" />
/// <reference path="modulee.ts" />
Run Code Online (Sandbox Code Playgroud)

然后,您可以在所有TypeScript文件的顶部简单地引用此文件:

/// <reference path="references.ts" />
module ModuleA {
    export class MyClass {
        doSomething() {
            return 'Hello';
        }
        tester() {
            var x = new ModuleB.MyClass();
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

references.ts文件的作用类似于.NET项目的References文件夹.

另一个与此设置配合得很好的建议是使用--out标志来编译单个JavaScript文件,从app.ts.TypeScript编译器遍历所有依赖项,并为所有生成的JavaScript计算出正确的顺序.

tsc --out final.js app.ts
Run Code Online (Sandbox Code Playgroud)

与在任何地方手动引用特定文件相比,此策略可以更好地扩展您的程序.