2

I try to include external JS (fabric.js) in my custom module.

I try so many different way but still not getting success. i don't understand what i missing below is my code.

  1. Add external JS (fabric.js) under <Vendor>/<Module_Name>/view/<adminhtml>/web/js/fabric.js
  2. Create requirejs-config.js under <Vendor>/<Module_Name>/view/<adminhtml>/requirejs-config.js

Add following code to requirejs-config.js

/**
* Copyright © 2016 Magento. All rights reserved.
* See COPYING.txt for license details.
*/

var config = {
 map: {
    '*': {            
        fabric: 'Namespace_Modulename/js/fabric'
    }
 }
};

I followed below link to achieve my thing but still not get success.

Any other way to include external JS.

Any help would be appreciated! Thanks.

1

You need to initialize the javascript component like described in documentation.

If you use the declarative notation using the <script type="text/x-magento-init" /> tag you have to add to your .phtml

<script type="text/x-magento-init">
{
    // components initialized without binding to an element
    "*": {
        "fabric": {} // the alias for "Namespace_Modulename/js/fabric" defined in requirejs-config.js
    }
}
</script>

That's it, your javascript component will be loaded.

  • Thanks, I don't required phtml file, i want o get this value in `html file. – Chirag Patel Oct 27 '18 at 10:02
  • Do you read the documentation linked? Take a look to imperative notation. – LucScu Oct 27 '18 at 10:06
  • Yes i read it and try it but in `html file it is not working. for your efforts +1 :) – Chirag Patel Oct 27 '18 at 10:19
  • thx, but what happen if you use <script> require([ 'fabric' ], function ($) { alert('xxx); }); ); </script> – LucScu Oct 27 '18 at 10:47
  • nothing it's not alert or also not get any error in console. strange! – Chirag Patel Oct 27 '18 at 10:53
0

Your fabric.js should start something like this (if you don't need without jQuery):

  define([ 
       "jquery" 
    ],
    function($) {
        "use strict"; 

        // Here your custom code...
     console.log('Hello'); 

        });

Check this require js app example, js files always have define(

https://github.com/volojs/create-template/tree/master/www

Or if you use shim in your require config file: a shim automatically adds a wrapper around a JavaScript library that makes it AMD-compatible / RequireJS-friendly.

  • Thanks for your replay, without adding this fabric js is working fine. – Chirag Patel Oct 30 '18 at 4:43

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.