Jak ponownie używać istniejących definicji klas C # w projektach TypeScript

Mam zamiar zacząć używać TypeScriptw moim projekcie klienta HTML, który należy do projektu MVC z już istniejącym modelem domeny platformy jednostki. Chcę, aby moje dwa projekty (po stronie klienta i po stronie serwera) były całkowicie oddzielone, ponieważ dwa zespoły będą nad tym pracować ... JSON i REST są używane do komunikacji obiektów w tę iz powrotem.

Oczywiście moje domainobiekty po stronie klienta powinny pasować do obiektów po stronie serwera. W przeszłości zwykle robiłem to ręcznie. Czy istnieje sposób ponownego użycia definicji klas języka C # (szczególnie POJOklas w modelu domeny) w celu utworzenia odpowiednich klas w języku TypeScript ”?

Obecnie nie ma niczego, co zamapuje C # na TypeScript. Jeśli masz dużo POCO lub myślisz, że mogą się one często zmieniać, możesz stworzyć konwerter - coś prostego na wzór ...

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

Do

export class MyPoco {
    public Name: string;
}

Istnieje również dyskusja w Codeplex o automatycznym generowaniu z C # .

Aby zachować aktualność, TypeLite może generować interfejsy TypeScript z C #:

http://type.litesolutions.net/

Oprogramowanie Web Essentials umożliwia kompilowanie plików C # do .d.tsplików TypeScript przy zapisywaniu. Następnie możesz odwołać się do definicji z .tsplików.

TypeLite i T4TS powyżej oba wyglądały dobrze, po prostu wybrałem jeden, TypeLite, rozwidlił go, aby uzyskać wsparcie

