使用 Gulp 将 JSON 配置为 TypeScript 类答案

【问题标题】：JSON configuration toTypeScript class with Gulp使用 Gulp 将 JSON 配置为 TypeScript 类
【发布时间】：2017-12-26 23:39:06
【问题描述】：

我正在尝试使用 gulp 任务从 JSON 配置创建一个打字稿类。

input

    {
      "ApiEndpoint": "http://localhost:5000/api"
    }

希望得到类似的输出

  public static get ApiEndpoint(): string {
    return "http://localhost:5000/api";
  }

尝试使用 gulp-ts-config 但它在 template.ts 中引发错误。不知何故，我无法让它在我的系统中工作。有没有其他的 gulp 插件可以通过我们实现相同的功能？

【问题讨论】：

你用gulp-ts-config插件试过什么？您应该知道，这里不是要求工具推荐的地方。
我可以知道你为什么想要这种类型的输出吗？

标签： typescript gulp

【解决方案1】：

我的 package.json

{
    "devDependencies": {
        "gulp": "3.9.1",
        "gulp-ts-config": "1.0.15"
    }
}

我的 gulpfile.js

var gulp = require('gulp');
var gulpTsConfig = require('gulp-ts-config');

gulp.task('test', function () {
    gulp.src('appsettings.json')
        .pipe(gulpTsConfig('AppSettings'))
        .pipe(gulp.dest('Scripts'))
});

appSettings.json

{
    "ApiEndpoint": "http://localhost:5000/api"
}

运行任务后创建的打字稿

export class AppSettings {

  public static get ApiEndpoint(): string {
    return "http://localhost:5000/api";
  }
}

参考：https://www.npmjs.com/package/gulp-ts-config

如果我将 appSettings.json 更改为包含多个要转换为打字稿函数的对象

{
    "ApiEndpoint": "http://localhost:5000/api",
    "HelloWorld":  "HelloWorld"
}

结果ts文件

export class AppSettings {

  public static get ApiEndpoint(): string {
    return "http://localhost:5000/api";
  }
  public static get HelloWorld(): string {
    return "HelloWorld";
  }
}

您从 gulp-ts-config 收到的具体错误是什么？我正在使用带有 npm 版本 5.5.1 和节点版本 v8.9.3 的 Visual Studio 2017

【讨论】：