.net - ASP.NET 项目中 TypeScript 文件和代码的结构

标签 .net asp.net-mvc typescript visual-studio-2015 .net-4.6

所以我正在开发这个 ASP.NET(.NET 4.6、VS2015),它的所有业务逻辑都是用 C# 编写的。但由于它不仅仅是表示 Web,因此客户端上也会有很多逻辑。所以我选择了 TypeScript,因为它看起来是一个很棒的工具,可以帮助我用我习惯的 C# 风格来组织客户端代码。

然而,随着我越来越深入地研究,我发现 TypeScript 与 C# 完全不同。这一切都与一个问题有关:

TypeScript 不支持简单的每个文件类(或每个文件接口(interface)等)规则,您可以在另一个文件中简单地包含多个类(接口(interface)..)。

这确实会派上用场,因为我想为每个页面定义 ViewModel 类和初始化脚本,我将在其中使用所有这些模型和实用程序。

就我个人而言,我找到了两个“解决方案”

A:保留每个文件类规则并将每个文件包装在命名空间中,如下所示:

// Analogy to c# using
import utils = App.Code.Utils;

namespace App.Code {
    export class ZipCodeValidator {

        public zipCode: string;

        public validate(): boolean {
            // I can use class from another 
            let stringValidator: utils.StringValidator = new utils.StringValidator();

            // TODO validation
            return true;
        }
    }
}

我从一开始就采取了这个解决方案,我对此非常满意。直到我发现有时候编译文件的顺序是错误的。是的,我可以手动继续引用其他文件(或使用 _references.ts),但对我来说,这就像回到几年前。我将拥有数百个文件(感谢我的“每个文件一个类”规则)。

此外,“他们说”我可以通过命名空间生成 js 文件,这也是一个很大的优势,因此我可以创建文件 generic.js、app.js 和 admin.js(你知道在哪里使用什么)。

B:第二个解决方案是“正确”使用模块。据我了解,我可以这样写:

import { StringValidator } from "./Utils/StringValidator";

export default class ZipCodeValidator {
    public zipCode: string;

    public validate(): boolean {
        // I can use class from another 
        let stringValidator: StringValidator = new StringValidator();

        // TODO validation
        return true;
    }
}

但这意味着我需要手动导入每个类。尽管事实上智能感知无法使用这种方法正常工作,但如果我省略“default”关键字,我还需要手动指定每个类。另外,我不知道如何根据目录将源代码分离到不同的js文件中。

好吧,你可能会说我误解了 TypeScript。这都是关于模块的,对吧?但我不会满足于“你需要在一个模块中定义所有类”。那是不对的。那时我可以继续使用 JavaScript。

A 的问题:我需要手动跟踪所有文件并保持其正确的顺序。

B 的问题:我需要逐个类导入所有类。解决方案是如果我可以做类似的事情

import * as utils from "./utils/"

但据我了解,这是不可能的。

摘要

您能帮我推向正确的轨道吗?一些工具,也许是一些插件或其他什么?我喜欢 TypeScript 并且想使用它。这些天我只是拒绝做体力活。我希望这个问题能帮助像我这样的其他人。

谢谢

最佳答案

我的方法是使用方法 B 并使用模块。然后,我将所有常见模块收集在包装模块中,然后将它们重新导出,以便轻松导入到其他模块中。

一个例子:

AllUtils.ts

export * from './UtilClass1';
export * from './UtilClass2';
export { UtilClass3 as SomethingElse } from './UtilClass3';

这将允许使用单个导入语句来导入所有类,如下所示:

import * as utils from './AllUtils';

let myUtil = new utils.UtilClass1();

Intellisense 使用这种方法在 VS2015 中为我工作。这样做的额外好处是您可以在重新导出时省略或重命名某些类。您仍然需要将它们一一添加到包装文件中,但这只需要做一次。

关于.net - ASP.NET 项目中 TypeScript 文件和代码的结构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40907759/

相关文章:

android - 从 .net 公开服务以供移动应用程序使用的最佳方式

c# - 为什么不能将 Dictionary<T1, List<T2>> 转换为 Dictionary<T1, IEnumerable<T2>>?

c# - 使用 ASP.NET MVC 发送 500 封电子邮件 : throttling

asp.net-mvc - 在 ASP.NET MVC 5 网站中缓存信息的最安全方法

javascript - 如何将 Angular Material 形式包装到组件中并将它们作为表单控件元素公开给 FormGroup

.net - 我如何传递代表一个操作方法参数的两个不同的查询字符串参数?

c# - C# 4 的协变是否支持泛型的嵌套?

javascript - 创建 2 个图表,在一张图表中显示 2 个不同的数据 (asp.net MVC)

javascript - Angular:mat-form-field 必须包含一个 MatFormFieldControl

arrays - 在 JSON 上循环时 "TypeError: Cannot read property ' 名称 ' of undefined"