Como reutilizar definições de classe C # existentes em projetos TypeScript

Vou começar a usar TypeScriptno meu projeto de cliente HTML, que pertence a um projeto MVC com um modelo de domínio de estrutura de entidade já existente. Quero que meus dois projetos (lado do cliente e lado do servidor) sejam totalmente separados, pois duas equipes trabalharão nisso ... JSON e REST são usados ​​para comunicar objetos de um lado para outro.

Obviamente, meus domainobjetos no lado do cliente devem corresponder aos objetos no lado do servidor. No passado, eu normalmente fazia isso manualmente. Existe uma maneira de reutilizar minhas definições de classe C # (especialmente das POJOclasses no meu modelo de domínio) para criar as classes correspondentes no TypeScript "?

No momento, não há nada que mapeie C # para TypeScript. Se você tem muitos POCOs ou acha que eles podem mudar com frequência, pode criar um conversor - algo simples ao longo das linhas de ...

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

Para

export class MyPoco {
    public Name: string;
}

Há também uma discussão no Codeplex sobre a geração automática de c # .

Apenas para manter as coisas atualizadas, o TypeLite pode gerar interfaces TypeScript a partir do C #:

http://type.litesolutions.net/

O Web Essentials permite compilar arquivos C # em arquivos TypeScript .d.tsao salvar. Então você pode fazer referência às definições dos seus .tsarquivos.

TypeLite e T4TSs acima pareciam bons, basta escolher um, TypeLite, bifurcou-o para obter suporte para