• ValueTypes ,
• Nullables
• camelCasing (główna dokumentacja języka TypeScript używa wielbłądów, a to idzie zbyt dobrze razem z C #)
• pola publiczne (uwielbiają czyste i czytelne POCO, ułatwiają również kompilatorowi C #)
• wyłącz generowanie modułów

Potem potrzebowałem interfejsów C # i pomyślałem, że nadszedł czas, aby upiec własne rzeczy i napisałem prosty skrypt T4, który po prostu robi to, czego potrzebuję. Obejmuje również wyliczenia . Nie jest wymagane repozytorium, tylko <100 linii T4.

Użycie
Brak biblioteki, brak pakietu NuGet, tylko ten zwykły, prosty plik T4 - użyj opcji „dodaj element” w programie Visual Studio i wybierz dowolny szablon T4. Następnie wklej to do pliku. Dostosuj każdą linię z „ACME” w niej. Dla każdej klasy C # dodaj linię

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

Kolejność ma znaczenie, każdy znany typ zostanie użyty w kolejnych interfejsach. Jeśli używasz tylko interfejsów, rozszerzenie pliku może być .d.ts , dla wyliczeń potrzebny jest plik .ts , ponieważ tworzona jest instancja zmiennej.

Dostosowywanie
Zhakuj skrypt.

<#@ 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();
    }
#>

Kolejnym poziomem skryptu będzie stworzenie interfejsu usługi z klasy MVC JsonController.

Jeśli używasz vscode, możesz użyć mojego rozszerzenia csharp2ts, które robi dokładnie to.

Wystarczy zaznaczyć wklejony kod C # i uruchomić Convert C# to TypeScriptpolecenie z palety poleceń Przykład konwersji:

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

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

do

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

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

Oto moje podejście do rozwiązania tego problemu. Zadeklaruj swoje klasy C # z atrybutem, a pliki .d.ts zostaną wygenerowane (przy użyciu transformacji T4). W witrynie nuget znajduje się pakiet, a źródło jest dostępne na github . Nadal pracuję nad projektem, ale wsparcie jest dość obszerne.

Jeśli używasz programu Visual Studio, dodaj rozszerzenie Maszyna do pisania.

Galeria programu Visual Studio

Witryna internetowa / Dokumentacja

Aktualizacja

Po zainstalowaniu programu Web Essentials w programie VS 2015 można kliknąć prawym przyciskiem myszy plik klasy, a następnie z menu kontekstowego wybrać> Web Essentials> Utwórz plik Typescript Intellisense.

Wypróbuj framework Reinforced.Typings. Wygląda na to, że to rozwiązuje Twój problem.

1. Zainstaluj go z NuGet

2. Przejdź do swojego POCO i dodaj [TsInterface]atrybut nad nim

   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. Odbuduj swój projekt

4. Znajdź wygenerowany kod TypeScript w %Your_Project_Directory%/Scripts/project.tspliku i dodaj go do projektu ręcznie

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

5. Zrób to samo dla wszystkich POCO i referencji project.ts w innym kodzie TypeScript.

Zobacz więcej szczegółów w dokumentacji wiki

Stworzyłem małe narzędzie, które może generować interfejsy TypeScript z klas C #. Jest dostępny jako pakiet NuGet . Szczegółową dokumentację można znaleźć na stronie projektu .

Proszę spojrzeć na tę bibliotekę Maszyna do pisania

Konwertuje nie tylko klasy, wyliczenia, interfejsy itp., Ale także kontrolery API, co jest po prostu niesamowite.

Dodatkowo robi to zaraz po zapisaniu źródłowego pliku .cs, więc nie muszę uruchamiać żadnego zewnętrznego narzędzia. Zapisz plik .cs, a otrzymasz zaktualizowany plik .ts

Mam małe rozwiązanie, które wykorzystuje szablony T4 ( zobacz źródło ).

Idziesz z dowolnego CLR POCO:

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

Do interfejsu TypeScript:

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

Możesz użyć projektu NSwag typu open source : w GUI możesz wybrać klasę .NET z istniejącej biblioteki DLL .NET i wygenerować dla niej interfejs TypeScript.

Projekt zapewnia również narzędzia wiersza poleceń i obsługę szablonów T4, a także generowanie kodu klienta dla kontrolerów Web API ...

Jeśli chcesz utworzyć oddzielny plik dla każdej wygenerowanej klasy / interfejsu TypeScript (tj. W sposób „pojedyncza klasa na plik”), możesz wypróbować TypeGen . Jest to narzędzie, którego można używać z poziomu konsoli Menedżera pakietów do generowania plików TypeScript na podstawie klas / wyliczeń C #. Obecnie obsługuje:

• eksportowanie wyliczeń; eksportowanie POCO jako klas TS lub interfejsów
• dziedzictwo
• typy ogólne
• kolekcja / zagnieżdżone typy kolekcji

plus kilka dodatkowych funkcji. Jest to również open source (możesz to sprawdzić na github ).

A co na odwrót?

Sprawdź erecruit TypeScript Translator . Jest wyposażony w gotową obsługę C #, ale w rzeczywistości jest oparty na szablonach (używa Nunjucks do renderowania), co oznacza, że ​​może generować wszystko inne - VB.NET, F #, C ++, XML, SQL - wszystko, co możesz zakodować za pomocą szablonu.

Działa jako program konsoli .NET, program NodeJS (dla tych spoza systemu Windows) lub jako rozszerzenie programu Visual Studio , wraz z funkcją generowania przy zapisywaniu. Obejmuje również obsługę MSBuild, aby Twój serwer kompilacji był zadowolony. :-)

Możesz również użyć tego: https://github.com/pankleks/TypeScriptBuilder

Ta mała biblioteka generuje definicję typu TypeScript na podstawie typów C #. Użyj go bezpośrednio w projekcie C # zaplecza, aby wygenerować kod dla projektu frontendowego TypeScript. Możesz również napisać małą aplikację konsolową, aby wygenerować kod za pomocą narzędzi do kompilacji wstępnej.

Działa na platformie Full & NET Core!

Zainstaluj przez nuget: Install-Package TypeScriptBuilder

Obsługiwane funkcje

• Rozwiązywanie zależności typu
• Generics
• Dziedziczenie typów
• Przestrzenie nazw (moduły)
• Wyliczenia
• Typy zerowe
• Konwergencja słownika (do obiektów indeksowanych TS silnego typu)
• Zestaw atrybutów kontroli generowania kodu
• any dla typów, których nie można konwertować

Więcej opisu: https://github.com/pankleks/TypeScriptBuilder/blob/master/README.md

Chłopaki spójrz na https://github.com/reinforced/ Reinforced.Typings . Bawiłem się szablonami Typelite i T4 przez ostatnie kilka dni i skończyłem z tym projektem. Jest bardzo prosty i działa jak urok. Po prostu pobierz pakiet, zmodyfikuj plik konfiguracyjny (jest to około 10 sekund) i zbuduj. Wszystko odbywa się automatycznie, bez żadnych problemów. Pobłogosław autora!

