gpt4 book ai didi

javascript - 在 Typescript 中使用外部 JS-Library(基本原语图)

转载 作者:行者123 更新时间:2023-12-01 15:41:55 28 4
gpt4 key购买 nike

我正在采取第一步将一个相当大的项目从 javascript 迁移到 typescript。作为一名大约 2 年前开始 javascript 开发的 Java 开发人员,我的工具链仍然很初级。
我正在尝试将一个小的 JS 文件迁移到 TS 作为概念证明。 JS代码配置了Basic Primitives Diagram .
几乎所有事情都解决了。但是我在以 typescript 可以理解的方式声明全局范围函数时遇到了大问题。这是我的代码的一小部分:

export {}
declare global {
export interface Window {
MyGlobalVar: any;
}

export ChartItemConfig{
//properties
}

//I thought this and the following declarations would solve the problem. They dont :(
export interface primitives {
orgdiagram: Orgdiagram;
}

export interface Orgdiagram {
Config: Config;
}

export interface Config {
//properties
}
}

window.MyGlobalVar.myGlobalFunction = function (id: string, items: Array<ChartItemConfig>) {
//... more code
// @ts-ignore
let options: Config = new primitives.orgdiagram.Config();
//... more code
}
我想摆脱 @ts-ignore陈述。但无论我尝试什么,我的代码都不会转换。我收到错误 TS2693: 'primitives' only refers to a type, but is being used as a value here.我确定这是一个初学者的问题,但我在 www 中找不到解决方案。
编辑:
看来我对我的问题还不够清楚: new primitives.orgdiagram.Config();在运行时是有效的 JS 代码。如何以 TS 理解它是构造函数调用的方式声明符号?
编辑:
我的当前版本:
export {}
declare global {
export interface Window {
MyGlobalVar: any;
}

export const primitives:Primitives;

export class Primitives {
orgdiagram: Orgdiagram;
}

export class Orgdiagram {
Config: () => Config;
}

export class Config { }

//... more
}

window.MyGlobalVar.myGlobalFunction = function (id: string, items: Array<ChartItemConfig>) {
//The following line fails with: TS7009: 'new' expression, whose target lacks a construct signature, implicitly has an 'any' type
let options: Config = new primitives.orgdiagram.Config();
//... more
}
编辑:
我终于让它工作了。 fettblog.eu introduced me to the constructor interface pattern ,这解决了我的问题:)
我的工作声明现在是
export {}
declare global {

const primitives:Primitives;

class Primitives {
orgdiagram: Orgdiagram;
}

class Orgdiagram {
Config: ConfigConstructor;
}

interface ConfigConstructor{
new (): Config;
}

class Config {
//....

最佳答案

你需要做的是声明一个 const :

declare global {
export const primitives: Primitives

export interface Primitives {
orgdiagram: Orgdiagram;
}
}
通过这种方式,您告诉 Typescript “相信我,在全局范围内的其他地方声明了一个常量,称为 primitives,其类型为 Primitives”。它会生成正确的代码。
至于构造函数,您需要指定该函数是构造函数,以便能够与 new 一起使用。 :
export class Orgdiagram {
Config: { new(): Config };
}

关于javascript - 在 Typescript 中使用外部 JS-Library(基本原语图),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63391974/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com