Typescript:导出命名空间中的所有函数

t1qtbnec  于 2023-11-20  发布在  TypeScript
关注(0)|答案(4)|浏览(189)

假设我有一个类型脚本文件Utils,其中包含一堆导出的函数:

export function utilOne(){}
export function utilTwo(){}

字符串
我将index.d.ts文件添加到这个文件夹中,并从Utils文件中导出 *:

export * from './Utils';


在我的其他类中,我想通过utils命名空间访问函数utilOne和utilTwo,比如:

utils.utilOne();


我知道我可以像这样导入它:

import * as utils from "./Utils";


然而,由于我将大量使用utils,我希望能够在命名空间中导出utils,例如:

export {* as utils} from './Utils';   // this doesn't work


然后用途:

import * from "./Utils";


但是导出{* as utils}不起作用。我可以把Utils的所有功能放到一个模块“utils”中并导出它,但我不确定这是否是一个好的做法。有没有合适的方法来做到这一点?

fbcarpbf

fbcarpbf1#

由于TC39/ecma 262,你可能需要的功能被合并了。所以现在你可以像这样导出模块本身:

// module.ts

export interface Foo{
    bar: string;
}

export function A(){

}

export function B(){
    
}

export * as MyModule from './module';

字符串
然后将其用作包含自己上下文的模块:

import {MyModule} from './module';

type MyType = MyModule.Foo;

MyModule.A();
MyModule.B();


在我看来,这取决于TS版本和webpack,如果你正在使用它。对我来说,它的webpack 5和TS v4.1.2工作得很好。没有检查树抖动,但看起来它应该工作正常。

7gcisfzg

7gcisfzg2#

第一个月
不可以。全局导入被认为是不好的做法,即使在支持全局导入的语言中也是如此。(例如python Why is "import *" bad?
JavaScript / TypeScript不支持它。毕竟,它非常有用,可以看到foo.bar,并知道bar来自foo而不是bar,并且不知道bar来自何处(无需克隆和分析整个项目)。🌹

yduiuuwa

yduiuuwa3#

注意,根据您的项目,可以使用间接层来完成此导出。
第一个月

export function utilOne(){}
export function utilTwo(){}

字符串
./utils/utils.ts

import * as utils from './internal/utils';
export utils;


./test.ts

import { utils } from './utils/utils';

utils.utilOne();


注意事项:
如前所述,这是一个有问题的做法,命名空间的愿望可能是代码气味的指示。它也可能对你的库和最终项目的树的可摇动性产生负面影响。
注意:这个结构受到RxJS的启发。

cx6n0qe3

cx6n0qe34#

使用实际的命名空间:

namespace Utils {
  export function utilOne(){}
  export function utilTwo(){}
}

export default Utils;

字符串
然后,您可以将其导入为:

import utils from "./Utils";
// ...
utils.utilOne();

相关问题