Как повторно использовать существующие определения классов C # в проектах TypeScript

Я просто собираюсь начать использовать TypeScriptсвой клиентский проект HTML, который принадлежит проекту MVC с уже существующей моделью предметной области. Я хочу, чтобы мои два проекта (клиентская и серверная) были полностью разделены, так как над этим будут работать две команды ... JSON и REST используются для передачи объектов туда и обратно.

Конечно, мои domainобъекты на стороне клиента должны соответствовать объектам на стороне сервера. Раньше я обычно делал это вручную. Есть ли способ повторно использовать определения моих классов C # (особенно POJOклассов в моей модели предметной области) для создания соответствующих классов в TypeScript »?

В настоящее время нет ничего, что отображало бы C # в TypeScript. Если у вас много POCO или вы думаете, что они могут часто меняться, вы можете создать конвертер - что-то простое вроде ...

public class MyPoco {
    public string Name { get; set; }
}

к

export class MyPoco {
    public Name: string;
}

На Codeplex также обсуждается автоматическая генерация из C # .

Чтобы держать вещи в курсе, TypeLite может генерировать интерфейсы TypeScript из C #:

http://type.litesolutions.net/

Web Essentials позволяет компилировать файлы C # в файлы TypeScript .d.tsпри сохранении. Затем вы можете ссылаться на определения из своих .tsфайлов.

Оба TypeLite и T4TS выглядели хорошо, просто выбрал один, TypeLite, разветвил его, чтобы получить поддержку

