JQuery функция в другом файле с помощью Webpack

Question

У меня есть следующее JS в индексе. js файл:

import * as $ from 'jquery';
window.jQuery = $;

$(function () {
  $.fn.mapit = function () { 
    // Do something
  }
}

Я попытался переместить функцию mapit в другой файл:

index. js

import * as $ from 'jquery';
window.jQuery = $;
import 'mapit.js'

mapit. js

$(function () {
  $.fn.mapit = function () { 
    // Do something
  }
}

Но я получаю сообщение об ошибке $ is undefined в файле mapit.

Я строю с помощью веб-пакета, и точка входа - индекс. js

Как мне решить эту проблему?

Answer 1

Сделайте import * as $ from 'jquery'; внутри mapit.js тоже.

Вот так работают модули в JS, вам нужно импортировать необходимые файлы в файл, в котором вы хотите их использовать. Это не похоже на традиционные <script> теги

Answer 2

Вам необходимо отменить импорт. mapit.js не импортирует jquery и не определяет его. index. js делает.

Возможно, ваш лучший способ действий - переместить jquery в собственный файл (jquery. js), импортировать jquery. js в mapit. js и импортировать mapit . js в указатель. js