1

I need some help understanding Liferay 7 themes, specifically to use jQuery plugins. As I am having the same issue as in this thread: https://web.liferay.com/community/forums/-/message_boards/view_message/79089004

"is not a function" is occuring whenever I call the plugin function I tried to install. I am tring all the possible placements for this:

<script type="text/javascript" src="${javascript_folder}/mCustomScrollbar.js"></script>

When I inspect the page I can see the jQuery object there, but it seems the plugin is not sticking..

$(".content").mCustomScrollbar();

is just a no go, and I can't figure it out why..

Victor
  • 3,520
  • 3
  • 38
  • 58
  • Its not EL `${javascript_folder}`, try using `$javascript_folder` instead. – Parkash Kumar Sep 14 '16 at 13:16
  • When you inspect the HTML, do you see proper URI for your script file? – Parkash Kumar Sep 14 '16 at 13:20
  • It is freemarker and the file is loaded correctly. I can see it there. – Victor Sep 14 '16 at 13:30
  • It seems it has something to do with the AMD stuff, I am browsing liferay's code to learn more, but they have their on Loader.. not much documentation though.. – Victor Sep 14 '16 at 13:35
  • 1
    Hey @Victor, odds are the plugin has an UMD wrapper, so in presence of our loader it won't be globally available. You'll need to configure the loader and require it before being able to use it. Can you share which specific plugin you're trying to use? – jbalsas Sep 14 '16 at 15:58
  • https://github.com/malihu/malihu-custom-scrollbar-plugin – Victor Sep 14 '16 at 16:00
  • I am trying to code this requirement, however the overall organization inside a theme seems fuzzy. And comments across the internet seems to make it worse, as I have seen this in all forms: (Liferay-JS-Config: /config/config.js). Browsing git, I could find examples for bnd projects, but non for a theme or involving jQuery – Victor Sep 14 '16 at 16:13
  • @jbalsas if you were taking about this.. it is also a no go... require(['/o/my-theme/js/mCustomScrollbar.js'], function(mCustomScrollbar) { – Victor Sep 14 '16 at 16:34
  • Possible duplicate of [liferay 7 - Mismatched anonymous define()](https://stackoverflow.com/questions/43064052/liferay-7-mismatched-anonymous-define) – stiemannkj1 Jan 15 '18 at 15:24

1 Answers1

1

crossposting from the Liferay Forums

Not that the cleanest solution, but if you simply want to keep loading your modules as globals, you might be able to do the following:

<script>
    define._amd = define.amd;
    define.amd = false;
</script>

<script type="text/javascript" src="${javascript_folder}/mCustomScrollbar.js"></script>

<script>
    define.amd = define._amd;
</script>

Setting the amd flag to false before loading your umd-wrapped plugins should do the trick and they should keep loading all the same.

Additionally, if you're hosting the file, you could actually replace &&define.amd by &&false or something similar in the plugin umd definition to make sure it will laod as a global as well.

Let me know if that works for you!

jbalsas
  • 3,484
  • 22
  • 25
  • Might not be the cleanest, but it was the only one we could get so far. I tested, including this one (replacing &&define.amd by &&false). This works like a charm. Thank you for putting your time on this. – Victor Sep 15 '16 at 16:54