1

Currently I am working in magento2 theme part. And I have a main.js file which I have added via default_head_blocks.xml . But its having jquery conflict. I removed jquery conflict using noConflict. When I do this my testimonial section which consists of owl carousel doesnt work. Please tell me how to add my 'main.js' file.

or Can someone tell me how to include the functions in 'main.js' on header to display the banner and drop-down menu?

  • Are you using PHTM for testimonial section? – kunj May 26 '18 at 9:26
  • yes..its an extension that I am using for testimonial. in this extension they have used Owlcarousel – Bridgit Thomas May 26 '18 at 9:37
  • You need to use require JS – kunj May 26 '18 at 9:46
  • for my main.js? – Bridgit Thomas May 26 '18 at 9:49
  • yes, for that JS. – kunj May 26 '18 at 9:53
3

Try this:

Update your require-config.js file this content:

var config = {
    paths: {
            'bootstrap_min': '{{module Package name}}_{{module name}}/js/vendor/bootstrap.min.js',
            'custom_main': '{{module Package name}}_{{module name}}/js/main.js'
    },
shim: {
    'bootstrap_min': {
        deps: ['jquery']
    },
    'custom_main': {
        deps: ['jquery']    
    }
};

Then You need to call that files in your PHTML:

require(['jquery', 'custom_main']);

And main.js content should be like this:

define([
    'jquery',
    '{{module Package name}}_{{module name}}/js/vendor/bootstrap.min'
], function ($,bootstrapMin) {

    "Your main.js file code put here."

});

If your file in theme then file should be in app/design/frontend/{{theme package name}}/{{theme name}}/{{Module package name}}_{{module name}}/web/js/main.js AND If your file in module then file should be in app/code/{{Module package name}}/{{module name}}/view/frontend/web/js/main.js.

  • Now I am getting this error "Refused to execute script from '{{path of js file}}' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled." – Bridgit Thomas May 26 '18 at 10:49
  • the js file is inside js folder within web but in path it just show localhost/testmag/pub/static/version1525520239/frontend/Package name/module/en_US/main.js – Bridgit Thomas May 26 '18 at 11:00
  • Where have you put your JS file? Please provide path. – kunj May 26 '18 at 11:12
  • Within frontnend/module Package name/moduename/web/js/main.js and require.js in frontnend/module Package name/moduename – Bridgit Thomas May 26 '18 at 11:45
  • Are you trying in theme OR module? – kunj May 26 '18 at 11:48

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.