javascript - 导出默认 { name } 和命名导出 { name } 之间的区别

Question

我正在尝试弃用具有许多命名导出的模块，如下所示:

const Foo = () => 'foo';
const Bar = () => 'bar';

export { Foo };
export { Bar };

通过以下方式消费时没问题:

import { Foo, Bar } from './something';

我关于启用弃用警告的想法是使用类型对象的默认导出，并为每个打印弃用信息然后返回模块的键覆盖属性 getter。

形状就会变成这样:

const something = {};
Object.defineProperty(something, 'Foo', {
  get(){
    console.warn('Foo is deprecated soon');
    return Foo;
  }
});
// etc
export default something;

我的想法是解构导入会解决这个问题

import { Foo, Bar } from './something';

...将继续像以前一样工作。相反，webpack 提示某些东西没有命名的导出 Foo 或 Bar

但是，使用这个是有效的:

const { Foo, Bar } = require('./something');

我还可以从 './something' 导入一些东西； const { Foo, Bar } = some 这可以工作，但如果我必须重构每个存在的导入，它就达不到目的。

所以问题实际上是关于import { Foo, Bar } from './something';与require()相比如何工作的> - 我本以为如果默认导出是一个对象，它会找出它并解构，但没有乐趣。

有没有一种简单的方法可以在不改变其他地方消费导出的方式的情况下进行这种“代理”？

Answer 1

我想我成功了。请记住，这是一种解决方法。

鉴于您说该库正在从单个文件“重新导出”，您可以向“重新导出”添加一个额外的“层”，我们将“重新导出”文件转换为 JS 文件并为其编写我们自己的关联打字文件。

工作代表:https://repl.it/@Olian04/CelebratedKlutzyQuotes

代码片段:

// index.ts
// consuming the library
import { Foo } from './demo';

console.log(Foo());

// library.ts
// the library it self
const Foo = () => 'foo';

export { Foo }

// demo.js
// the workaround implementation 
const depricatedLibrary = require('./library');

const something = new Proxy(depricatedLibrary, {
  get(obj, key) {
    if (typeof key === 'string') {
      console.warn(key + ' is deprecated soon');
    }
    return obj[key];
  }
});

module.exports = something;

// demo.d.ts
// the workaround types
export * from './library';