#javascript #webpack #ecmascript-6
Вопрос:
Мне нужно вызвать функцию класса, которая записана в модуле webpack из внешнего скрипта.
Есть конфигурация webpack:
entry: {
main: ["./src/js/main.js"],
},
performance: {
hints: false,
},
output: {
filename: "[name].js",
path: path.resolve(__dirname, "dist/js"),
},
optimization: optimization(),
module: {
rules: ifBabel(),
},
В main.js у меня есть
import { finishing } from "./modules/forms/finishing";
var fns = new finishing();
fns.init();
Мне нужно вызвать некоторую функцию fns из внешнего скрипта. Но webpack компилирует скрипт внутри своей функции, и я не могу получить к нему доступ..
Комментарии:
1. Мне нужно вызвать какую-то функцию fns из внешнего скрипта, тогда вам тоже придется
import
это сделать. Это предполагаемый способ работы модулей.2. Какова логика, которая находится снаружи, и почему она находится снаружи, а не внутри пакета Webpack, как все остальное?
3. Фильтр написан в интерфейсе в webpuck, но скрипт, который вызывает этот фильтр в cms, мне нужно вызвать его из тела. <скрипт> тег<скрипт></скрипт>
Ответ №1:
У вас есть 2 основных варианта:
- Используйте Webpack
library
, чтобы определить, как ваш пакет Webpack отображается на странице при загрузке, и чтобы вашиmain.js
функции экспорта использовались вашей страницей через библиотеку, напримерimport { foo } from "./foo"; export { foo };
с помощью страницы, которую затем можно использовать
LibraryName.foo()
- Должны
main.js
явно сделать что-то вродеimport { foo } from "./foo"; window.foo = foo;
чтобы вручную отобразить определенные функции в окне или в каком-либо другом месте.
Я бы рекомендовал первый подход, но любой из них подойдет.