ES6/2015中导出对象字面量的最佳方法是什么？

Question

看似非常简单的任务...

export default function() {
    return {
        googleClientID:'xxxx'
    }
}

导出应用程序设置的对象字面量是最佳方式吗？

- Svitlana

---

语法是 export default <expression> 或者 export var name = <expression>;。 - Felix Kling

Answer 1

您可以导出对象本身：

export default {
    googleClientID:'xxxx'
};

不同之处在于，您的情况下每次调用导出函数都会得到全新的对象。而在这种情况下，每次都会得到相同的对象。这取决于您的需求。

- madox2

---

谢谢你，madox2。你的语法更简单，解决了传递全局设置的任务。 - Svitlana

为什么在导入时，import { googleClientID } from 'file' 会无效？ - aashah7

@aashah7，我正在使用默认导出，因此您需要通过默认方式导入它：import googleClientID from 'file'。您正在使用名称导入，因此您需要使用命名导出：export const googleClientID = 'xxx'。请注意，解构不适用于导入。 - madox2

缺少有关如何导入它的说明...建议添加它... - Mendes

ESLint 抱怨我这样做（no-anonymous-default-export）。 - riv

Answer 2

您可以简单地导出一个对象

export default { googleClientID:'xxxx' };

默认导出可以是函数、类、对象或任何其他值。由于它最容易导入，因此应将此值视为“主”导出值。

- void

---

第二个例子可能应该是 export var foo = ...。 - Felix Kling

@FelixKling 没有这样的事情。 - void

谢谢大家。我试图强迫自己去让它。所以导出默认的是let foo = { - Svitlana

但是简单易懂才是王道，所以 export default {} 是最好的方式。抱歉问了个愚蠢的问题 :-) - Svitlana

我想你可能希望创建一个具名导出，但也有可能不是这样。如果你只是想要导出一个值，那么将export default foo = ...这样写会抛出一个错误，因为它要求在之前已经声明了foo的变量。此外，如果你只是想导出一个值，给这个值赋一个变量并没有意义。值得明确的是：export default foo = 42;基本上相当于在CommonJS中做module.exports = (foo = 42);(我认为这并不常见)。 - Felix Kling

你的第二个例子是错误的，赋值操作是不允许的。 - loganfsmyth

Answer 3

@madox2和@void的回答可能存在某种常见的误解。

我在向DefinitelyTyped提交PR时遇到了类似的问题--#18725。 TypeScript编译器抱怨生成的文件。

一个例子应该是：

// ...
import zip from "./zip";
import zipObject from "./zipObject";
import zipObjectDeep from "./zipObjectDeep";
import zipWith from "./zipWith";

export default {
  // ...
  zip,
  zipObject,
  zipObjectDeep,
  zipWith
};

乍一看，我认为这不是我的问题。因为我只是从lodash-es复制了代码。但后来我找不到任何简单的方法来消除错误。

所以我去看了spec以获取答案。哇，如果我读对了的话，规范没有提到对象的默认导出。

结论：

以下是符合规范的：

export { googleClientID:'xxxx' }

---

刚刚找到了更多的参考资料：

• https://medium.com/@timoxley/named-exports-as-the-default-export-api-670b1b554f65#a279
• https://medium.com/@rauschma/note-that-default-exporting-objects-is-usually-an-anti-pattern-if-you-want-to-export-the-cf674423ac38

- e-cloud

Answer 4

导出：虽然不是最美观的，但在以后导入时非常方便。

export const ROOT = '/tmp/test'
export const EXT = '.backup'
// ... and so on

导入：最清洁的用法（通常我们会导入更多而不是导出）。

import { ROOT, EXT } from './literals.js'
const file = ROOT + yourFileName + EXT

- angelito