WebTyped is a tool for generating strongly typed TypeScript code from your http://ASP.NET or http://ASP.NET/core Web Apis.


Keywords
TypeScript, ASP.NET Web API, generator, transpiler, angular, fetch, jQuery, C#
License
MIT
Install
npm install @guimabdo/webtyped@0.30.0-dev.8

Documentation

Build Status

WebTyped Latest version

WebTyped is a tool for generating strongly typed TypeScript code from your http://ASP.NET or http://ASP.NET/core Web Apis.

Quick Start

npm install @guimabdo/webtyped -g
npm install @guimabdo/webtyped-common

Create a webtyped.json configuration file in your project. Example:

{
	"files": [
		"../Controllers/**/*.cs",
		"../Models/**/*.cs"
	]
}

At the command line, run webtyped:

webtyped

Or use 'watch' option for generating typescript code and start watching cs files:

webtyped watch

Use generated services wherever you want:

import { MyService } from './webtyped/<services-folder>';
import { WebTypedFetchInvoker } from "@guimabdo/webtyped-common";

let inv = new WebTypedFetchInvoker(<api-base-url>);
let myService = new MyService(inv); //Generated from MyController.cs
myService.get().then(result => console.log(result));

Angular

npm install @guimabdo/webtyped-angular

webtyped.json

{
	"files": [
		"../Controllers/**/*.cs",
		"../Models/**/*.cs"
	],
	"inject": {
		"beforeServiceClass": [
			"import { Injectable } from '@angular/core';",
			"@Injectable({ providedIn: 'root' })"
		]
	},
}

Import the generated module and inject services when needed:

app.module.ts

import { WebTypedNgModule } from '@guimabdo/webtyped-angular';
@NgModule({
	imports: [
		WebTypedNgModule.forRoot()
	],
	//Optionally set api base. Default is './'
	providers: [
		{
			provide: 'API_BASE_URL',
			useValue: '<url>'
		}
	]
})
export class AppModule {}

Usage:

some.component.ts (for example)

import { MyService } from './webtyped/<services-folder>';
@Component({...})
export class SomeComponent {
	constructor(myService: MyService){}
}

Requirements

netcore 2.0 on dev machine