TypeScript初尝试

用TypeScript是有背景的，其实是想让我们的后端开发，逐步的前台走，弱类型的JS，有时候给后端的开发也会带去很多的不便，这篇不是文档，很琐碎，只是记录自己弄的东西。

1. 什么是TypeScript
中文的TypeScript网站是 https://www.tslang.cn/docs/home.html 站点的只是很详细，不过文档我觉得还是面向的是有一些JS基础的人看的。

毕竟是一个C# 常用IDE是VS的开发，首先按照文档的介绍在VS里面配置的TS。

 

安装node
安装npm
创建package.json

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "devDependencies": {
    "del": "^5.1.0",
    "gulp": "^4.0.2",
    "gulp-watch": "^5.0.1",
    "gulp-concat": "^2.6.1",
    "typescript": "^3.6.2",
    "gulp-typescript": "^5.0.1"
  }
}

使用Gulp编译TS 
创建 gulpfile.js

/// <binding AfterBuild='default' Clean='clean' />
/*
This file is the main entry point for defining Gulp tasks and using Gulp plugins.
Click here to learn more. http://go.microsoft.com/fwlink/?LinkId=518007
*/

var gulp = require('gulp');
var del = require('del');
var watch = require('gulp-watch');
var concat = require('gulp-concat');
var ts = require('gulp-typescript');

var tsProject = ts.createProject("./tsconfig.json");
var paths = {
    files: ['TypeScript/**/*.js', 'TypeScript/**/*.ts', 'TypeScript/**/*.map'],
    tsFiles: ['TypeScript/**/*.ts'],
};

gulp.task('clean', function () {
    return del(['Scripts/ts/**/*']);
});

gulp.task('default', done => {
    gulp.src(paths.tsFiles).pipe(tsProject()).pipe(gulp.dest('Scripts/ts'));
    gulp.src(paths.files).pipe(gulp.dest('Scripts/ts'));
    done();
});

watch(paths.tsFiles, gulp.series('default'));

NuGet 安装 
jquery.TypeScript.DefinitelyTyped
knockout.TypeScript.DefinitelyTyped

添加TS 文件
一个class .ts
一个实现  .ts
添加tsconfig.json

{
  "baseUrl": ".",
  "compilerOptions": {
    "noImplicitAny": true,
    "noEmitOnError": true,
    "outDir": "./Scripts/ts",
    "sourceMap": true,
    "target": "esnext",
    "module": "amd",
    "baseUrl": ".",
    "outFile": "b.js",
    "allowJs": true
  },
  "files": [
    "TypeScript/app.ts",
    "TypeScript/person.ts"
  ],
  "compileOnSave": true
}

AMD 方式编译代码 使用requirejs加载