4

I have uploaded Jquery version 3.3.1 in app/design/frontend/theme/vendor/web/js.I have linked it in default_head_blocks.xml.Its working fine for Homepage. But when I proceed to checkout, the page keeps o loading. When I look into the console, there are many JS errors. I have never edited/overwritten any of the files shown in the error.

I have attached the errors below

I tried adding Jquery Migrate from http://code.jquery.com/mobile/git/jquery.mobile-git.min.js in app/design/frontend/theme/vendor/web/js.But it added these errors.

[Show/hide message details.] Error: Mismatched anonymous define() module: function(d){return c(d,a,b),d.mobile} http://requirejs.org/docs/errors.html#mismatch require.js:166:17 makeError http://localhost/magento/pub/static/frontend/Canon/CrystalClear/en_US/requirejs/require.js:166:17 intakeDefines http://localhost/magento/pub/static/frontend/Canon/CrystalClear/en_US/requirejs/require.js:1221:36 localRequire/< http://localhost/magento/pub/static/frontend/Canon/CrystalClear/en_US/requirejs/require.js:1408:25

Can you please help me. Thanks in advance.

  • Enable developer mode and check exception log and system log to know more about the exact error being caused.. I hope you will get more idea by doing so.. – Himmat Paliwal Sep 14 '18 at 9:38
  • 1
    There are no exception error but in System.log there are multiple lines of code saying "Add of item with id XXXXXX(Like Magento_Backend::system_design_schedule )was processed" – Vishali Mariappan Sep 14 '18 at 9:56
  • Ok, may I know why do you need jquery 3.3.1, magento already have inbuilt jquery support.. Is there any special req? – Himmat Paliwal Sep 14 '18 at 10:06
  • 1
    Yes I needed to add an owl carousel slider.So I used Jquery 3.3.1 to make it work. – Vishali Mariappan Sep 14 '18 at 10:09
  • check my answer to add jquery support.. – Himmat Paliwal Sep 14 '18 at 10:15
2

Owl carousel would be working fine with inbuilt jquery provided by Magento. please use below code to initiate jquery library in your template file:

require(['jquery'], function($){ 
     //your js code here  
 });

Example:

<script type="text/javascript">
    require(['jquery'], function($){
      $(document).ready( function() {
        alert("Page loaded.");
      });
    });
</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.