Skip to content

Deploy Multiple Script Applications with Shared Dependencies

What You Will Learn In This Tutorial

  • Creation of a Gradle project to simplify working with shared libraries in HCL Digital Experience (DX).
  • Update bundling of new or existing NPM based projects to exclude dependencies and use the libraries in a DX Module.
  • Combine DX Module and Script Applications Projects.

Where To Get The Sample Code

Sample codes are available in GitHub: Deploy Multiple DX ScriptApps with Shared Dependencies.

Pre-Requisites

Pre-Requisites

See the detailed information here.

How to Bundle Dependencies as DX Modules

Bundle Dependencies as DX Modules

Follow the detailed steps here.

Quick Notes:

  • Set a unique rootProject.name (i.e: Reactv18r2) in DxModule/settings.gradle.
  • The Webpack profile/config file (i.e: webpack.dxmodules.js) that will be used to build the submodule is defined in the build-dxsubmodule script in its own package.json.
  • If a group of dependencies has conflicts with another group (i.e: React v16 vs v18), you'll need to create separate sub-modules for them.
  • Take note of all the output locations and filenames of the DLL manifest, for each of the submodules defined, in the DLLPlugin portion of their DxModule/<SubModule>/webpack.<dxmodules>.js files.

Important Things to Note

Important Things To Note

Check the information here.

How To Build and Deploy DX Modules

Build and Deploy DX Modules

Follow the steps here.

Optional: How to Manually Upload the DXModule EAR File

Manual EAR File Upload

Follow the steps here.

Verify A Successful Deployment and Link a DX Module to a DX Theme

Follow the steps here.

How To Bundle and Deploy a Script Application Without Its Dependencies

Script Applications Sharing Dependencies

For each of your script applications, follow the detailed steps here.

Quick Notes:

  • Set a unique wcmContentName (i.e: EducSampleScriptApp) setting in package.json.
  • Make sure the contentRoot setting in package.json matches the build or distribution folder.

How To Build and Deploy Script Applications

Build and Deploy Script Applications

Follow the steps here.

Optional: How to Build and Deploy the DXModule and All Script Applications

Build and Deploy the DX Module and All ScriptApps

Follow the steps here.