Rocket.Chat 使用 Typescript 的 WebHook

Question

我即将为 Rocket.Chat 编写一个复杂的 Incoming WebHook。为了避免单个文件出现混乱，我使用了 Typescript。 Rocket.Chat 需要一个名为 Script 的 class 和一些预定义的方法，例如 process_incoming_request（一个简单的例子：https://rocket.chat/docs/administrator-guides/integrations/）。

我当前的项目设置如下：

tsconfig.ts

{
  "files": [
    "src/main.ts"
  ],
  "compilerOptions": {
    "noImplicitAny": true,
    "target": "es2015"
  }
}

gulpfile.js

var gulp = require("gulp");
var browserify = require("browserify");
var source = require("vinyl-source-stream");
var tsify = require("tsify");
var uglify = require("gulp-uglify");
var buffer = require("vinyl-buffer");

gulp.task(
    "default",
    function () {
        return browserify({
            basedir: ".",
            debug: true,
            entries: ["src/main.ts"],
            cache: {},
            packageCache: {}
        })
            .plugin(tsify)
            .transform("babelify", {
                presets: ["es2015"],
                extensions: [".ts"]
            })
            .bundle()
            .pipe(source("bundle.js"))
            .pipe(buffer())
            .pipe(uglify())
            .pipe(gulp.dest("dist"));
    }
);

main.ts

import {RequestInterface} from "./Interface/RequestInterface";

class Script {
    process_incoming_request(request: RequestInterface) {
        // some code
    }
}

yarn gulp 过程顺利运行，没有错误，但在 webhook 的脚本部分使用生成的代码时会导致错误：

Incoming WebHook.error script.js:1   
ReferenceError: module is not defined       
at script.js:1:4307       
at Script.runInContext (vm.js:127:20)       
at Script.runInNewContext (vm.js:133:17)       
at getIntegrationScript (app/integrations/server/api/api.js:70:12)       
at Object.executeIntegrationRest (app/integrations/server/api/api.js:166:13)       
at app/api/server/api.js:343:82       
at Meteor.EnvironmentVariable.EVp.withValue (packages/meteor.js:1234:12)       
at Object._internalRouteActionHandler [as action] (app/api/server/api.js:343:39)       
at Route.share.Route.Route._callEndpoint (packages/nimble_restivus/lib/route.coffee:150:32)       
at packages/nimble_restivus/lib/route.coffee:59:33

我不太熟悉 Typescript、Node 和所有东西。所以主要的问题是，我如何才能实现该进程使用方法 process_incoming_request 生成名为 Script 的 class（或暴露 class 的脚本）。我也不确定我的脚本是否产生错误或 RocketChat 部分。

谢谢！

Answer 1

我想问题是 Gulp（或者它的一些插件）生成了脚手架代码，这是 JS（不存在的）模块系统所必需的，它通常意味着将编译器输出包装成奇怪的 multi -分层匿名函数。

如果您不需要任何类型的模块系统，而只想将多个 TS 文件直接转换为单个 JS 文件（据说会转到 RocketChat），那么我建议放弃 Gulp总而言之，让 TSC 像往常一样编译您的代码，然后使用脚本将生成的 .js 文件捆绑到一个文件中。

因此，整体设置如下（假设 src 是源代码文件夹）：

tsconfig.json

{
  "include": [
    "src/**/*.ts"
  ],
  "compilerOptions": {
    "noImplicitAny": true,
    "target": "es2016"
  }
}

build.sh

#!/bin/bash

# TSC puts compiled JS files along with their TS sources. 
node_modules/typescript/bin/tsc

# Creating an empty bundle file.
echo "">dist/app.js

# Bundling all the JS together.
# sed removes the 'export' keywords & 'import' statements.
while read p; do
  cat $p | sed -E "s/^export\s+(class|function|async|const|var)//" | sed -E "s/import.*$//" >> dist/app.js
done <<< $(find src -type f -name "*.js")

所以你像往常一样编程你的东西，用 ./build.sh 构建它，获取 dist/app.js 文件并在 RocketChat 中使用它。

在 Gulp 中肯定有一种方法可以按照这些思路做一些事情，但我不熟悉它，并且不认为这里真的需要一个成熟的构建系统。

Rocket.Chat 使用 Typescript 的 WebHook

Rocket.Chat WebHook with Typescript

javascript

typescript

rocket.chat