如何将外部jquery库导入webpack？

Question

I'm trying to set up an environment to work with webpack 4. I connected jquery to the assembly point, it is available in the code, it works. When I connect jquery plug-ins there, there are problems with importing, the web package does not preserve the order of connection because of this, the plug-ins do not work. Tell me how to correctly import plug-ins not into one file but separately. I rummaged through all the manuals, tried all the options, I do not understand anything. How do webpacks usually include such libraries in an assembly? I understand through ProvidePlugin? Are there any other methods? I just want to know what methods are used and which is generally better.

my entry point index.js

import $ from 'jquery'; 
window.jQuery = $; 
  import './src/js/plugins/jquery.swipe'; 
  import './src/js/plugins/jquery.slider';
  import './src/js/plugins/jquery.parallax';
  import './src/js/plugins/custom';

the output should work out

• dist/jquery.js
• dist/jquery.swipe.js
• dist/jquery.parralax.js
• dist/custom.js
• dist/webpack.bundle.js

Answer 1

Try to add JQuery online CDN. like,

<script
  src="https://code.jquery.com/jquery-3.1.0.js"
  integrity="sha256-slogkvB1K3VOkzAI8QITxV3VzpOnkeNVsKvtkYLMjfk="
  crossorigin="anonymous">
</script>

In conig file

module.exports = {
  externals: {
     jquery: 'jQuery'
  }
};

And define dependancy

import $ from 'jquery';

Hope this work..