Как писать js-модуль для Webpack, чтобы объекты модуля были доступны глобально?

Question

[Никита Геннадич]

Суть проблемы:

Есть две-три легаси-библиотеки, которые используются в системе на страницах внутри тега sсript, при этом на этих страницах никаких других бандлов webpack не подключается и не планируется.

Однако, библиотеки держать в репозитории не правильно, к тому же так получилось, что они уже и так есть в нашей папке node_modules как зависимости, поэтому лучшим решением видится создание отдельной entry_point для webpack, чтобы он собирал её в отдельный бандл и подключал в нужном месте. Как создать отдельный бандл, я вроде разобрался, но проблема в том, что непонятно как к этому модулю потом обращаться из глобального scope.

Пробовал так:

import * as ClipboardJS from 'clipboard';
import * as lazy from 'jquery-lazy';

// console.log(ClipboardJS);
// Преобразуется в console.log(clipboard__WEBPACK_IMPORTED_MODULE_0___default.a);
// Внутри модуля корректно отрабатывает, что очевидно

export { ClipboardJS, lazy };

И вот так:

// Синтаксис ES6-modules:
var ClipboardJS = require('clipboard');
var lazy = require('jquery-lazy');
module.exports = ClipboardJS;
module.exports = lazy;

В глобальной области видимости всё равно:
console.log(ClipboardJS); // undefined

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

Answer 1

[Никита Геннадич]

Всё оказалось куда как проще.

import * as ClipboardJS from 'clipboard';
import * as lazy from 'jquery-lazy';

window.ClipboardJS = ClipboardJS;
window.lazy = lazy;
// Работает как ожидается - обе библиотеки доступны глобально.