• ValueTypes ,
• Anuláveis
• camelCasing (o documento raiz TypeScript usa camelos, e isso é muito bom em conjunto com C #)
• campos públicos (amam POCOs limpos e legíveis, também facilita o compilador C #)
• desativar a geração do módulo

Então eu precisava de interfaces C # e pensei que era hora de preparar minhas próprias coisas e escrevi um script T4 simples que apenas faz o que eu preciso. Também inclui Enums . Não é necessário repo, apenas <100 linhas de T4.

Uso
Nenhuma biblioteca, nenhum NuGet, apenas este arquivo T4 simples e simples - use "adicionar item" no Visual Studio e escolha qualquer modelo T4. Em seguida, cole isso no arquivo Adapte todas as linhas com "ACME". Para cada classe C #, adicione uma linha

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

A ordem importa, qualquer tipo conhecido será usado nas seguintes interfaces. Se você usar apenas interfaces, a extensão do arquivo poderá ser .d.ts . Para enumerações, você precisará de um arquivo .ts , pois uma variável é instanciada.

Personalização
Hackeie o script.

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

O próximo nível do script será criar a interface de serviço da classe MVC JsonController.

Se você usa o vscode, pode usar minha extensão csharp2ts, que faz exatamente isso.

Você acabou de selecionar o código C # colado e executar o Convert C# to TypeScriptcomando na paleta de comandos Um exemplo de conversão:

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

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

para

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

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

Aqui está a minha abordagem para resolvê-lo. Declare suas classes C # com um atributo e os arquivos .d.ts serão gerados (usando transformações T4). Há um pacote no nuget e a fonte está disponível no github . Ainda estou trabalhando no projeto, mas o suporte é bastante extenso.

Se você estiver usando o Visual Studio, adicione a extensão Typewriter.

Galeria do Visual Studio

Site / Documentação

Atualizar

Com o Web Essentials instalado no VS 2015, você pode clicar com o botão direito do mouse no arquivo de classe e, em seguida,> Web Essentials> Criar arquivo Typescript Intellisense no menu de contexto.

Experimente o framework Reinforced.Typings. Parece que resolve o seu problema.

1. Instale-o no NuGet

2. Navegue até o seu POCO e adicione o [TsInterface]atributo acima dele

   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. Reconstrua seu projeto

4. Descubra o código TypeScript gerado no %Your_Project_Directory%/Scripts/project.tsarquivo e adicione-o ao projeto manualmente

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

5. Faça o mesmo para todos os seus POCOs e faça referência project.tsno seu outro código TypeScript.

Veja mais detalhes na wiki de documentação

Eu criei um pequeno utilitário que pode gerar interfaces TypeScript a partir de classes C #. Está disponível como um pacote NuGet . Documentação detalhada pode ser encontrada na página do projeto .

Por favor, dê uma olhada neste biblioteca Typewriter

Ele converte não apenas classes, enumerações, interfaces, etc., mas também os controladores de API, o que é simplesmente incrível.

Além disso, ele faz isso assim que você salva o arquivo .cs de origem, para que não precise acionar nenhuma ferramenta externa. Salve .cs e você será atualizado .ts

Eu tenho uma pequena solução que usa modelos T4 ( ver código-fonte ).

Você vai de qualquer CLR POCO:

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

Para uma interface TypeScript:

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

Você pode usar o projeto de código aberto NSwag : Na GUI, você pode selecionar a classe .NET de uma DLL .NET existente e gerar a interface TypeScript para ela.

O projeto também fornece ferramentas de linha de comando e suporte para modelos T4, bem como geração de código de cliente para controladores de API da Web ...

Se você precisar criar um arquivo separado para cada classe / interface TypeScript gerada (por exemplo, de uma "classe única por arquivo"), tente o TypeGen . É uma ferramenta que você pode usar no Console do Gerenciador de Pacotes para gerar arquivos TypeScript com base em suas classes / enums de C #. Atualmente, ele suporta:

• exportando enums; exportando POCOs como classes ou interfaces TS
• herança
• tipos genéricos
• tipos de coleção / coleção aninhada

além de alguns recursos adicionais. Também é de código aberto (você pode conferir no github ).

E o contrário?

Confira erecruit TypeScript Translator . Ele vem com suporte para C # pronto para uso, mas na verdade é baseado em modelo (usa Nunjucks para renderização), o que significa que pode gerar qualquer outra coisa - VB.NET, F #, C ++, XML, SQL - o que você puder codificar com um modelo.

Funciona como um programa de console .NET, programa NodeJS (para aqueles que não estão no Windows) ou como uma extensão do Visual Studio , completa com a funcionalidade de gerar em salvar. E inclui suporte ao MSBuild, apenas para deixar seu servidor de compilação feliz. :-)

Você também pode usar isso: https://github.com/pankleks/TypeScriptBuilder

Essa pequena biblioteca gera a definição de tipo TypeScript com base nos tipos C #. Use-o diretamente no seu projeto C # de back-end para gerar código para o seu projeto TypeScript de front-end. Você também pode escrever um aplicativo de console pequeno para gerar código usando ferramentas de pré-compilação.

Funciona na estrutura Full & NET Core!

Instalar por nuget: Install-Package TypeScriptBuilder

Funcionalidades suportadas

• Resolvendo dependência de tipo
• Genéricos
• Herança de tipo
• Namespaces (módulos)
• Enums
• Tipos anuláveis
• Conversão de dicionário (para objetos indexados TS do tipo forte)
• Conjunto de atributos de controle de geração de código
• any para tipos que não podem ser convertidos

Mais descrição: https://github.com/pankleks/TypeScriptBuilder/blob/master/README.md

Os caras dão uma olhada em https://github.com/reinforced/ Reinforced.Typings . Eu tenho jogado com modelos typelite e t4 nos últimos dias e acabei com este projeto. É super simples e funciona como um encanto. Apenas pegue o pacote, modifique o arquivo de configuração (por 10 segundos) e construa. Tudo é feito automaticamente, sem problemas. Abençoe o autor!

O ruim dos modelos T4 é que, uma vez que você constrói a partir do VS, os assemblies digitalizados ficam bloqueados e você deve reiniciar o VS (o quão tolo é isso?). Existem algumas soluções alternativas no T4 Toolbox + algumas diretivas de limpeza do VS, mas nenhuma delas funcionou para mim.

Eu gosto da solução citykid. Eu tinha ampliado um pouco. Portanto, a solução também se baseia na técnica de codegeneração com modelos T4.

Ele pode gerar tipos comuns de TypeScript e declarações de ambiente.

Ele suporta implementações de herança e interface.

Suporta genéricos, matrizes e listas como campos de tipo.

Também se traduz em tipos TypeScript que não são mencionados explicitamente na configuração (por exemplo, importamos o tipo A e na saída TS, você pode encontrar outros tipos: tipos de campos, tipos básicos e interfaces).

Você também pode substituir o nome do tipo.

Enums também são suportadas.

Exemplo de uso (você pode encontrá-lo no repositório do projeto):

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

E você obterá uma saída

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

Verifique a solução completa aqui: https://bitbucket.org/chandrush/cst4ts

Você também pode usar o Bridge.net. Desde a versão 1.7, ele suporta a geração de definições TypeScript para tipos de C #. Consulte http://bridge.net/docs/generate-typescript-definitions/

Eu também gostei muito da resposta do @ citykid, então eu o estendi para criar um espaço de nome inteiro por vez. Basta colocar as classes POCO no espaço para nome e reconstruir os modelos T4. Eu gostaria de saber como gerar arquivos separados para cada um, mas isso não é o fim do mundo.

Você precisa fazer referência aos arquivos .DLL na parte superior (onde estão as classes que deseja) e mencionar os espaços para nome. Todas as linhas para editar estão marcadas com ACME. Principais elogios para @citykid, agradeço!

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

Minha solução foi escrever um pequeno utilitário de codegen que simplesmente pega um assembly de projeto (e faz referência a assemblies) e inicia a varredura de tipos envolvidos na interação entre texto datilografado e c #. Este utilitário gera javascript e d.ts ... A ferramenta é chamada no evento pós-compilação ... funciona como um encanto!

Se estiver interessado, você pode usar o TypedRpc . Seu objetivo não é apenas criar as interfaces no TypeScript, mas criar toda a comunicação com o serviço em .Net usando o protocolo JsonRpc.

Exemplo para uma classe no servidor:

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

Uso do código TypeScript gerado:

/// <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);

Confira https://github.com/Rodris/TypedRpc para outros exemplos de como usá-lo.

Os Geradores de clientes da API da Web do ASP.NET podem ser mais úteis, menos sobrecarga do que o swagger toolchain e outros durante o SDLC.

Embora os programadores geralmente usem o WebApiClientGen para gerar códigos de API do cliente, este projeto também fornece o POCO2TS.exe, um programa de linha de comando que gera interfaces TypsScript a partir das classes POCO. Você pode usar o Poco2ts.exe ou o componente poco2ts para integrar a geração de código ao seu pipeline de compilação.

Se você deseja convertê-lo através do node.js, pode usar este pacote (csharp-to-typescript). https://www.npmjs.com/package/csharp-to-typescript

código-fonte: 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;
}

Se você estiver usando o VSCode, poderá dar uma olhada nessa extensão C # para TypeScript

Veja como eu posso convertê-lo do código C # em apenas um clique. Obviamente, nem todas as classes serão convertidas, como a fábrica, mas elas são boas o suficiente para o lado do cliente. Nós apenas precisamos da forma dos dados. Às vezes, se eu precisar usar o padrão de visitante, decorarei com métodos adicionais necessários. Demorou apenas 5 segundos para fazer isso. Comparando com um minuto acima, eu poderia dizer que é uma grande vitória.

Veja mais detalhes na minha postagem no blog