Magento2: Override issue for lib/web/jquery.js

Question

I am trying to override below file in my custom theme.

lib/web/jquery.js

Seems it been override. But It stop other jquery from working.

Due to this a lot of console error arise.

Here is my code

app/design/frontend/custom/theme/requirejs-config.js

var config = {
    map: {
        '*': {
            'jquery':'js/custom-jquery'
        }
    }
};

I have placed my override file here:

app/design/frontend/custom/theme/web/js/custom-jquery.js

Can anyone please suggest how to override lib/web/jquery.js properly.

Look at this answer - magento.stackexchange.com/a/303519/34579 - Maybe shim is missing for the main jquery in app/design/frontend/custom/theme/requirejs-config.js. Why do you want to override the main jquery.js? — sandip
– sandip, Commented Feb 26, 2020 at 5:01
Due to this issue: github.com/jquery/sizzle/issues/445 I have to override this file — Ravi Soni
– Ravi Soni, Commented Feb 26, 2020 at 8:33

Konstantin G - goivvy.com · Accepted Answer · 2025-05-27 14:47:45Z

This is how I got it working for me:

You'd need to use paths instead of map and copy jquery folder along with jquery.js file:

app/code/Goivvyllc/CSS/view/frontend/requirejs-config.js:

var config = {
   paths: {
       'jquery': 'Goivvyllc_CSS/js/jquery'  
   }
}

Then copy jquery.js and jquery folder and customize it to your needs:

cp -r lib/web/jquery* app/code/Goivvyllc/CSS/view/frontend/web/js

Then recompile and enjoy:

php bin/magento deploy:mode:set production

You can avoid copying the jquery folder by linking all jquery containing aliases back to its original values, for example for jquery.parsequery.js:

app/code/Goivvyllc/CSS/view/frontend/requirejs-config.js:

var config = {
   paths: {
       'jquery': 'Goivvyllc_CSS/js/jquery',
       'jquery/jquery.parsequery': 'jquery/jquery.parsequery'
   }
}

1 Answer 1