0

I want to include jquery-1.4.2 in parallel with jquery-3.x. I have aliased the paths of both scripts as: jquery1/jquery3

For jquery-3.x the code below works:

require("imports-loader?jQuery=jquery3!app/some.jquery.myplugin");

But If i do the same for jquery1 :

require("imports-loader?jQuery=jquery1!app/some.jquery.mylegacyplugin");

I get at runtime: cannot set property mylegacyplugin of undefined.

The only solution I found till now is to edit jquery-1.4.2. file and add the following at the end of the function:

module.exports=jQuery;

Is there a loader which I can use to avoid editing the source code of jquery?

Marinos An
  • 9,481
  • 6
  • 63
  • 96

1 Answers1

0

I have created a repo which demonstrates it

Install: npm i exports-loader -D. I see that you have installed the imports-loader already.

And I hope you can modify your plugin to add module.exports.

myJQueryPlugin.js

$.fn.greenify = function () {
    debugger;
    this.css("color", "green");
    return this;
}

module.exports = $;

Add the following rule:

 module: {
            rules: [        
                {
                    use: "exports-loader?window['jQuery']",
                    test: /jQuery.1.4.2.js$/
                },

I have added also a resolve.alias for my jQuery plugin:

 resolve: {
      alias: { // shortcuts             
            "myjqPlugin": path.resolve("src/scripts/plugins/app/myJQueryPlugin.js")),

Then in your index.js

// you would probably name this `var` differently:
    var my142jQueryIncludingPlugin = require("imports-loader?$=../../libs/jQuery.1.4.2.js!myjqPlugin");

    my142jQueryIncludingPlugin("*").greenify();

Result: Everything is green :-)

Legends
  • 21,202
  • 16
  • 97
  • 123
  • Nice! I didn't know that you can also export something that is on window! – Marinos An Mar 19 '18 at 11:52
  • You use the `exports-loader` for scripts that do not export themselves. This old jQuery version does not use any module format to export itself, it just registers itself globally. That's why we need `exports-loader here` – Legends Mar 19 '18 at 19:35