zoukankan      html  css  js  c++  java
  • TypeScript初尝试

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

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

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

    安装node
    安装npm
    创建package.json

     1 {
     2   "version": "1.0.0",
     3   "name": "asp.net",
     4   "private": true,
     5   "devDependencies": {
     6     "del": "^5.1.0",
     7     "gulp": "^4.0.2",
     8     "gulp-watch": "^5.0.1",
     9     "gulp-concat": "^2.6.1",
    10     "typescript": "^3.6.2",
    11     "gulp-typescript": "^5.0.1"
    12   }
    13 }

    使用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加载

  • 相关阅读:
    POJ 2723 Get Luffy Out(2-SAT)
    ZOJ 3613 Wormhole Transport
    HDU 4085 Peach Blossom Spring
    NBUT 1221 Intermediary
    NBUT 1223 Friends number
    NBUT 1220 SPY
    NBUT 1218 You are my brother
    PAT 1131. Subway Map (30)
    ZSTU OJ 4273 玩具
    ZSTU OJ 4272 最佳淘汰算法
  • 原文地址:https://www.cnblogs.com/guojian/p/11458952.html
Copyright © 2011-2022 走看看