Импорт модуля ES6 в глобальный масштаб

TLDR: Как я могу создать модуль (импортированный через синтаксис ES6) во всем мире (или ссылку на импортированный класс внутри другого класса)?Импорт модуля ES6 в глобальный масштаб

Я импортирую модуль из пакета, который не был реализован должным образом (без экспорта и т. Д.), Но я сталкиваюсь с некоторыми проблемами.

Что я делаю, это использовать var, чтобы установить модуль в глобальный (не большой), например.

var Example = require('./node_modules/example/long_path_to_file.js');

Как мне нужно использовать его, как это в моем классе (модуль берет контроль над this и экземпляры класса не доступны в глобальном масштабе, так что я не могу использовать мой класс, как я это обычно):

new window.Example(...)

Это работает, но это не так велика, как я использую Webpack и предпочел бы использовать правильный синтаксис ES6

import Example from './example';

, а затем в example.js

export default Example = require('./node_modules/example/long_path_to_file.js');

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

Я пробовал такие вещи, как window.Example = Example, но он не работает.

источник

2016-02-24 user 32394023

Просто чтобы получить это прямо, 'пример/long_path_to_file.js' устанавливает переменную' window.Example', который вы хотите использовать с помощью WebPack? – CodingIntrigue

'window.aaa = require (....)' \ –

@RGraham Этот файл просто экспортирует некоторый код, который мне нужно использовать; Я устанавливал его в 'window.Example', используя' var Example' в самой внешней области (не уверен, что режим 'strict' даже позволяет это).Мне нужно, чтобы он был глобальным, потому что этот модуль использует контекст в моем классе (и экземпляры класса es6 не ссылаются в глобальной области) –

Если вы используете webpack легко настроить его. Итак, вот простой пример, как его реализовать.

webpack.config.js

module.exports = { 
    entry: 'test.js', 
    output: { 
    filename: 'bundle.js', 
    path: 'home', 
    library: 'home' // it assigns this module to the global (window) object 
    } 
    ... 
}

some.html

<script>console.log(home)</script>

Кроме того, если вы откроете файл bundle.js вы увидите, как WebPack сделал это для вас ,

var home = // main point 
/*****/ (function(modules) blablabla) 
...

Также я предлагаю посмотреть конфигурацию webpack library.

Я надеюсь, что это вам поможет.

Благодаря

источник

2016-02-24 11:53:59

Эй, это интересно, но выходной файл - это мой модуль, а не малый модуль, который я включаю и хочу сделать глобальным (скажем, 'bundle.js' - мой модуль, но я хочу глобальность' other.js', которая в верхней части 'bundle.js' через' import') –

@ user32394023 вы можете получить к нему доступ, так как параметр 'home.mySmallModule' –

очень полезен, спасибо – k4st0r42

Я сделал некоторые тесты и это работает правильно:

import './middleman'; 

// './middleman.js' 
window.Example = require('./example.js').default 
// OR 
window.Example = require('./example.js').Example 

// './example.js' 
export function Example() { 
    this.name = 'Example' 
} 
export { Example as default }

источник

2016-02-24 11:40:21

Импорт модуля ES6 в глобальный масштаб

ответ

Смежные вопросы