Typescript 在 d.ts 中动态声明命名导出
P粉642436282
P粉642436282 2024-02-26 11:58:58
0
1
449

我在 TypeScript 中为 VueJs 制作了一个组件库,我希望能够在我的 Vue 实例中全局使用它们(使用 Vue.use(library))或一一使用它们(使用 Vue 组件中的命名导入)< /p>

它工作得很好,但是当我想动态地声明 index.d.ts 文件中的所有组件时,我在使用 TypeScript 时遇到一些问题(因为组件很多,我不想手动执行)

所以这是有效的:

import { Component1, Component2 } from 'my-library';

declare module 'my-library' {
  declare const lib: PluginFunction<any>;
  export default lib;

  export { Component1, Component2 } from 'my-library';
}

但我正在寻找一种方法来对所有组件执行此操作,而无需逐个导入和导出它们。

我尝试过这样的事情:

...
export * from 'my-library'
...

import * as components from 'my-library';

declare module 'my-library' {
  declare const lib: PluginFunction<any>;
  export default lib;

  Object.entries(components).forEach(([componentName, component]) => {
    export { component as componentName };
    // or
    // export { component };
  })
}

但是它不起作用,当我执行 import { Component1 } from 'my-library' 时出现 TS 错误:

“无法解析符号“Component1” TS2614:模块“my-library”没有导出成员“Component1”。您是否打算使用“从“my-library”导入 Component1”?”

ps:如果我在导入之前使用 //@ts-ignore ,一切都会正常。

有什么想法吗?

P粉642436282
P粉642436282

全部回复(1)
P粉739886290

我的猜测是,这是因为 TS 在构建时需要一些东西来进行“类型检查”。换句话说,TS 比 JS 更具限制性,这是失去灵活性的主要示例之一,因为它希望在构建时而不是运行时进行定义。

简而言之,你不能这样做。您唯一能做的就是导出键控对象中的所有内容,但这意味着当您将其导入另一个文件中时,您必须获取整个内容而不能获取其中的一部分。

文件.vue



sssccc
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板