Как использовать модули Javascript ES6 ES2015 для экспорта/импорта констант непосредственно в пространство имен модуля импорта?

Хорошо, я не могу найти ответ на этот вопрос. Я использую предустановку 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'

Но тогда я должен явно ссылаться на каждую из констант в импорте, что приводит к большему количеству головной боли, чем к меньшему.


javascript es6-modules ecmascript-6
person xweb    schedule 01.06.2017    source источник
comment
Вы почти все возможности рассмотрели. JavaScript не позволит вам просто взять переменные из воздуха, поэтому они должны быть определены каким-то образом, в форме или форме.   -  person samanime    schedule 01.06.2017

Ответы (2)


arrow_upward
8
arrow_downward

В дополнение к двум вариантам, которые вы уже указали:

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

Поместив их в элемент корневого уровня, вы можете обойтись без их прямой реализации.

Однако, пожалуйста, не используйте этот метод.

person samanime    schedule 01.06.2017
comment
Это то, что я понял, исходя из отсутствия примера в дикой природе. Думаю, я ищу что-то вроде включения в стандартный серверный язык, но сделать это с помощью модуля ES2015. Копирование ключей - интересная идея, но тогда мне пришлось бы запускать это везде, где я также импортирую константы. Я могу понять, почему этот вариант использования не поддерживается, так как действительно может быть легко облажаться, если вы, например, попытаетесь сделать это с чем-то другим, кроме константы, а затем по ошибке перезапишете член из другого модуля. Только для моих констант, было бы неплохо иметь. - person xweb; 01.06.2017

arrow_upward
4
arrow_downward

В ES2015 нет возможности импортировать переменные с подстановочными знаками в корневое пространство имен модуля.

Ваши два варианта

import * as CONSTANTS from 'foobar'

or

import {FOO, BAR} from 'foobar'

источники:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

http://2ality.com/2014/09/es6-modules-final.html

person AnilRedshift    schedule 01.06.2017