5

I add my custom Module to JS to requirejs-config.js File

    var config = {
        paths: {
            'Test/jquery':"Test_Header/js/jquery.min" ,
            'Test/popup':"Test_Header/js/jquery.magnific-popup" ,
            'Test/three':"Test_Header/js/three" ,
            'Test/async':"Test_Header/js/async" ,
            'Test/orbit':"Test_Header/js/OrbitControls" ,
            'Test/theta':"Test_Header/js/theta-viewer"  

        },
        shim: {
            'Test/jquery': {
                deps: ['jquery']
            },
            'Test/popup': {
                deps: ['jquery']
            },
            'Test/three': {
                deps: ['jquery']
            },
            'Test/async': {
                deps: ['jquery']
            },
            'Test/orbit': {
                deps: ['jquery']
            },
            'Test/theta': {
                deps: ['jquery']
            }
        }
    };

After I call this js to Template File:

    require(['jquery', 'Test/popup',  'Test/async', 'Test/theta' ],function($) {
            $(window).load(function () {
                $('#td').click(function () {
                    if(load==false) {

                        $('#threed').css('display', 'block');
                        $('.cpimage').css('display', 'none');

                         var viewer = new ThetaViewer( document.getElementById('threed') );
                         viewer.images = ["<?php echo $tsy; ?>"];
                         viewer.interval = 200;
                         viewer.autoRotate = true;
                         viewer.load();

                         }
                 });
            });
        });

Now All Js File Are Loading Fine in Net Tab, But Throw Error IN Console ReferenceError: async is not defined

Reference:{async load }

async load

Reference: [async error]

enter image description here

All Js are Loaded, But throw this Error. I tested All js Are working IN locally fine, But, While Integrating Magento2(requirejs), throw this error. Suggest Me Why This Issue Occur and How to Solve this.

5

requirejs-config.js mapping should be in below format. You need to load your async.js before three.js and popup.js because either three.js or popup.js depends on async

Try below code:

var config = {
        paths: {
            'Test/jquery':"Test_Header/js/jquery.min" ,
            'Test/async':"Test_Header/js/async" ,
            'Test/popup':"Test_Header/js/jquery.magnific-popup" ,
            'Test/three':"Test_Header/js/three" ,
            'Test/orbit':"Test_Header/js/OrbitControls" ,
            'Test/theta':"Test_Header/js/theta-viewer"  

        },
        shim: {
            'Test/jquery': {
                deps: ['jquery']
            },
            'Test/async': {
                deps: ['jquery']
            },
            'Test/popup': {
                deps: ['jquery']
            },
            'Test/three': {
                deps: ['jquery']
            },
            'Test/orbit': {
                deps: ['jquery']
            },
            'Test/theta': {
                deps: ['jquery']
            }
        }
    };
  • I tried you suggest , But still have same issue – Rajkumar .E Nov 17 '16 at 12:24
  • @Rajkumar.E Try without shim. use this code - var config = { map: { '*': { 'Test/jquery':"Test_Header/js/jquery.min" , 'Test/async':"Test_Header/js/async" , 'Test/popup':"Test_Header/js/jquery.magnific-popup" , 'Test/three':"Test_Header/js/three" , 'Test/orbit':"Test_Header/js/OrbitControls" , 'Test/theta':"Test_Header/js/theta-viewer" } } }; – Manthan Dave Nov 17 '16 at 12:30
0

requirejs-config.js mapping should be in below formate.

var config = {
    map: {
        '*': {
            noConflict: "Codilar_Place/js/noconflict",
            mabelJquery: "Codilar_Place/js/jquery",
            mabelSlider: "Codilar_Place/js/slider",
            mabelScript: "Codilar_Place/js/script",
            mabelScriptFile: "Codilar_Place/js/script-file",
            mabelSelectBox: "Codilar_Place/js/selectbox"
        }
    }
};

if you want to define dependency then define shim part.

hope this will help.

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.