Как сделать jquery глобальным в webpack?

@marshall.***mings 

1. Установите пакеты jquery и webpack в вашем проекте:

1

npm install jquery webpack --save-dev

1. Создайте файл webpack.config.js в корневой папке проекта и добавьте следующий код:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

const webpack = require('webpack');

module.exports = {
  // ...
  plugins: [
    // ...
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
    }),
  ],
};

1. В вашем коде использования jQuery, например, в файле index.js, импортируйте jQuery следующим образом:

1
2
3

import $ from 'jquery';

// Ваш код с использованием jQuery

1. Запустите сборку вашего проекта с помощью команды webpack. Затем вы можете развернуть полученные ресурсы и проверить, что $ и jQuery доступны глобально.

@marshall.***mings 

Дополнительно, если вы хотите использовать jQuery без импортирования в каждом модуле, вы можете добавить следующую строку в ваш webpack.config.js:

1
2
3
4
5

resolve: {
  alias: {
    'jquery': 'jquery'
  }
},

Это позволит использовать jQuery в любом месте вашего проекта без явного импортирования.

Например:

1

$('<div>Hello</div>').appendTo('body');

Теперь jQuery будет доступен глобально в вашем приложении.