Webpack在其他组件中包含jQuery

Question

I use Webpack and my scripts is structured on this way.

scripts
  components
    heroSlider.js
  app.js

I install jQuery via npa npm and import in app.js like this

import $ from 'jquery';

And it's work fine. But i wan't to use jQuery in my component file. How?

In app.js i also import component.

import heroSlider from './components/heroSlider';

heroSlider.js look like this

export default function heroSlider() {

  // Here I wan't to use jQuery

}

But I don't want import jQuery again in component when i want to use it. There is a way to do that ?

Answer 1

If you're using jquery plugins that require a global jquery instance, you can expose jquery using expose-loader

Once you set it up you'll be able to require it using:

require("expose?$!jquery");