Answer the question
In order to leave comments, you need to log in
How to write a js module for Webpack so that module objects are available globally?
The essence of the problem:
There are two or three legacy libraries that are used in the system on pages inside the script tag , while no other webpack bundles are connected or planned on these pages.
However, it is not correct to keep the libraries in the repository, besides, it so happened that they already exist in our node_modules folder as dependencies, so the best solution is to create a separate entry_point for webpack so that it collects it in a separate bundle and connects it in the right place . I sort of figured out how to create a separate bundle, but the problem is that it’s not clear how to access this module from the global scope.
Tried like this:
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
Answer the question
In order to leave comments, you need to log in
Everything turned out to be much easier.
import * as ClipboardJS from 'clipboard';
import * as lazy from 'jquery-lazy';
window.ClipboardJS = ClipboardJS;
window.lazy = lazy;
// Работает как ожидается - обе библиотеки доступны глобально.
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question