typescript环境配置即tsconfig.json配置

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

typescript 编辑环境部署

1、typescript 是 JavaScript的一个超集。

2、typescript 编译成 JavaScript的开发环境：

　　方法1、gulp 编译：https://www.jianshu.com/p/6f9219686992 （typescript包作为一个gulp创建，webpack应该也是可以的）

　　方法2、typescript 编译工具： https://www.jianshu.com/p/c4e639296b98 （typescript包作为一个工具）

3、typescript 在node 上自己运行：使用 ts-node 包【里面编译后直接运行了】

4、使用gulp实现typescript得自动化编译【这里就讲下使用gulp来编译ts】：https://www.jianshu.com/p/6f9219686992

　　a、安装 gulp包。（全局gulp已经安装过了）

npm install gulp gulp-typescript typescript --save    // 这里要注意gulp版本的问题，直接安装是最新的包，结果运行gulp命令时，报错。重新安装换了一个版本就没有问题了。

　　b、创建文件：

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "allowJs": false,
    "sourceMap": false,
    "outDir": "./js",
    "noImplicitReturns": false,
    "allowUnreachableCode": false
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "./ts/**/*"
  ]
}

　　c、创建 gulpfile.js 文件（gulp任务文件）：

var gulp = require('gulp');
var ts = require('gulp-typescript')

var tsProject = ts.createProject('./tsconfig.json')

gulp.task('tsc', () => {
  console.log(tsProject.config.include);
  gulp.src(tsProject.config.include)
    .pipe(tsProject())
    .pipe(gulp.dest(tsProject.config.compilerOptions.outDir));
})

gulp.task('default',['tsc'],() => {
  gulp.watch('./ts/**/*.ts',['tsc']);
})