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';

您也可以进行默认导出以获取所有内容，但它在功能上与选项1相同：

// 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);

通过将它们放在根级元素中，您可以在不必直接实现它们的情况下逃脱。

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