如何使用 Javascript ES6 ES2015 模块将常量直接导出/导入到导入模块命名空间？

Question

好的，我不太明白这个问题的答案。我正在使用 webpack 和 babel es2015 预设来处理 ES2015 模块。

要导出的模块 1，文件名 "foobar.js"

export const FOO = 'foo'
export const BAR = 'bar'

有没有办法将此常量导入我的导入模块中的全局命名空间？

我想在将使用常量的模块中执行此操作：

import 'foobar'

const doSomething = () => { console.log(FOO + BAR) }

我知道这行得通：

import * as CONSTANTS from 'foobar'

const doSomething = () => { console.log(CONSTANTS.FOO + CONSTANTS.BAR) }

...还有其他方法可以实现在特定名称空间中导入的相同结果。但是我想使用没有前缀的常量。

有没有办法直接将来自不同模块的所有导出导入导入模块的根命名空间？

*注意：我知道我可以做到这一点：

import {FOO, BAR} from 'foobar'

但是我必须在导入中显式引用每个常量，这会导致更多的麻烦而不是更少。

Answer 1

ES2015 无法将通配符导入变量导入模块的根命名空间。

你的两个选择是

import * as CONSTANTS from 'foobar'

或

import {FOO, BAR} from 'foobar'

来源：

Answer 2

除了您已经提到的两个选项：

import * as CONSTANTS from 'foobar';
import { FOO, BAR } from 'foobar';

您也可以执行默认导出以获取所有这些，但它在功能上与选项一相同：

// foobar.js
const FOO = 'foo';
const BAR = 'bar';

export default { FOO, BAR };

// myfile.js
import CONSTANTS from 'foobar';

另一种方法是为 global 或 window 动态填充它们（global 用于 Node.js，window 用于浏览器代码）。

但是，我强烈建议不要使用此方法，因为您将无法使用 IDE 的任何帮助，这会导致很多错误。现在编写额外的代码是完全值得的，以后不会有难以发现的错误。

import CONSTANTS from 'foobar';

Object.keys(CONSTANTS).forEach(key => window[key] = CONSTANTS[key]);

console.log(FOO, BAR);

示例：

const CONSTANTS = { FOO: 'foo', BAR: 'bar' };

Object.keys(CONSTANTS).forEach(key => window[key] = CONSTANTS[key]);

console.log(FOO, BAR);

通过将它们放在根级元素中，您无需直接实现它们即可摆脱困境。

但是，请不要使用此方法。

How do I use Javascript ES6 ES2015 modules to export / import constants directly to the import module namespace?