0

I want to include custom js in my theme i put it in web/js path of theme

F:\xampp\htdocs\magento2\app\design\frontend\GWtheme\gw\web\js\jquery.flexisel.js

Then i created requirejs-config.js

var config = {
    map: {
        '*': {
            clientrotate: 'GWtheme_gw/js/jquery.flexisel'
        }
    }
};

but when i check page source i can not see this js loading any where.

Also i tried other way as per below answer but it shows 404

var config = {
    map: {
        '*': {
            clientrotate: 'GWtheme_gw/js/jquery.flexisel'
        }
    },
    deps: [
        "clientrotate"
    ]
};


"NetworkError: 404 Not Found - http://localhost:8080/magento2/pub/static/frontend/GWtheme/GW/en_US/GWtheme_gw/js/jquery.flexisel.js"

Error: Script error for: GWtheme_gw/js/jquery.flexisel
http://requirejs.org/docs/errors.html#scripterror


var e = new Error(msg + '\nhttp://requirejs.org/docs/errors.html#' + id);
0

Try with following code:

var config = {
    map: {
        '*': {
            clientrotate: 'GWtheme_gw/js/jquery.flexisel'
        }
    },
    deps: [
        "clientrotate"
    ]
};
0

The require JS file just gives you access to the file when you call it into a template. But you still need to call the file into the head, use this file in your theme.

{site-root}/app/design/frontend/{vendor-namespace}/{theme}/Magento_Theme/layout/default_head_blocks.xml

<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <link src="js/jquery.flexisel.js"/> </head> </page>

0

Adding js via requirejs is the best way but not as you did

Here is a full example.

Supposing your js file is: myfile.js

app/design/frontend/GWtheme/gw/requirejs-config.js

var config = {
    map: {
        '*': {
            myscript: 'js/myfile'
        }
    }
};

app/design/frontend/GWtheme/gw/web/js/myfile.js

define(['jquery'], function($){
   "use strict";
       return function myscript()
       {
           alert("Oooh yeah !");
       }
});

Now we have to load our js in phtml, supposing we want to call it in yourfile.phtml

app/design/frontend/GWtheme/gw/Magento_Theme/templates/{yourfile}.phtml

<script type="text/javascript">
    require(['jquery', 'myscript'], function($, myscript) {
        myscript();
    });
</script>

If you want to load that js in all pages, you just have to do this:

app/design/frontend/GWtheme/gw/requirejs-config.js

var config = {
    deps: [
        'js/myfile.js'
    ],
};

Important: don't forget to :

  • clean the cache

  • clean var/view_preprocessed CONTENT

  • clean pub/static CONTENT

  • deploy the static content = php bin/magento setup:static-content:deploy -f

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.