November Happy Hour will be moved to Thursday December 5th.

Multiple modules that have same client resources cause JS errors

Vote:
 

In web project we have some external CMS modules, one of them defines client resources that are loaded in CMS in config file:

WebProject\modules\_protected\LionbridgeConnector\Module.config

<?xml version="1.0" encoding="utf-8" ?>
<module loadFromBin="false" clientResourceRelativePath="ClientResources" productName="LionbridgeConnector" description="Enables editors to translate pages via Lionbridge." tags=" EPiServerModulePackage EPiServerAddOn EPiServer LionbridgeConnector " version="1.4.5.1100">
  <assemblies>
    <add assembly="LionbridgeConnector.EPiServer" />
  </assemblies>
  <clientResources>
    <add name="app-vendor" path="Scripts/Vendors/jquery-3.3.1.js" resourceType="Script" sortIndex="1" />
    <add name="app-vendor" path="Scripts/Vendors/jquery.dataTables.min.js" resourceType="Script" sortIndex="2" />
    <add name="app-vendor" path="Scripts/Vendors/dataTables.min.css" resourceType="Style" sortIndex="3" />
    <add name="app-vendor" path="Scripts/Vendors/bootstrap-dropdown.js" resourceType="Script" sortIndex="4" />
    <add name="app-vendor" path="Scripts/Vendors/lionbridge.css" resourceType="Style" sortIndex="6" />
  </clientResources>
  <dojoModules>
    <add name="workspace" path="Scripts" />
    <add name="app" path="Scripts" />
    <add name="lionbridgeconnector" path="Scripts" />
    <add name="static" path="Scripts" />
  </dojoModules>
  <clientModule>
    <moduleDependencies>
      <add dependency="CMS" type="RunAfter" />
    </moduleDependencies>
    <requiredResources>
      <add name="app-vendor" />
    </requiredResources>
  </clientModule>
</module>

It uses jquery-3.3.1.

Also we have our own module.config file in root of the project (WebProject\Module.config) where client resources for our custom CMS modules are defined.

<?xml version="1.0"?>
<module>
  <!--...-->
  <clientResources>
    <add name="jquery-vendor" path="/static/js/jquery/jquery-2.1.4.min.js" resourceType="Script" sortIndex="1" />
    <!--...-->
  </clientResources>
  <!--...-->
</module>

It uses jquery-2.1.4.

These two versions of jquery are in conflict and produce error in console:

Error: multipleDefine
    at _f (dojo.js:15)
    at _f6 (dojo.js:15)
    at def (dojo.js:15)
    at jquery-2.1.4.min.js:4
    at jquery-2.1.4.min.js:2
    at jquery-2.1.4.min.js:2

As result, some js features are not working (mainly Lionbridge).

If I remove one of the jquery files, the error dissapears (and Lionbridge starts working normally) but module left without jquery brakes.

How I can deal with this? Is there any way to avoid conflict between them?

#225478
Jul 17, 2020 12:57
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.