Wadą szablonów T4 jest to, że po skompilowaniu z VS zeskanowane zestawy są zablokowane i trzeba ponownie uruchomić VS (jakie to głupie?). Istnieją pewne obejścia w T4 Toolbox + niektóre dyrektywy czyszczenia VS, ale żadna z nich nie zadziałała.

Podoba mi się rozwiązanie citykid. Trochę go przedłużyłem. Tak więc rozwiązanie jest również oparte na technice kodegeneracji z szablonami T4.

Może generować typowe typy TypeScript i deklaracje otoczenia.

Obsługuje dziedziczenie i implementacje interfejsów.

Obsługuje typy ogólne, tablice i listy jako pola typu.

Przekłada się również na typy TypeScript, które nie są wyraźnie wymienione w konfiguracji (na przykład importujemy typ A, aw wynikach TS można znaleźć inne typy: typy pól, typy podstawowe i interfejsy).

Możesz także zastąpić nazwę typu.

Obsługiwane są również wyliczenia.

Przykład użycia (można go znaleźć w repozytorium projektu):

// 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" #>

Otrzymasz wynik

//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
}

Sprawdź pełne rozwiązanie tutaj: https://bitbucket.org/chandrush/cst4ts

Możesz także użyć Bridge.net. Od wersji 1.7 obsługuje generowanie definicji TypeScript dla typów C #. Zobacz http://bridge.net/docs/generate-typescript-definitions/

Bardzo podobała mi się również odpowiedź @ citykid, więc rozszerzyłem ją tak, aby zajmowała się jednocześnie całą przestrzenią nazw. Po prostu umieść klasy POCO w przestrzeni nazw i przebuduj szablony T4. Chciałbym wiedzieć, jak wygenerować osobne pliki dla każdego, ale to nie koniec świata.

Musisz odwołać się do plików .DLL w górnej części (tam, gdzie chcesz, aby klasy) i musisz wspomnieć o przestrzeniach nazw. Wszystkie linie do edycji są oznaczone ACME. Wielkie cuda dla @citykid, doceniam to!

<#@ 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();
    }
#>

Moim rozwiązaniem było napisanie małego narzędzia do kodowania, które po prostu pobiera zestaw projektu (i odwołuje się do zestawów) i rozpoczyna skanowanie typów, które są zaangażowane w interakcję między skryptem maszynowym a językiem C #. To narzędzie generuje zarówno javascript jako d.ts ... To narzędzie jest wywoływane w zdarzeniu post-build ... działa jak urok!

Jeśli jesteś zainteresowany, możesz użyć TypedRpc . Jego celem jest nie tylko tworzenie interfejsów w języku TypeScript, ale tworzenie całej komunikacji z usługą w .Net przy użyciu protokołu JsonRpc.

Przykład zajęć na serwerze:

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

Wykorzystanie wygenerowanego kodu 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);

Sprawdź https://github.com/Rodris/TypedRpc, aby zobaczyć inne przykłady, jak z niego korzystać.

Generatory klientów ASP.NET Web API mogą być wygodniejsze i mniej obciążać niż Swagger Toolchain i inne podczas SDLC.

Podczas gdy programiści generalnie używają WebApiClientGen do generowania kodów API klienta, ten projekt zapewnia również POCO2TS.exe, program wiersza polecenia, który generuje interfejsy TypsScript z klas POCO. Możesz użyć Poco2ts.exe lub komponentu poco2ts, aby zintegrować generowanie kodu z potokiem kompilacji.

Jeśli chcesz przekonwertować go za pomocą node.js, możesz użyć tego pakietu (csharp-to-typescript). https://www.npmjs.com/package/csharp-to-typescript

kod źródłowy: 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;
}

Jeśli używasz VSCode, możesz rzucić okiem na to rozszerzenie C # do TypeScript

Zobacz, jak mogę przekonwertować go z kodu C # jednym kliknięciem. Oczywiście nie wszystkie klasy zostaną przekonwertowane, tak jak fabryka, ale jest to wystarczająco dobre dla klienta. Potrzebujemy tylko kształtu danych. Czasami, jeśli potrzebuję użyć wzoru gościa, ozdobię dodatkowymi metodami, których potrzebuję. Zajęło to tylko 5 sekund. W porównaniu z minutą powyżej, mogę powiedzieć, że to duża wygrana.

Zobacz więcej szczegółów w moim poście na blogu