将操作员的超载添加到打字稿

Question

我正在从事一个需要大量向量和矩阵数学的项目，我会 love 使操作员超载。

有babel插件（例如 https：//github.com/github.com/rob-blackbourn/jetblackbourn/jetblack-jetblack--jetblack--jetblack--jetblack-jetblack-net-运算符 - 跨加载）使操作员对JavaScript的负载超载，但它们不使用Typescript（或者至少它们与TS Language sever for for vs code无效）。使用// @ts-ignore有解决方法，但我觉得它很丑陋，并且可以删除下一行的类型检查的好处。

我想将代码转换为这样（其中a，b和c是自定义对象）：

a + b * c

到这样的东西：

a.__add__(b.__mul__(c))

如果，例如，c是函数错误的类型__ mul __，VS代码应下划线下划线，甚至更好地符号c。

我想在将代码传递给TS编译器之前，可以将代码转换为TS编译器（这正是Babel插件所做的）。但是VS代码始终显示错误（运算符'+'不能应用于类型“自定义”和“自定义”）。

所以我的问题是：有没有实现上述行为的项目？如果没有，可以以这种方式扩展Typescript和/或Typescript语言服务器？如果是这样，请提供参考的链接以进行进一步研究。

我还对JSX（用于使用的JSX）如何与TS完全集成在一起，并且是否有其他项目可以以这种方式修改TS。

Answer 1

Babel仅在JavaScript代码上工作，您需要编写自定义的打字稿变压器，并在TS-LOADER上配置此变压器。但是，当forktscheckerwebpackplugin检查您的语法正确性时，仍然可能会引起一个问题。也许您必须关闭此插件。

以下是用于创建空变压器的示例代码：

export function createTransformer (): ts.TransformerFactory<ts.SourceFile> {
  console.log("Hello, I am transformer just created");
  return (context: ts.TransformationContext) => {
    return (sourceFile: ts.SourceFile) => {
      function visit (node: ts.Node): ts.Node {
      return ts.visitNode(sourceFile, visit)
    }
  }
}
export default createTransformer

此外，您必须配置项目，如果在VUE中，vue.config.js将是：

const PipeTransformer = require('./pipe-transformer').default


module.exports = {
  // .... other configurations 
  chainWebpack: config => {
    // Can not use the ts-pipe-operator plugin, the babel plugin process only javascript not typescript.
    config.module.rule('ts').use('ts-loader').tap(options => {
      options.transpileOnly = true
      options.appendTsSuffixTo = ['\\.vue
]
      options.happyPackMode = false
      options.getCustomTransformers = () => ({
        before: [PipeTransformer()]
      })
      return options
    })
  }
}