我正在采取第一步将一个相当大的项目从 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/