• ValueTypes ,
• Nullables
• camelCasing (в корневом документе TypeScript используются верблюды, и это слишком хорошо сочетается с C #)
• общедоступные поля (люблю чистые и читаемые POCO, которые также упрощают компилятор C #)
• отключить генерацию модуля

Затем мне понадобились интерфейсы C #, и я подумал, что пора испечь свою вещь, и написал простой сценарий T4, который делает то, что мне нужно. Он также включает перечисления . Репо не требуется, всего <100 строк T4.

Использование
Нет библиотеки, нет NuGet, только простой простой файл T4 - используйте «добавить элемент» в Visual Studio и выберите любой шаблон T4. Затем вставьте это в файл. Адаптируйте каждую строчку, добавив в нее «ACME». Для каждого класса C # добавьте строку

<#= Interface<Acme.Duck>() #>

Порядок имеет значение, в следующих интерфейсах будет использоваться любой известный тип. Если вы используете только интерфейсы, расширение файла может быть .d.ts , для перечислений вам понадобится файл .ts , поскольку создается экземпляр переменной.

Кастомизация
Взломайте скрипт.

<#@ template debug="true" hostSpecific="true" language="C#" #>
<#@ output extension=".ts" #>
<#@ Assembly Name="System.Core.dll" #>
<#@ assembly name="$(TargetDir)ACME.Core.dll" #>
<#@ import namespace="System" #>
<#@ import namespace="System.Reflection" #>
<#@ import namespace="System.Collections.Generic" #>
<#@ import namespace="System.Text" #>
<#@ import namespace="System.Linq" #>

<#= Interface<Acme.Bunny>() #>
<#= Interface<Acme.Duck>() #>
<#= Interface<Acme.Birdy>() #>
<#= Enums<Acme.CarrotGrade>() #>
<#= Interface<Acme.LinkParticle>() #>

<#+  
    List<Type> knownTypes = new List<Type>();

    string Interface<T>()
    {   
        Type t = typeof(T);     
        var sb = new StringBuilder();
        sb.AppendFormat("interface {0} {{\n", t.Name);
        foreach (var mi in GetInterfaceMembers(t))
        {
            sb.AppendFormat("  {0}: {1};\n", this.ToCamelCase(mi.Name), GetTypeName(mi));
        }
        sb.AppendLine("}");
        knownTypes.Add(t);
        return sb.ToString();
    }

    IEnumerable<MemberInfo> GetInterfaceMembers(Type type)
    {
        return type.GetMembers(BindingFlags.Public | BindingFlags.Instance)
            .Where(mi => mi.MemberType == MemberTypes.Field || mi.MemberType == MemberTypes.Property);
    }

    string ToCamelCase(string s)
    {
        if (string.IsNullOrEmpty(s)) return s;
        if (s.Length < 2) return s.ToLowerInvariant();
        return char.ToLowerInvariant(s[0]) + s.Substring(1);
    }

    string GetTypeName(MemberInfo mi)
    {
        Type t = (mi is PropertyInfo) ? ((PropertyInfo)mi).PropertyType : ((FieldInfo)mi).FieldType;
        return this.GetTypeName(t);
    }

    string GetTypeName(Type t)
    {
        if(t.IsPrimitive)
        {
            if (t == typeof(bool)) return "bool";
            if (t == typeof(char)) return "string";
            return "number";
        }
        if (t == typeof(decimal)) return "number";            
        if (t == typeof(string)) return "string";
        if (t.IsArray)
        {            
            var at = t.GetElementType();
            return this.GetTypeName(at) + "[]";
        }
        if(typeof (System.Collections.IEnumerable).IsAssignableFrom(t)) 
        {
            var collectionType = t.GetGenericArguments()[0]; // all my enumerables are typed, so there is a generic argument
            return GetTypeName(collectionType) + "[]";
        }            
        if (Nullable.GetUnderlyingType(t) != null)
        {
            return this.GetTypeName(Nullable.GetUnderlyingType(t));
        }
        if(t.IsEnum) return "number";
        if(knownTypes.Contains(t)) return t.Name;
        return "any";
    }

    string Enums<T>() // Enums<>, since Enum<> is not allowed.
    {
        Type t = typeof(T);        
        var sb = new StringBuilder();        
        int[] values = (int[])Enum.GetValues(t);
        sb.AppendLine("var " + t.Name + " = {");
        foreach(var val in values) 
        {
            var name = Enum.GetName(typeof(T), val);
            sb.AppendFormat("{0}: {1},\n", name, val);
        }
        sb.AppendLine("}");
        return sb.ToString();
    }
#>

Следующим уровнем сценария будет создание интерфейса службы из класса MVC JsonController.

Если вы используете vscode, вы можете использовать мое расширение csharp2ts, которое делает именно это.

Вы просто выбираете вставленный код C # и запускаете Convert C# to TypeScriptкоманду из палитры команд. Пример преобразования:

public class Person
{
    /// <summary>
    /// Primary key
    /// </summary>
    public int Id { get; set; }

    /// <summary>
    /// Person name
    /// </summary>
    public string Name { get; set; }
}

в

export interface Person
{
    /**Primary key */
    Id : number;

    /**Person name */
    Name : string;
}

Вот мой подход к ее решению. Объявите свои классы C # с атрибутом, и будут созданы файлы .d.ts (с использованием преобразований T4). На nuget есть пакет, а исходный код доступен на github . Я все еще работаю над проектом, но поддержка довольно обширная.

Если вы используете Visual Studio, добавьте расширение Typewriter.

Галерея Visual Studio

Веб-сайт / Документация

Обновить

Если Web Essentials установлен в VS 2015, вы можете щелкнуть правой кнопкой мыши файл класса, затем> Web Essentials> Создать файл Typescript Intellisense из контекстного меню.

Попробуйте фреймворк Reinforced.Typings. Кажется, это решает вашу проблему.

1. Установите его из NuGet

2. Перейдите к своему POCO и добавьте [TsInterface]атрибут над ним

   using Reinforced.Typings.Attributes;
   namespace YourNamespace {
       [TsInterface]
       public class YourPoco
       {
           public int YourNumber { get;set; }
           public string YourString { get;set; }
           public List<string> YourArray { get;set; }
           public Dictionary<int, object> YourDictionary { get;set; }
       }
   }

3. Восстановите свой проект

4. Найдите сгенерированный код TypeScript в %Your_Project_Directory%/Scripts/project.tsфайле и добавьте его в проект вручную

   module YourNamespace {
       export interface IYourPoco
       {
           YourNumber: number;
           YourString: string;
           YourArray: string[];
           YourDictionary: { [key: int]: any };
       }
   }

5. Сделайте то же самое для всех ваших POCO и ссылки project.tsв другом коде TypeScript.

См. Более подробную информацию в документации wiki

Я создал небольшую утилиту, которая может генерировать интерфейсы TypeScript из классов C #. Доступен в виде пакета NuGet . Подробную документацию можно найти на веб-странице проекта .

Пожалуйста, взгляните на эту библиотеку Пишущая машинка

Он конвертирует не только классы, перечисления, интерфейсы и т. Д., Но и контроллеры api, что просто потрясающе.

Кроме того, он делает это, как только вы сохраняете исходный файл .cs, поэтому мне не нужно запускать какой-либо внешний инструмент. Сохраните .cs, и вы получите обновленный .ts

У меня есть небольшое решение, использующее шаблоны T4 ( исходный код ).

Вы переходите из любого CLR POCO:

public class Parent : Person
{
    public string Name { get; set; }
    public bool? IsGoodParent { get; set; }
    public virtual ICollection<Child> Children { get; set; }
}

В интерфейс TypeScript:

///<reference path="Child.d.ts" />
///<reference path="Person.d.ts" />
interface Parent extends Person {
    Name : string;
    IsGoodParent? : bool;
    Children : Child[];
}

Вы можете использовать проект с открытым исходным кодом NSwag : в графическом интерфейсе вы можете выбрать класс .NET из существующей .NET DLL и сгенерировать для него интерфейс TypeScript.

Проект также предоставляет инструменты командной строки и поддержку шаблонов T4, а также создание клиентского кода для контроллеров веб-API ...

Если вам нужно создать отдельный файл для каждого сгенерированного класса / интерфейса TypeScript (т. Е. Способом «один класс на файл»), вы можете попробовать TypeGen . Это инструмент, который вы можете использовать из консоли диспетчера пакетов для создания файлов TypeScript на основе ваших классов / перечислений C #. В настоящее время он поддерживает:

• экспорт перечислений; экспорт POCO в виде классов TS или интерфейсов
• наследование
• общие типы
• типы коллекций / вложенных коллекций

плюс некоторые дополнительные функции. Это также открытый исходный код (вы можете проверить это на github ).

А как насчет другого пути?

Ознакомьтесь с erecruit TypeScript Translator . Он поставляется с готовой к использованию поддержкой C #, но на самом деле основан на шаблоне (использует Nunjucks для рендеринга), что означает, что он может генерировать что угодно - VB.NET, F #, C ++, XML, SQL - все, что вы можете кодировать с помощью шаблона.

Работает как консольная программа .NET, программа NodeJS (для тех, кто не работает в Windows) или как расширение Visual Studio с функцией создания при сохранении. И включает поддержку MSBuild, чтобы сделать ваш сервер сборки счастливым. :-)

Вы также можете использовать это: https://github.com/pankleks/TypeScriptBuilder

Эта небольшая библиотека генерирует определение типа TypeScript на основе типов C #. Используйте его непосредственно в своем внутреннем проекте C #, чтобы сгенерировать код для своего внешнего проекта TypeScript. Вы также можете написать небольшое консольное приложение для генерации кода с помощью инструментов предварительной сборки.

Работает на платформе Full & NET Core!

Установить с помощью nuget: Install-Package TypeScriptBuilder

Поддерживаемые функции

• Разрешение зависимости типа
• Дженерики
• Наследование типов
• Пространства имен (модули)
• Перечисления
• Обнуляемые типы
• Преобразование словаря (в индексированные объекты TS строгого типа)
• Набор атрибутов управления генерацией кода
• any для типов, которые не могут быть преобразованы

Подробное описание: https://github.com/pankleks/TypeScriptBuilder/blob/master/README.md

Ребят посмотрите https://github.com/reinformed/ Reinformed.Typings . Я играл с шаблонами typelite и t4 последние несколько дней и в итоге остановился на этом проекте. Это очень просто и работает как шарм. Просто получите пакет, измените конфигурационный файл (примерно 10 секунд) и соберите. Все делается автоматически без каких-либо проблем. Благослови автора!

Плохая вещь в шаблонах T4 заключается в том, что после сборки из VS отсканированные сборки блокируются, и вы должны перезапускать VS (насколько это глупо?). В T4 Toolbox есть обходные пути + некоторые директивы очистки VS, но ни один из них не помог мне.

Мне нравится решение citykid. Пришлось немного расширить. Итак, решение также основано на методике генерации кода с помощью шаблонов T4.

Он может генерировать общие типы TypeScript и внешние объявления.

Он поддерживает наследование и реализации интерфейса.

Поддерживает универсальные шаблоны, массивы и списки как поля типа.

Также он переводится в типы TypeScript, которые явно не упоминаются в конфигурации (например, мы импортируем тип A, а в выводе TS вы можете найти некоторые другие типы: типы полей, базовые типы и интерфейсы).

Вы также можете переопределить имя типа.

Также поддерживаются перечисления.

Пример использования (его можно найти в репозитории проекта):

// set extension of the generated TS file
<#@ output extension=".d.ts" #>

// choose the type of TS import TsMode.Ambient || TsMode.Class
<# var tsBuilder = new TsBuilder(TsMode.Ambient); #>

// reference assembly with the c# types to be transformed
<#@ assembly name="$(SolutionDir)artifacts\...\CsT4Ts.Tests.dll" #>

// reference namespaces
<#@ import namespace="CsT4Ts.Tests" #>
<#
    //add types to processing
    tsBuilder.ConsiderType(typeof(PresetDTOBase), "PresetBase");
    tsBuilder.ConsiderType(typeof(PresetDTO), "Preset");
    tsBuilder.ConsiderType(typeof(TestInterface<,>));
#>

// include file with transformation algorithms
<#@ include file="CsT4Ts.t4" #>

И вы получите вывод

//CsT4Ts.Tests.PresetDTOBase => PresetBase
// CsT4Ts.Tests.PresetDTO => Preset
// CsT4Ts.Tests.TestInterface`2 => TestInterface
// CsT4Ts.Tests.TestEnum => TestEnum

declare class PresetBase
{
    PresetId: string;
    Title: string;
    InterviewDate: string;
}

declare class Preset extends PresetBase
{
    QuestionsIds: string[];
}

declare interface TestInterface<TA, TB>
{
    A: string;
    B: number;
    C: TestEnum;
    D: TestEnum[];
    E: number[];
    F: TA;
    G: TB[];
}

declare enum TestEnum
{
    Foo = 10,
    Boo = 100
}

Проверьте полное решение здесь: https://bitbucket.org/chandrush/cst4ts

Вы также можете использовать Bridge.net. Начиная с версии 1.7 он поддерживает создание определений TypeScript для типов C #. См. Http://bridge.net/docs/generate-typescript-definitions/

Мне также очень понравился ответ @citykid, поэтому я расширил его, чтобы делать все пространство имен за раз. Просто поместите классы POCO в пространство имен и перестройте шаблоны T4. Хотел бы я знать, как создавать отдельные файлы для каждого, но это не конец света.

Вам нужно сослаться на файлы .DLL в верхней части (где находятся нужные вам классы) и указать пространства имен. Все строки для редактирования отмечены ACME. Большое спасибо @citykid, ценю это!

<#@ template debug="true" hostSpecific="true" language="C#" #>
<#@ output extension=".ts" #>
<#@ Assembly Name="System.Core.dll" #>
<#@ assembly name="$(TargetDir)YOUR_DLL_NAME_HERE_ACME.dll" #>
<#@ assembly name="$(TargetDir)YOUR_OTHER_DLL_NAME_HERE_ACME.dll" #>
<#@ assembly name="$(TargetDir)YOUR_OTHER_DLL_NAME_HERE_ACME.dll" #>
<#@ assembly name="$(TargetDir)YOUR_OTHER_DLL_NAME_HERE_ACME.dll" #>
<#@ import namespace="System" #>
<#@ import namespace="System.Reflection" #>
<#@ import namespace="System.Collections.Generic" #>
<#@ import namespace="System.Text" #>
<#@ import namespace="System.Linq" #>
<#@ import namespace="System.Reflection" #>

<#= Process("My.Very.Special.Namespace.ACME") #>
<#= Process("My.Other.Very.Special.Namespace.ACME") #>
<#= Process("My.Other.Very.Special.Namespace.ACME") #>
<#= Process("My.Other.Very.Special.Namespace.ACME") #>

<#+  

    List<Type> knownTypes = new List<Type>();

    string Process(string nameSpace) {
      var allass = AppDomain.CurrentDomain.GetAssemblies();
      var ss = "";
      foreach (var ass in allass)
      {
         ss += ProcessAssembly(ass, nameSpace);
      }
      return ss;
    }

   string ProcessAssembly(Assembly asm, string nameSpace) {
      try {
            Type[] types;
            try
            {
                types = asm.GetTypes();
            }
            catch (ReflectionTypeLoadException e)
            {
                types = e.Types;
            }
            var s = "";
            foreach (var t in types.Where(t => t != null))
            {
               try {

               if (String.Equals(t.Namespace, nameSpace, StringComparison.Ordinal))
               {
                    s += InterfaceOfType(t);
               }

               } catch (Exception e)
               {
               }
            }
            return s;      
      }
      catch (Exception ee2) {
        return "// ERROR LOADING TYPES: " + ee2;
      }

   }

    string InterfaceOfType(Type T)
    {   
        Type t = T;     
        var sb = new StringBuilder();
        sb.AppendFormat("interface {0} {{\r\n", t.Name);
        foreach (var mi in GetInterfaceMembers(t))
        {
            sb.AppendFormat("  {0}: {1};\r\n", this.ToCamelCase(mi.Name), GetTypeName(mi));
        }
        sb.AppendLine("}");
        knownTypes.Add(t);
        return sb.ToString();
    }

    string Interface<T>()
    {   
        Type t = typeof(T);     
        var sb = new StringBuilder();
        sb.AppendFormat("interface {0} {{\n", t.Name);
        foreach (var mi in GetInterfaceMembers(t))
        {
            sb.AppendFormat("  {0}: {1};\r\n", this.ToCamelCase(mi.Name), GetTypeName(mi));
        }
        sb.AppendLine("}");
        knownTypes.Add(t);
        return sb.ToString();
    }

    IEnumerable<MemberInfo> GetInterfaceMembers(Type type)
    {
        return type.GetMembers(BindingFlags.Public | BindingFlags.Instance)
            .Where(mi => mi.MemberType == MemberTypes.Field || mi.MemberType == MemberTypes.Property);
    }

    string ToCamelCase(string s)
    {
        if (string.IsNullOrEmpty(s)) return s;
        if (s.Length < 2) return s.ToLowerInvariant();
        return char.ToLowerInvariant(s[0]) + s.Substring(1);
    }

    string GetTypeName(MemberInfo mi)
    {
        Type t = (mi is PropertyInfo) ? ((PropertyInfo)mi).PropertyType : ((FieldInfo)mi).FieldType;
        return this.GetTypeName(t);
    }

    string GetTypeName(Type t)
    {
        if(t.IsPrimitive)
        {
            if (t == typeof(bool)) return "boolean";
            if (t == typeof(char)) return "string";
            return "number";
        }
        if (t == typeof(decimal)) return "number";            
        if (t == typeof(string)) return "string";
        if (t.IsArray)
        {            
            var at = t.GetElementType();
            return this.GetTypeName(at) + "[]";
        }
        if(typeof (System.Collections.IEnumerable).IsAssignableFrom(t)) 
        {
            var collectionType = t.GetGenericArguments()[0]; // all my enumerables are typed, so there is a generic argument
            return GetTypeName(collectionType) + "[]";
        }            
        if (Nullable.GetUnderlyingType(t) != null)
        {
            return this.GetTypeName(Nullable.GetUnderlyingType(t));
        }
        if(t.IsEnum) return "number";
        if(knownTypes.Contains(t)) return t.Name;
        return "any";
    }

    string Enums<T>() // Enums<>, since Enum<> is not allowed.
    {
        Type t = typeof(T);        
        var sb = new StringBuilder();        
        int[] values = (int[])Enum.GetValues(t);
        sb.AppendLine("var " + t.Name + " = {");
        foreach(var val in values) 
        {
            var name = Enum.GetName(typeof(T), val);
            sb.AppendFormat("{0}: {1},\r\n", name, val);
        }
        sb.AppendLine("}");
        return sb.ToString();
    }
#>

Мое решение заключалось в том, чтобы написать небольшую утилиту для генерации кода, которая просто берет сборку проекта (и ссылается на сборки) и запускает сканирование типов, которые участвуют во взаимодействии между машинописным текстом и C #. Эта утилита выводит оба javascript как d.ts ... Инструмент вызывается в событии после сборки ... работает как шарм!

Если интересно, можете использовать TypedRpc . Его цель - не только создать интерфейсы в TypeScript, но и создать все коммуникации со службой в .Net с использованием протокола JsonRpc.

Пример для класса на сервере:

[TypedRpc.TypedRpcHandler]
public class RpcServerExample
{
    public String HelloWorld()
    {
        return "Hello World!";
    }
}

Использование сгенерированного кода TypeScript:

/// <reference path="Scripts/TypedRpc.ts" />

let rpc: TypedRpc.RpcServerExample = new TypedRpc.RpcServerExample();

var callback = function(data, jsonResponse) {
    console.log(data);
};

rpc.HelloWorld().done(callback).fail(callback);

Посетите https://github.com/Rodris/TypedRpc, чтобы узнать о других примерах его использования.

Генераторы клиентов веб-API ASP.NET могут быть более удобными и менее затратными, чем набор инструментов swagger и другие инструменты во время SDLC.

Хотя программисты обычно используют WebApiClientGen для генерации клиентских кодов API, этот проект также предоставляет POCO2TS.exe, программу командной строки, которая генерирует интерфейсы TypsScript из классов POCO. Вы можете использовать либо Poco2ts.exe, либо компонент poco2ts для интеграции генерации кода с конвейером сборки.

Если вы хотите преобразовать его через node.js, вы можете использовать этот пакет (csharp-to-typescript). https://www.npmjs.com/package/csharp-to-typescript

исходный код: https://github.com/YuvrajSagarRana/csharp-to-typescript

eg: 
// After installation, import the package.
var { CsharpToTs, getConfiguration } = require("csharp-to-typescript");

// Use CsharpToTs to convert your source code a. Method one give your source code as string:
const sourceCodeInString =   `public class Address
{
  public int Id {get; set;}
  public string Street { get; set; }
  public string City { get; set; }
}`

var outputTypescript = CsharpToTs(sourceCodeInString, getConfiguration());
console.log(outputTypescript);

// Output is

export class Address
{
  Id: number;
  Street: string;
  City: string;
}

Если вы используете VSCode, вы можете взглянуть на это расширение C # для TypeScript

Посмотрите, как я могу преобразовать его из кода C # одним щелчком мыши. Конечно, не все классы будут преобразованы, например фабрика, но для клиентской стороны этого достаточно. Нам просто нужна форма данных. Иногда, если мне нужно использовать шаблон посетителя, я украсю дополнительными методами, которые мне нужны. Это заняло всего 5 секунд. По сравнению с одной минутой выше, я могу сказать, что это большая победа.

Подробнее см. В моем сообщении в блоге