TypeScript 建议:将UMD模块输出导出为命名空间 ```markdown 建议:将UMD模块输出导出为命名空间 ```

gcuhipw9  于 5个月前  发布在  TypeScript
关注(0)|答案(4)|浏览(76)

当前问题
TypeScript 支持 UMD 输出,但不支持将其导出为全局命名空间。

语法

  • NamespaceExportDeclaration:*

    exportasnamespaceIdentifierPath

行为

export var x = 0;
export function y() {}
export default {};
export as namespace My.Custom.Namespace;

// emits:

(function (global, factory) {
  if (typeof module === "object" && typeof module.exports === "object") {
    var v = factory(require, exports);
    if (v !== undefined) module.exports = v;
  }
  else if (typeof define === "function" && define.amd) {
    define(["require", "exports"], factory);
  }
  else {
    global.My = global.My || {};
    global.My.Custom = global.My.Custom || {};
    global.My.Custom.Namespace = global.My.Custom.Namespace || {};
    var exports = global.My.Custom.Namespace;
    factory(global.require, exports);
  }
})(this, function (require, exports) {
  "use strict";
  exports.__esModule = true;
  exports.x = 0;
  function y() { }
  exports.y = y;
  exports["default"] = {};
});

注意

  • 本提案基本上遵循 Babel 的行为。
  • 在没有模块加载器的任何模块中导入将在此提案中抛出。进一步的扩展可能会像 Babel 一样使用全局命名空间。
  • Babel 会覆盖现有的命名空间,而本提案会扩展现有的命名空间,就像 TS namespace 所做的那样。
  • Rollup 有特殊的行为,其中 export default X 的工作方式类似于 CommonJS module.exports = X,而本提案则不是这样。

先验知识:Babel exactGlobals, Webpack multi part library ,Rollup output.name 选项与命名空间支持

另请参阅

#8436
#10907
#20990

qlckcl4x

qlckcl4x1#

个人观点是,因为这种表达式级别的语法只适用于UMD模块,所以这样处理是有风险的。因为对于AMD、CommonJS或ES模块来说,你会发出什么?在一种模块格式中只有有效的语法感觉对TypeScript来说是一种反模式。
我认为triple slash directive会是一个更好的解决方法。已经有了AMD指令:

///<amd-module name="NamedModule"/>

所以为什么不将其扩展到UMD并遵循上面的建议:

///<umd-module name="foo.bar.baz"/>
k4aesqcs

k4aesqcs2#

$x_1^m_0^n_1^x$ 指令也会起作用,但可能不是非常自然,因为 TS 已经在 d.ts 文件中使用了 $x_1^m_1^n_1^x$,这同样仅适用于 UMD 模块。

$x_1^a_0^b_1^x$

$x_1^a_1^b_1^x$

vvppvyoh

vvppvyoh4#

您好!您的问题是关于模块编译成命名空间的。在 TypeScript 中,模块是一种组织代码的方式,而命名空间是一种组织变量和函数的方式。如果您想要将模块编译成命名空间,可以使用 export 关键字将模块中的变量和函数导出到命名空间中。例如:

// module.ts
export const foo = 'bar';
export function baz() {}

// namespace.ts
import { foo, baz } from './module';
console.log(foo); // 'bar'
baz(); // undefined

相关问题