liferay 7 - Mismatched anonymous define()

Question

I'm trying to include sockjs (v1.1.2) in my liferay 7 portlet, but I'm receiving this warning:

Mismatched anonymous define() module: function ()...

and then the library isn't loaded.

I directly included the .js file in my liferay-portlet.xml like this:

<header-portlet-javascript>/common/js/sockjs.js</header-portlet-javascript>

I don't have any idea to make it work

stiemannkj1 · Accepted Answer · 2018-09-15T23:14:37.713

7

Looks like you are running into an issue that's been fixed by LPS-68298. If you are using Liferay 7.0 DXP SP2+ or Liferay 7.0 CE GA4+ you can simply open the administration sidebar and select Control Panel > Configuration > System Settings > Foundation > JavaScript Loader > Uncheck Expose Global. If you aren't using one of the above Liferay versions, you need to follow the advice of this answer and disable the AMD loader before loading your script, then re-enable the AMD loader. Alternatively, you can fix this by manually editing your JS file. Change any text in /common/js/sockjs.js like:

typeof define == 'function'

To:

false && typeof define == 'function'

This will stop the file from being loaded by Liferay's AMD loader.

edited Sep 15 '18 at 23:14

answered Mar 29 '17 at 14:01

stiemannkj1

4,418
3
25
45

I resolved with disabling and re-enabling AMD loader. – 3vi Mar 29 '17 at 17:16
Resolved using your control panel tip on Liferay 7 CE GA4. Thank you. – francarl Jun 09 '18 at 08:39
You have saved my life countless times, I keep forgeting this trick! – 0x_Anakin Sep 15 '18 at 22:41

score 0 · Answer 2 · answered Nov 12 '20 at 05:40

stiemannkj1 is right.

but if you don't want to touch the code of js library (maybe CDN) nor want to change the configuration you can do the following thing(if you worry about multiple sites and portlets may affect this behavior).

<script>
    Liferay.Loader.define._amd = Liferay.Loader.define.amd;
    Liferay.Loader.define.amd = false;
</script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<script>
    Liferay.Loader.define.amd = Liferay.Loader.define._amd;
</script>

if this code is not working then try this one.

<script>
    define._amd = define.amd;
    define.amd = false;
</script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<script>
    define.amd = define._amd;
</script>

liferay 7 - Mismatched anonymous define()

2 Answers2

Linked