From 3001745a171940871675232b42c41c99c54aabec Mon Sep 17 00:00:00 2001
From: tasso94 <3015690+tasso94@users.noreply.github.com>
Date: Mon, 3 Jul 2023 14:50:04 +0200
Subject: [PATCH] fix(webapps): refactor to use asset module instead of loaders
 (#3494)

related to camunda/camunda-bpm-platform#3401
---
 .../camunda-commons-ui/lib/analytics/index.js |   2 +-
 .../camunda-commons-ui/lib/auth/page/login.js |   2 +-
 .../lib/directives/engineSelect.js            |   2 +-
 .../lib/directives/inPlaceTextField.js        |   2 +-
 .../widgets/annotation/cam-annotation-edit.js |   2 +-
 .../annotation/cam-annotation-modal.js        |   2 +-
 .../bpmn-viewer/cam-widget-bpmn-viewer.js     |   2 +-
 .../widgets/cam-share-link/cam-share-link.js  |   2 +-
 .../widgets/clipboard/cam-widget-clipboard.js |   2 +-
 .../cmmn-viewer/cam-widget-cmmn-viewer.js     |   2 +-
 .../lib/widgets/debug/cam-widget-debug.js     |   2 +-
 .../dmn-viewer/cam-widget-dmn-viewer.js       |   2 +-
 .../lib/widgets/footer/cam-widget-footer.js   |   2 +-
 .../lib/widgets/header/cam-widget-header.js   |   4 +-
 .../inline-field/cam-widget-inline-field.js   |   4 +-
 .../lib/widgets/loader/cam-widget-loader.js   |   2 +-
 .../widgets/password/cam-widget-password.js   |   2 +-
 .../search-pill/cam-widget-search-pill.js     |   2 +-
 .../lib/widgets/search/cam-widget-search.js   |   2 +-
 .../cam-widget-selection-type.js              |   2 +-
 .../widgets/variable/cam-variable-utils.js    |   4 +-
 .../widgets/variable/cam-widget-variable.js   |   2 +-
 .../cam-widget-variables-table.js             |   4 +-
 webapps/frontend/package-lock.json            |  79 ------------
 webapps/frontend/package.json                 |   2 -
 .../client/scripts/camunda-admin-bootstrap.js |   6 +-
 .../ui/admin/client/scripts/index.html        |  22 ++--
 .../admin/client/scripts/pages/analytics.js   |   2 +-
 .../client/scripts/pages/authorizations.js    |   4 +-
 .../admin/client/scripts/pages/dashboard.js   |   2 +-
 .../admin/client/scripts/pages/diagnostics.js |   2 +-
 .../client/scripts/pages/execution-metrics.js |   2 +-
 .../admin/client/scripts/pages/groupCreate.js |   2 +-
 .../admin/client/scripts/pages/groupEdit.js   |   6 +-
 .../ui/admin/client/scripts/pages/groups.js   |   2 +-
 .../ui/admin/client/scripts/pages/setup.js    |   2 +-
 .../ui/admin/client/scripts/pages/system.js   |   2 +-
 .../scripts/pages/systemSettingsGeneral.js    |   2 +-
 .../client/scripts/pages/tenantCreate.js      |   2 +-
 .../admin/client/scripts/pages/tenantEdit.js  |   4 +-
 .../ui/admin/client/scripts/pages/tenants.js  |   2 +-
 .../admin/client/scripts/pages/userCreate.js  |   2 +-
 .../ui/admin/client/scripts/pages/userEdit.js |   8 +-
 .../ui/admin/client/scripts/pages/users.js    |   2 +-
 .../app/views/dashboard/authorizations.js     |   2 +-
 .../base/app/views/dashboard/groups.js        |   2 +-
 .../base/app/views/dashboard/system.js        |   2 +-
 .../base/app/views/dashboard/tenants.js       |   2 +-
 .../plugins/base/app/views/dashboard/users.js |   2 +-
 .../client/scripts/batches/config/routes.js   |   2 +-
 .../scripts/batches/controllers/view-ctrl.js  |   4 +-
 .../scripts/camunda-cockpit-bootstrap.js      |   6 +-
 .../callActivityOverlay.js                    |   2 +-
 .../variables/variable-add-dialog.js          |   2 +-
 .../variables/variable-inspect-dialog.js      |   2 +-
 .../variables/variable-upload-dialog.js       |   2 +-
 .../directives/activityInstanceTree.js        |   2 +-
 .../scripts/directives/change-version.js      |   2 +-
 .../scripts/directives/decisionTable.js       |   2 +-
 .../directives/diagramStatisticsLoader.js     |   2 +-
 .../client/scripts/directives/incidentsTab.js |   4 +-
 .../scripts/directives/processDiagram.js      |   2 +-
 .../directives/processDiagramPreview.js       |   2 +-
 .../client/scripts/directives/quickFilter.js  |   2 +-
 .../scripts/directives/sortableTableHead.js   |   2 +-
 .../time-to-live/time-to-live-dialog.js       |   2 +-
 .../directives/time-to-live/time-to-live.js   |   2 +-
 .../client/scripts/directives/variable.js     |   2 +-
 .../ui/cockpit/client/scripts/index.html      |  22 ++--
 .../cockpit/client/scripts/pages/dashboard.js |   2 +-
 .../scripts/pages/decisionDefinition.js       |   2 +-
 .../client/scripts/pages/decisionInstance.js  |   2 +-
 .../cockpit/client/scripts/pages/decisions.js |   2 +-
 .../client/scripts/pages/processDefinition.js |   2 +-
 .../client/scripts/pages/processInstance.js   |   2 +-
 .../cockpit/client/scripts/pages/processes.js |   2 +-
 .../ui/cockpit/client/scripts/pages/tasks.js  |   2 +-
 .../reports/controllers/reports-view-ctrl.js  |   2 +-
 .../reports/directives/reports-plugin.js      |   2 +-
 .../reports/directives/reports-type.js        |   2 +-
 .../scripts/repository/config/routes.js       |   2 +-
 .../directives/cam-cockpit-deployment.js      |   2 +-
 ...cam-cockpit-deployments-sorting-choices.js |   2 +-
 .../directives/cam-cockpit-deployments.js     |   2 +-
 .../cam-cockpit-delete-deployment-plugin.js   |   4 +-
 .../resource/directives/cam-cockpit-form.js   |   2 +-
 .../directives/cam-cockpit-html-source.js     |   2 +-
 .../cam-cockpit-resource-content.js           |   2 +-
 .../directives/cam-cockpit-resource-meta.js   |   2 +-
 .../cam-cockpit-resource-wrapper.js           |   2 +-
 .../resource/directives/cam-cockpit-source.js |   2 +-
 ...cockpit-resource-action-download-plugin.js |   2 +-
 .../cam-cockpit-definitions-plugin.js         |   2 +-
 .../directives/cam-cockpit-resources.js       |   2 +-
 .../common/diagramPlugins/instanceCount.js    |   2 +-
 .../calledProcessDefinitionTable.js           |   2 +-
 .../diagramPlugins/instanceCount.js           |   2 +-
 .../views/processDefinition/pdIncidentsTab.js |   2 +-
 .../processDefinition/processInstanceTable.js |   2 +-
 .../updateSuspensionStateAction.js            |   4 +-
 .../processInstance/addVariableAction.js      |   2 +-
 .../calledProcessInstanceTable.js             |   2 +-
 .../cancelProcessInstanceAction.js            |   4 +-
 .../incident-externalTask-retry-action.js     |   4 +-
 .../processInstance/incidentJobRetryAction.js |   4 +-
 .../app/views/processInstance/incidentsTab.js |   2 +-
 .../processInstance/jobRetryBulkAction.js     |   4 +-
 .../base/app/views/processInstance/jobsTab.js |   4 +-
 .../updateSuspensionStateAction.js            |   4 +-
 .../views/processInstance/userTasksTable.js   |   4 +-
 .../processInstance/variableInstancesTab.js   |   2 +-
 .../processesDashboard/process-definitions.js |   2 +-
 .../dashboard/components/decisions-table.js   |   2 +-
 .../views/dashboard/views/decision-list.js    |   2 +-
 .../decisionInstanceTable.js                  |   2 +-
 .../app/views/decisionInstance/inputTable.js  |   2 +-
 .../app/views/decisionInstance/outputTable.js |   2 +-
 .../view-provider.config.js                   |   2 +-
 .../bulk-override-job-priority-action.js      |   4 +-
 .../override-job-priority-action.js           |   4 +-
 .../diagramPlugins/jobSuspension.js           |   2 +-
 .../jobDefinitionSuspensionOverlay.js         |   2 +-
 .../processDefinition/jobDefinitionTable.js   |   2 +-
 .../suspensionStateAction.js                  |   4 +-
 .../app/views/dashboard/task-dashboard.js     |   2 +-
 .../common/scripts/directives/breadcrumbs.js  |   2 +-
 .../module/components/cam-pagination.js       |   2 +-
 .../module/components/cam-searchable-area.js  |   2 +-
 .../scripts/module/components/cam-tabs.js     |   2 +-
 .../scripts/module/components/cam-toolbar.js  |   2 +-
 .../directives/cam-sortable-table-column.js   |   2 +-
 .../components/external-task-activity-link.js |   2 +-
 .../external-task-error-message-link.js       |   2 +-
 .../components/external-tasks-tab.js          |   2 +-
 .../scripts/services/plugins/loadPlugins.js   |   2 +-
 .../frontend/ui/tasklist/client/index.html    |  24 ++--
 .../scripts/camunda-tasklist-bootstrap.js     |   6 +-
 .../tasklist/client/scripts/config/routes.js  |   2 +-
 .../controllers/cam-tasklist-filters-ctrl.js  |   2 +-
 ...cam-tasklist-filter-modal-form-criteria.js |   2 +-
 .../cam-tasklist-filter-modal-form-general.js |   2 +-
 ...m-tasklist-filter-modal-form-permission.js |   2 +-
 ...cam-tasklist-filter-modal-form-variable.js |   2 +-
 .../cam-tasklist-filter-modal-form.js         |   2 +-
 .../filter/directives/cam-tasklist-filters.js |   2 +-
 .../directives/cam-tasklist-form-embedded.js  |   2 +-
 .../directives/cam-tasklist-form-external.js  |   2 +-
 .../cam-tasklist-form-generic-variables.js    |   2 +-
 .../directives/cam-tasklist-form-generic.js   |   2 +-
 .../form/directives/cam-tasklist-form.js      |   2 +-
 ...list-navbar-action-start-process-plugin.js |   4 +-
 .../cam-tasklist-shortcut-help-plugin.js      |   4 +-
 .../task/directives/cam-tasklist-task-meta.js |   4 +-
 .../task/directives/cam-tasklist-task.js      |   2 +-
 ...cam-tasklist-task-action-comment-plugin.js |   4 +-
 ...tasklist-task-detail-description-plugin.js |   2 +-
 ...cam-tasklist-task-detail-diagram-plugin.js |   2 +-
 .../cam-tasklist-task-detail-form-plugin.js   |   2 +-
 ...cam-tasklist-task-detail-history-plugin.js |   2 +-
 .../tasklist/directives/cam-tasklist-tasks.js |   2 +-
 .../plugins/cam-tasklist-search-plugin.js     |   2 +-
 ...sklist-navbar-action-create-task-plugin.js |   4 +-
 .../directives/cam-tasklist-variables.js      |   4 +-
 .../cam-tasklist-sorting-choices.js           |   2 +-
 .../cam-tasklist-sorting-dropdown.js          |   2 +-
 .../cam-tasklist-sorting-inputs.js            |   2 +-
 .../scripts/camunda-welcome-bootstrap.js      |   6 +-
 .../client/scripts/directives/custom-links.js |   2 +-
 .../client/scripts/directives/user-profile.js |   2 +-
 .../ui/welcome/client/scripts/index.html      |  22 ++--
 .../welcome/client/scripts/pages/welcome.js   |   2 +-
 webapps/frontend/webpack.common.js            |  57 +++------
 webapps/frontend/webpack.dev.js               | 117 +++++++-----------
 webapps/frontend/webpack.prod.js              |  44 ++++---
 174 files changed, 340 insertions(+), 457 deletions(-)

diff --git a/webapps/frontend/camunda-commons-ui/lib/analytics/index.js b/webapps/frontend/camunda-commons-ui/lib/analytics/index.js
index d502395e79b..a916d613288 100644
--- a/webapps/frontend/camunda-commons-ui/lib/analytics/index.js
+++ b/webapps/frontend/camunda-commons-ui/lib/analytics/index.js
@@ -17,7 +17,7 @@
 
 var angular = require('angular');
 
-var modalTemplate = require('./modal.html')();
+var modalTemplate = require('./modal.html?raw');
 
 // CAMUNDA_VERSION has a structure of 'major.minor.patch[-SNAPSHOT]', but we only need 'major.minor' for doc links
 var camundaVersion = (CAMUNDA_VERSION || '').match(/([0-9]+.[0-9]+)/); // eslint-disable-line
diff --git a/webapps/frontend/camunda-commons-ui/lib/auth/page/login.js b/webapps/frontend/camunda-commons-ui/lib/auth/page/login.js
index 02db9f9fa16..a6799f57b1c 100644
--- a/webapps/frontend/camunda-commons-ui/lib/auth/page/login.js
+++ b/webapps/frontend/camunda-commons-ui/lib/auth/page/login.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./login.html')();
+var template = require('./login.html?raw');
 var logo = require('svg-inline-loader?classPrefix&removeSVGTagAttrs=false!./logo.svg');
 
 var $ = require('jquery');
diff --git a/webapps/frontend/camunda-commons-ui/lib/directives/engineSelect.js b/webapps/frontend/camunda-commons-ui/lib/directives/engineSelect.js
index 784f805b1e9..aa428384596 100644
--- a/webapps/frontend/camunda-commons-ui/lib/directives/engineSelect.js
+++ b/webapps/frontend/camunda-commons-ui/lib/directives/engineSelect.js
@@ -18,7 +18,7 @@
 'use strict';
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular');
-var template = require('./engineSelect.html')();
+var template = require('./engineSelect.html?raw');
 
 var $ = require('jquery');
 
diff --git a/webapps/frontend/camunda-commons-ui/lib/directives/inPlaceTextField.js b/webapps/frontend/camunda-commons-ui/lib/directives/inPlaceTextField.js
index 332d6fe604a..87fb3f15a29 100644
--- a/webapps/frontend/camunda-commons-ui/lib/directives/inPlaceTextField.js
+++ b/webapps/frontend/camunda-commons-ui/lib/directives/inPlaceTextField.js
@@ -18,7 +18,7 @@
 'use strict';
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular');
-var template = require('./inPlaceTextField.html')();
+var template = require('./inPlaceTextField.html?raw');
 
 /**
  * @name inPlaceTextField
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-edit.js b/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-edit.js
index d2d239e98f5..415ac0aff50 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-edit.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-edit.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-const template = require('./cam-annotation-edit.html')();
+const template = require('./cam-annotation-edit.html?raw');
 const annotationModal = require('./cam-annotation-modal');
 
 module.exports = [
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-modal.js b/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-modal.js
index 9cea590af31..863e3d433b3 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-modal.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/annotation/cam-annotation-modal.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-annotation-modal.html')();
+var template = require('./cam-annotation-modal.html?raw');
 
 module.exports = (annotation, readOnly, callback) => {
   return {
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/bpmn-viewer/cam-widget-bpmn-viewer.js b/webapps/frontend/camunda-commons-ui/lib/widgets/bpmn-viewer/cam-widget-bpmn-viewer.js
index b45a4a4f888..d9dcd918d35 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/bpmn-viewer/cam-widget-bpmn-viewer.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/bpmn-viewer/cam-widget-bpmn-viewer.js
@@ -21,7 +21,7 @@ var ModuleLoader = require('../../util/moduleLoader');
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   Viewer = require('../../util/viewer'),
-  template = require('./cam-widget-bpmn-viewer.html')();
+  template = require('./cam-widget-bpmn-viewer.html?raw');
 
 module.exports = [
   '$q',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/cam-share-link/cam-share-link.js b/webapps/frontend/camunda-commons-ui/lib/widgets/cam-share-link/cam-share-link.js
index b33b0891958..dc4d754a792 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/cam-share-link/cam-share-link.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/cam-share-link/cam-share-link.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-share-link.html')();
+var template = require('./cam-share-link.html?raw');
 
 module.exports = [
   '$location',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/clipboard/cam-widget-clipboard.js b/webapps/frontend/camunda-commons-ui/lib/widgets/clipboard/cam-widget-clipboard.js
index 7ac3a89b383..30d4744bc23 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/clipboard/cam-widget-clipboard.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/clipboard/cam-widget-clipboard.js
@@ -19,7 +19,7 @@
 
 var Clipboard = require('clipboard');
 
-var template = require('./cam-widget-clipboard.html')();
+var template = require('./cam-widget-clipboard.html?raw');
 
 module.exports = [
   '$timeout',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/cmmn-viewer/cam-widget-cmmn-viewer.js b/webapps/frontend/camunda-commons-ui/lib/widgets/cmmn-viewer/cam-widget-cmmn-viewer.js
index 251e0851446..4ead1d5aff9 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/cmmn-viewer/cam-widget-cmmn-viewer.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/cmmn-viewer/cam-widget-cmmn-viewer.js
@@ -19,7 +19,7 @@
 
 var Viewer = require('cmmn-js/lib/NavigatedViewer');
 
-var template = require('./cam-widget-cmmn-viewer.html')();
+var template = require('./cam-widget-cmmn-viewer.html?raw');
 
 module.exports = [
   '$compile',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/debug/cam-widget-debug.js b/webapps/frontend/camunda-commons-ui/lib/widgets/debug/cam-widget-debug.js
index d616628d864..226723cda5b 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/debug/cam-widget-debug.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/debug/cam-widget-debug.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-widget-debug.html')();
+var template = require('./cam-widget-debug.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/dmn-viewer/cam-widget-dmn-viewer.js b/webapps/frontend/camunda-commons-ui/lib/widgets/dmn-viewer/cam-widget-dmn-viewer.js
index 883af4f0239..6f780ec286a 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/dmn-viewer/cam-widget-dmn-viewer.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/dmn-viewer/cam-widget-dmn-viewer.js
@@ -24,7 +24,7 @@ var Viewer = require('./lib/navigatedViewer').default;
 var Modeler = require('camunda-dmn-js').CamundaPlatformModeler;
 var changeDmnNamespace = require('../../util/change-dmn-namespace');
 
-var template = require('./cam-widget-dmn-viewer.html')();
+var template = require('./cam-widget-dmn-viewer.html?raw');
 
 // This is only relevant when editMode===true,
 // but we only want to rewrite the function once
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/footer/cam-widget-footer.js b/webapps/frontend/camunda-commons-ui/lib/widgets/footer/cam-widget-footer.js
index eb4c3140c32..05aaea464db 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/footer/cam-widget-footer.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/footer/cam-widget-footer.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-widget-footer.html')();
+var template = require('./cam-widget-footer.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/header/cam-widget-header.js b/webapps/frontend/camunda-commons-ui/lib/widgets/header/cam-widget-header.js
index 4b6b56a649f..c1f49f84379 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/header/cam-widget-header.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/header/cam-widget-header.js
@@ -20,8 +20,8 @@
 var $ = require('jquery');
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
-  template = require('./cam-widget-header.html'),
-  logo = require('raw-loader!./logo-2020-round.svg').default;
+  template = require('./cam-widget-header.html?raw'),
+  logo = require('./logo-2020-round.svg?raw');
 
 var apps = {
   welcome: {
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/inline-field/cam-widget-inline-field.js b/webapps/frontend/camunda-commons-ui/lib/widgets/inline-field/cam-widget-inline-field.js
index d714451b62f..fe78613c4d8 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/inline-field/cam-widget-inline-field.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/inline-field/cam-widget-inline-field.js
@@ -19,10 +19,10 @@
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   $ = require('jquery'),
-  template = require('./cam-widget-inline-field.html')();
+  template = require('./cam-widget-inline-field.html?raw');
 
 const dialogController = require('./dialog/controller');
-const dialogTemplate = require('./dialog/template.html')();
+const dialogTemplate = require('./dialog/template.html?raw');
 
 function getScrollParent(element) {
   var style = getComputedStyle(element);
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/loader/cam-widget-loader.js b/webapps/frontend/camunda-commons-ui/lib/widgets/loader/cam-widget-loader.js
index 79952202173..1f3c89b2c52 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/loader/cam-widget-loader.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/loader/cam-widget-loader.js
@@ -18,7 +18,7 @@
 'use strict';
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
-  template = require('./cam-widget-loader.html')();
+  template = require('./cam-widget-loader.html?raw');
 
 module.exports = [
   '$translate',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/password/cam-widget-password.js b/webapps/frontend/camunda-commons-ui/lib/widgets/password/cam-widget-password.js
index e468c18eaad..1e1f63a61b6 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/password/cam-widget-password.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/password/cam-widget-password.js
@@ -18,7 +18,7 @@
 'use strict';
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
-  template = require('./cam-widget-password.html')();
+  template = require('./cam-widget-password.html?raw');
 
 module.exports = [
   'camAPI',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/search-pill/cam-widget-search-pill.js b/webapps/frontend/camunda-commons-ui/lib/widgets/search-pill/cam-widget-search-pill.js
index 888bb8b94df..35aea1f7a43 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/search-pill/cam-widget-search-pill.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/search-pill/cam-widget-search-pill.js
@@ -18,7 +18,7 @@
 'use strict';
 
 var $ = require('jquery'),
-  template = require('./cam-widget-search-pill.html')();
+  template = require('./cam-widget-search-pill.html?raw');
 
 module.exports = [
   '$timeout',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/search/cam-widget-search.js b/webapps/frontend/camunda-commons-ui/lib/widgets/search/cam-widget-search.js
index cf6df076b3c..d3d7167536a 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/search/cam-widget-search.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/search/cam-widget-search.js
@@ -20,7 +20,7 @@
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   copy = angular.copy,
   $ = require('jquery'),
-  template = require('./cam-widget-search.html')();
+  template = require('./cam-widget-search.html?raw');
 
 var dateRegex = /(\d\d\d\d)-(\d\d)-(\d\d)T(\d\d):(\d\d):(\d\d)(?:.(\d\d\d)| )?$/;
 
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/selection-type/cam-widget-selection-type.js b/webapps/frontend/camunda-commons-ui/lib/widgets/selection-type/cam-widget-selection-type.js
index 1260ea39ea7..9ec887e808b 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/selection-type/cam-widget-selection-type.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/selection-type/cam-widget-selection-type.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-widget-selection-type.html');
+var template = require('./cam-widget-selection-type.html?raw');
 
 module.exports = [
   '$location',
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-variable-utils.js b/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-variable-utils.js
index 200874df0d2..6320e611fbc 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-variable-utils.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-variable-utils.js
@@ -19,8 +19,8 @@
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   typeUtils = require('camunda-bpm-sdk-js/lib/forms/type-util'),
-  templateDialog = require('./cam-widget-variable-dialog.html')(),
-  templateStringDialog = require('./cam-widget-string-dialog.html')();
+  templateDialog = require('./cam-widget-variable-dialog.html?raw'),
+  templateStringDialog = require('./cam-widget-string-dialog.html?raw');
 
 var varUtils = {};
 
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-widget-variable.js b/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-widget-variable.js
index fef729efa3b..7836fd10b44 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-widget-variable.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/variable/cam-widget-variable.js
@@ -19,7 +19,7 @@
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   varUtils = require('./cam-variable-utils'),
-  template = require('./cam-widget-variable.html')();
+  template = require('./cam-widget-variable.html?raw');
 
 var variableTypes = varUtils.types;
 
diff --git a/webapps/frontend/camunda-commons-ui/lib/widgets/variables-table/cam-widget-variables-table.js b/webapps/frontend/camunda-commons-ui/lib/widgets/variables-table/cam-widget-variables-table.js
index a82f3151e31..7b77b78c241 100644
--- a/webapps/frontend/camunda-commons-ui/lib/widgets/variables-table/cam-widget-variables-table.js
+++ b/webapps/frontend/camunda-commons-ui/lib/widgets/variables-table/cam-widget-variables-table.js
@@ -19,8 +19,8 @@
 
 var angular = require('camunda-bpm-sdk-js/vendor/angular'),
   varUtils = require('../variable/cam-variable-utils'),
-  template = require('./cam-widget-variables-table.html'),
-  confirmationTemplate = require('./cam-widget-variables-deletion-dialog.html')();
+  template = require('./cam-widget-variables-table.html?raw'),
+  confirmationTemplate = require('./cam-widget-variables-deletion-dialog.html?raw');
 
 var typeUtils = varUtils.typeUtils;
 
diff --git a/webapps/frontend/package-lock.json b/webapps/frontend/package-lock.json
index b47c848d1a3..625cd2a63c5 100644
--- a/webapps/frontend/package-lock.json
+++ b/webapps/frontend/package-lock.json
@@ -61,7 +61,6 @@
         "babel-loader": "9.1.2",
         "copy-webpack-plugin": "11.0.0",
         "css-loader": "6.7.3",
-        "ejs-loader": "0.5.0",
         "eslint": "8.38.0",
         "eslint-config-prettier": "8.8.0",
         "eslint-plugin-camunda-licensed": "0.4.6",
@@ -81,7 +80,6 @@
         "mini-css-extract-plugin": "2.7.5",
         "prettier": "1.19.1",
         "raw-loader": "4.0.2",
-        "string-replace-loader": "3.1.0",
         "svg-inline-loader": "0.8.2",
         "terser-webpack-plugin": "5.3.7",
         "webpack": "5.79.0",
@@ -89,9 +87,6 @@
         "webpack-cli": "5.0.1",
         "webpack-dev-server": "4.13.2",
         "webpack-merge": "5.8.0"
-      },
-      "engines": {
-        "node": ">=12.20.0"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -5763,16 +5758,6 @@
       "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "dev": true
     },
-    "node_modules/ejs-loader": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/ejs-loader/-/ejs-loader-0.5.0.tgz",
-      "integrity": "sha512-iirFqlP3tiFoedNZ7dQcjvechunl054VbW6Ki38T/pabgXMAncduSE0ZXLeVGn1NbmcUJF9Z5TC0EvQ4RIpP9Q==",
-      "dev": true,
-      "dependencies": {
-        "loader-utils": "^2.0.0",
-        "lodash": "^4.17.15"
-      }
-    },
     "node_modules/electron-to-chromium": {
       "version": "1.4.311",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.311.tgz",
@@ -10820,37 +10805,6 @@
         "safe-buffer": "~5.2.0"
       }
     },
-    "node_modules/string-replace-loader": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/string-replace-loader/-/string-replace-loader-3.1.0.tgz",
-      "integrity": "sha512-5AOMUZeX5HE/ylKDnEa/KKBqvlnFmRZudSOjVJHxhoJg9QYTwl1rECx7SLR8BBH7tfxb4Rp7EM2XVfQFxIhsbQ==",
-      "dev": true,
-      "dependencies": {
-        "loader-utils": "^2.0.0",
-        "schema-utils": "^3.0.0"
-      },
-      "peerDependencies": {
-        "webpack": "^5"
-      }
-    },
-    "node_modules/string-replace-loader/node_modules/schema-utils": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
-      "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
-      "dev": true,
-      "dependencies": {
-        "@types/json-schema": "^7.0.8",
-        "ajv": "^6.12.5",
-        "ajv-keywords": "^3.5.2"
-      },
-      "engines": {
-        "node": ">= 10.13.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
-      }
-    },
     "node_modules/string-width": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@@ -16720,16 +16674,6 @@
       "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "dev": true
     },
-    "ejs-loader": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/ejs-loader/-/ejs-loader-0.5.0.tgz",
-      "integrity": "sha512-iirFqlP3tiFoedNZ7dQcjvechunl054VbW6Ki38T/pabgXMAncduSE0ZXLeVGn1NbmcUJF9Z5TC0EvQ4RIpP9Q==",
-      "dev": true,
-      "requires": {
-        "loader-utils": "^2.0.0",
-        "lodash": "^4.17.15"
-      }
-    },
     "electron-to-chromium": {
       "version": "1.4.311",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.311.tgz",
@@ -20587,29 +20531,6 @@
         "safe-buffer": "~5.2.0"
       }
     },
-    "string-replace-loader": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/string-replace-loader/-/string-replace-loader-3.1.0.tgz",
-      "integrity": "sha512-5AOMUZeX5HE/ylKDnEa/KKBqvlnFmRZudSOjVJHxhoJg9QYTwl1rECx7SLR8BBH7tfxb4Rp7EM2XVfQFxIhsbQ==",
-      "dev": true,
-      "requires": {
-        "loader-utils": "^2.0.0",
-        "schema-utils": "^3.0.0"
-      },
-      "dependencies": {
-        "schema-utils": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
-          "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
-          "dev": true,
-          "requires": {
-            "@types/json-schema": "^7.0.8",
-            "ajv": "^6.12.5",
-            "ajv-keywords": "^3.5.2"
-          }
-        }
-      }
-    },
     "string-width": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
diff --git a/webapps/frontend/package.json b/webapps/frontend/package.json
index 11d9bf763fb..ba441907ed7 100644
--- a/webapps/frontend/package.json
+++ b/webapps/frontend/package.json
@@ -71,7 +71,6 @@
     "babel-loader": "9.1.2",
     "copy-webpack-plugin": "11.0.0",
     "css-loader": "6.7.3",
-    "ejs-loader": "0.5.0",
     "eslint": "8.38.0",
     "eslint-config-prettier": "8.8.0",
     "eslint-plugin-camunda-licensed": "0.4.6",
@@ -91,7 +90,6 @@
     "mini-css-extract-plugin": "2.7.5",
     "prettier": "1.19.1",
     "raw-loader": "4.0.2",
-    "string-replace-loader": "3.1.0",
     "svg-inline-loader": "0.8.2",
     "terser-webpack-plugin": "5.3.7",
     "webpack": "5.79.0",
diff --git a/webapps/frontend/ui/admin/client/scripts/camunda-admin-bootstrap.js b/webapps/frontend/ui/admin/client/scripts/camunda-admin-bootstrap.js
index dbcd9f3d14b..49a6ff614eb 100644
--- a/webapps/frontend/ui/admin/client/scripts/camunda-admin-bootstrap.js
+++ b/webapps/frontend/ui/admin/client/scripts/camunda-admin-bootstrap.js
@@ -27,7 +27,7 @@ import {
 
 window.define = define;
 window.require = rjsrequire;
-window.bust = '$CACHE_BUST';
+window.bust = CAMUNDA_VERSION; // eslint-disable-line
 
 // camunda-admin-bootstrap is copied as-is, so we have to inline everything
 const appRoot = document.querySelector('base').getAttribute('app-root');
@@ -35,7 +35,7 @@ const baseImportPath = `${appRoot}/app/admin/`;
 
 requirejs.config({
   baseUrl: baseImportPath,
-  urlArgs: 'bust=$CACHE_BUST'
+  urlArgs: `bust=${CAMUNDA_VERSION}` // eslint-disable-line
 });
 
 const loadConfig = (async function() {
@@ -86,7 +86,7 @@ define('camunda-admin-bootstrap', function() {
         node.setAttribute('rel', 'stylesheet');
         node.setAttribute(
           'href',
-          plugin.location + '/plugin.css?bust=$CACHE_BUST'
+          plugin.location + `/plugin.css?bust=${CAMUNDA_VERSION}` // eslint-disable-line
         );
         document.head.appendChild(node);
       });
diff --git a/webapps/frontend/ui/admin/client/scripts/index.html b/webapps/frontend/ui/admin/client/scripts/index.html
index ff0046a32b9..b20d87a2ced 100644
--- a/webapps/frontend/ui/admin/client/scripts/index.html
+++ b/webapps/frontend/ui/admin/client/scripts/index.html
@@ -16,13 +16,13 @@
         content="camunda services GmbH"/>
 
   <!-- settings the base path for relative links -->
-  <base href="$BASE"
-        admin-api="$APP_ROOT/api/admin/"
-        cockpit-api="$APP_ROOT/api/cockpit/"
-        tasklist-api="$APP_ROOT/api/tasklist/"
-        welcome-api="$APP_ROOT/api/welcome/"
-        engine-api="$APP_ROOT/api/engine/"
-        app-root="$APP_ROOT"
+  <base href="<%= htmlWebpackPlugin.options.base %>"
+        admin-api="<%= htmlWebpackPlugin.options.appRoot %>/api/admin/"
+        cockpit-api="<%= htmlWebpackPlugin.options.appRoot %>/api/cockpit/"
+        tasklist-api="<%= htmlWebpackPlugin.options.appRoot %>/api/tasklist/"
+        welcome-api="<%= htmlWebpackPlugin.options.appRoot %>/api/welcome/"
+        engine-api="<%= htmlWebpackPlugin.options.appRoot %>/api/engine/"
+        app-root="<%= htmlWebpackPlugin.options.appRoot %>"
         app-name="admin"/>
 
   <!-- an example of plugin/feature exclusion -->
@@ -39,7 +39,7 @@
 
   <link rel="stylesheet"
         type="text/css"
-        href="${'$APP_ROOT/app/admin/styles/user-styles.css?bust=$CACHE_BUST'}">
+        href="<%= htmlWebpackPlugin.options.appRoot %>/app/admin/styles/user-styles.css?bust=<%= htmlWebpackPlugin.options.version %>">
         <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
 <body ng-controller="camAdminAppCtrl" ng-class="{'no-breadcrumbs': !$root.showBreadcrumbs}">
 <!-- navigation -->
@@ -100,13 +100,13 @@
 
 <!-- footer -->
 <footer cam-widget-footer
-        version="v$VERSION"></footer>
+        version="v<%= htmlWebpackPlugin.options.version %>"></footer>
 
 <script type="application/javascript" $CSP_NONCE>
   var adminConf = window.camAdminConf = {};
 
-  window.PLUGIN_DEPENDENCIES = $PLUGIN_DEPENDENCIES || [];
-  window.PLUGIN_PACKAGES = $PLUGIN_PACKAGES || [];
+  window.PLUGIN_DEPENDENCIES = <%= htmlWebpackPlugin.options.pluginDeps %> || [];
+  window.PLUGIN_PACKAGES = <%= htmlWebpackPlugin.options.pluginPackages %> || [];
 
   window.require = {
     waitSeconds: 0
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/analytics.js b/webapps/frontend/ui/admin/client/scripts/pages/analytics.js
index 5e2ef592bf8..a177f7804d9 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/analytics.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/analytics.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./analytics.html')();
+var template = require('./analytics.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/authorizations.js b/webapps/frontend/ui/admin/client/scripts/pages/authorizations.js
index 981e6571278..dbdff51de86 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/authorizations.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/authorizations.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var template = require('./authorizations.html')();
-var confirmTemplate = require('./confirm-delete-authorization.html')();
+var template = require('./authorizations.html?raw');
+var confirmTemplate = require('./confirm-delete-authorization.html?raw');
 
 module.exports = [
   '$routeProvider',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/dashboard.js b/webapps/frontend/ui/admin/client/scripts/pages/dashboard.js
index b20975b272f..8891f88c56a 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/dashboard.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/dashboard.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./dashboard.html')();
+var template = require('./dashboard.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var isArray = angular.isArray;
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/diagnostics.js b/webapps/frontend/ui/admin/client/scripts/pages/diagnostics.js
index 2e2a20af53a..ccbb7826a9d 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/diagnostics.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/diagnostics.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./diagnostics.html')();
+var template = require('./diagnostics.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/execution-metrics.js b/webapps/frontend/ui/admin/client/scripts/pages/execution-metrics.js
index 3edd4673283..14a943de0a7 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/execution-metrics.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/execution-metrics.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./execution-metrics.html')();
+var template = require('./execution-metrics.html?raw');
 var CamSDK = require('camunda-bpm-sdk-js/lib/angularjs/index');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/groupCreate.js b/webapps/frontend/ui/admin/client/scripts/pages/groupCreate.js
index 8eade5682e3..c15f1735023 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/groupCreate.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/groupCreate.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./groupCreate.html')();
+var template = require('./groupCreate.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/groupEdit.js b/webapps/frontend/ui/admin/client/scripts/pages/groupEdit.js
index c7ceb488322..c3875565e01 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/groupEdit.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/groupEdit.js
@@ -17,9 +17,9 @@
 
 'use strict';
 
-var template = require('./groupEdit.html')();
-var tenantTemplate = require('./create-tenant-group-membership.html')();
-var confirmationTemplate = require('./generic-confirmation.html')();
+var template = require('./groupEdit.html?raw');
+var tenantTemplate = require('./create-tenant-group-membership.html?raw');
+var confirmationTemplate = require('./generic-confirmation.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/groups.js b/webapps/frontend/ui/admin/client/scripts/pages/groups.js
index 8787905fdb2..b13ccade9b5 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/groups.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/groups.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./groups.html')();
+var template = require('./groups.html?raw');
 var searchConfig = require('./groups-search-plugin-config.json');
 
 var angular = require('camunda-commons-ui/vendor/angular');
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/setup.js b/webapps/frontend/ui/admin/client/scripts/pages/setup.js
index 809e4e7afe2..e582c1f35cd 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/setup.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/setup.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./setup.html')();
+var template = require('./setup.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/system.js b/webapps/frontend/ui/admin/client/scripts/pages/system.js
index 1f8820357ab..370230722ce 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/system.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/system.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./system.html')();
+var template = require('./system.html?raw');
 
 var angular = require('angular');
 
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/systemSettingsGeneral.js b/webapps/frontend/ui/admin/client/scripts/pages/systemSettingsGeneral.js
index 67737c5060a..5d8d24f5968 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/systemSettingsGeneral.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/systemSettingsGeneral.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./systemSettingsGeneral.html')();
+var template = require('./systemSettingsGeneral.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/tenantCreate.js b/webapps/frontend/ui/admin/client/scripts/pages/tenantCreate.js
index 39bbf8459b1..8820fefc39e 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/tenantCreate.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/tenantCreate.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./tenantCreate.html')();
+var template = require('./tenantCreate.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/tenantEdit.js b/webapps/frontend/ui/admin/client/scripts/pages/tenantEdit.js
index 8784a945232..30b366e860a 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/tenantEdit.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/tenantEdit.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var template = require('./tenantEdit.html')();
-var confirmationTemplate = require('./generic-confirmation.html')();
+var template = require('./tenantEdit.html?raw');
+var confirmationTemplate = require('./generic-confirmation.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/tenants.js b/webapps/frontend/ui/admin/client/scripts/pages/tenants.js
index 9c0ce150205..dc5e6b4751a 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/tenants.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/tenants.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./tenants.html')();
+var template = require('./tenants.html?raw');
 var searchConfig = require('./tenants-search-plugin-config.json');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/userCreate.js b/webapps/frontend/ui/admin/client/scripts/pages/userCreate.js
index 6cda6e5aead..4d6b1eb02aa 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/userCreate.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/userCreate.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./userCreate.html')();
+var template = require('./userCreate.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/userEdit.js b/webapps/frontend/ui/admin/client/scripts/pages/userEdit.js
index c1dd1c29612..5b2f377e639 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/userEdit.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/userEdit.js
@@ -17,10 +17,10 @@
 
 'use strict';
 
-var template = require('./userEdit.html')();
-var groupTemplate = require('./create-group-membership.html')();
-var tenantTemplate = require('./create-tenant-user-membership.html')();
-var confirmationTemplate = require('./generic-confirmation.html')();
+var template = require('./userEdit.html?raw');
+var groupTemplate = require('./create-group-membership.html?raw');
+var tenantTemplate = require('./create-tenant-user-membership.html?raw');
+var confirmationTemplate = require('./generic-confirmation.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/admin/client/scripts/pages/users.js b/webapps/frontend/ui/admin/client/scripts/pages/users.js
index 498cb905b97..de9878c7d44 100644
--- a/webapps/frontend/ui/admin/client/scripts/pages/users.js
+++ b/webapps/frontend/ui/admin/client/scripts/pages/users.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./users.html')();
+var template = require('./users.html?raw');
 var searchConfig = require('./users-search-plugin-config.json');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/authorizations.js b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/authorizations.js
index 72e4c80f55e..3cfb23832ba 100644
--- a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/authorizations.js
+++ b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/authorizations.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./authorizations.html')();
+var template = require('./authorizations.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/groups.js b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/groups.js
index 09b3c5c4019..b456fb0a7a1 100644
--- a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/groups.js
+++ b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/groups.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./groups.html')();
+var template = require('./groups.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/system.js b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/system.js
index d9c0df0b1f8..25680c9595e 100644
--- a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/system.js
+++ b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/system.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./system.html')();
+var template = require('./system.html?raw');
 
 var angular = require('angular');
 
diff --git a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/tenants.js b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/tenants.js
index bc43ab47259..e926340c8a1 100644
--- a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/tenants.js
+++ b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/tenants.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./tenants.html')();
+var template = require('./tenants.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/users.js b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/users.js
index 52672680abc..e73bce48e4c 100644
--- a/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/users.js
+++ b/webapps/frontend/ui/admin/plugins/base/app/views/dashboard/users.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./users.html')();
+var template = require('./users.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/batches/config/routes.js b/webapps/frontend/ui/cockpit/client/scripts/batches/config/routes.js
index 9eb0b7f770f..e0f1217e898 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/batches/config/routes.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/batches/config/routes.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./../templates/cam-cockpit-batch-view.html')();
+var template = require('./../templates/cam-cockpit-batch-view.html?raw');
 var ctrl = require('../controllers/view-ctrl');
 
 module.exports = [
diff --git a/webapps/frontend/ui/cockpit/client/scripts/batches/controllers/view-ctrl.js b/webapps/frontend/ui/cockpit/client/scripts/batches/controllers/view-ctrl.js
index 93b74a1e1fa..042c743845f 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/batches/controllers/view-ctrl.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/batches/controllers/view-ctrl.js
@@ -22,11 +22,11 @@ var events = require('../components/events');
 var angular = require('camunda-commons-ui/vendor/angular');
 var searchConfig = require('../config/batch-search-config.json');
 
-var deleteModalTemplate = require('./../templates/delete-modal.html')();
+var deleteModalTemplate = require('./../templates/delete-modal.html?raw');
 var deleteModalCtrl = require('./modal-ctrl');
 
 var jobLogModalCtrl = require('./job-log-ctrl');
-var jobLogModalTemplate = require('./../templates/job-log.html')();
+var jobLogModalTemplate = require('./../templates/job-log.html?raw');
 
 module.exports = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/camunda-cockpit-bootstrap.js b/webapps/frontend/ui/cockpit/client/scripts/camunda-cockpit-bootstrap.js
index 8f6e13ac195..2d872edf517 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/camunda-cockpit-bootstrap.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/camunda-cockpit-bootstrap.js
@@ -28,7 +28,7 @@ import {
 
 window.define = define;
 window.require = rjsrequire;
-window.bust = '$CACHE_BUST';
+window.bust = CAMUNDA_VERSION; // eslint-disable-line
 
 //  camunda-cockpit-bootstrap is copied as-is, so we have to inline everything
 const appRoot = document.querySelector('base').getAttribute('app-root');
@@ -36,7 +36,7 @@ const baseImportPath = `${appRoot}/app/cockpit/`;
 
 requirejs.config({
   baseUrl: baseImportPath,
-  urlArgs: 'bust=$CACHE_BUST'
+  urlArgs: `bust=${CAMUNDA_VERSION}` // eslint-disable-line
 });
 
 function withSuffix(string, suffix) {
@@ -107,7 +107,7 @@ define('camunda-cockpit-bootstrap', function() {
         node.setAttribute('rel', 'stylesheet');
         node.setAttribute(
           'href',
-          plugin.location + '/plugin.css?bust=$CACHE_BUST'
+          plugin.location + `/plugin.css?bust=${CAMUNDA_VERSION}` // eslint-disable-line
         );
         document.head.appendChild(node);
       });
diff --git a/webapps/frontend/ui/cockpit/client/scripts/components/callActivityOverlays/callActivityOverlay.js b/webapps/frontend/ui/cockpit/client/scripts/components/callActivityOverlays/callActivityOverlay.js
index 95cdd84977f..a9846251d5b 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/components/callActivityOverlays/callActivityOverlay.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/components/callActivityOverlays/callActivityOverlay.js
@@ -17,7 +17,7 @@
 
 'use strict';
 const angular = require('angular');
-const template = require('./template.html')();
+const template = require('./template.html?raw');
 
 module.exports = {
   getCallActivityFlowNodes: getCallActivityFlowNodes,
diff --git a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-add-dialog.js b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-add-dialog.js
index f6c9a359da3..d70f5a8b2de 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-add-dialog.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-add-dialog.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./variable-add-dialog.html')();
+var template = require('./variable-add-dialog.html?raw');
 
 var Controller = [
   '$uibModalInstance',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-inspect-dialog.js b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-inspect-dialog.js
index 40feda31cc2..43a5007e9e4 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-inspect-dialog.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-inspect-dialog.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./variable-inspect-dialog.html')();
+var template = require('./variable-inspect-dialog.html?raw');
 
 var Controller = [
   '$http',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-upload-dialog.js b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-upload-dialog.js
index a81d65a2cbf..65c90e71a01 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-upload-dialog.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/components/variables/variable-upload-dialog.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./variable-upload-dialog.html')();
+var template = require('./variable-upload-dialog.html?raw');
 
 var Controller = [
   '$uibModalInstance',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/activityInstanceTree.js b/webapps/frontend/ui/cockpit/client/scripts/directives/activityInstanceTree.js
index 1535262a504..2a7acca8365 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/activityInstanceTree.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/activityInstanceTree.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./activity-instance-tree.html')();
+var template = require('./activity-instance-tree.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/change-version.js b/webapps/frontend/ui/cockpit/client/scripts/directives/change-version.js
index ccb8512fb60..935d917ff54 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/change-version.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/change-version.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./change-version.html')();
+var template = require('./change-version.html?raw');
 
 module.exports = [
   '$timeout',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/decisionTable.js b/webapps/frontend/ui/cockpit/client/scripts/directives/decisionTable.js
index 13895ec1eb9..332a53b0921 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/decisionTable.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/decisionTable.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decisionTable.html')();
+var template = require('./decisionTable.html?raw');
 
 var DirectiveController = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/diagramStatisticsLoader.js b/webapps/frontend/ui/cockpit/client/scripts/directives/diagramStatisticsLoader.js
index 34b526fd61e..7a6b9026105 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/diagramStatisticsLoader.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/diagramStatisticsLoader.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./diagram-statistics-loader.html')();
+var template = require('./diagram-statistics-loader.html?raw');
 
 module.exports = [
   'Loaders',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/incidentsTab.js b/webapps/frontend/ui/cockpit/client/scripts/directives/incidentsTab.js
index 3e31c911791..77acaa280ef 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/incidentsTab.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/incidentsTab.js
@@ -19,8 +19,8 @@
 
 var angular = require('angular');
 
-var template = require('./incidents-tab.html')();
-var inspectTemplate = require('./incidents-tab-stacktrace.html')();
+var template = require('./incidents-tab.html?raw');
+var inspectTemplate = require('./incidents-tab-stacktrace.html?raw');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
   .debouncePromiseFactory;
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagram.js b/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagram.js
index cbf2c65c70f..e085072890c 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagram.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagram.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./processDiagram.html')();
+var template = require('./processDiagram.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagramPreview.js b/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagramPreview.js
index e892519ef71..7aefaba4ef1 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagramPreview.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/processDiagramPreview.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./processDiagramPreview.html')();
+var template = require('./processDiagramPreview.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/quickFilter.js b/webapps/frontend/ui/cockpit/client/scripts/directives/quickFilter.js
index 5d074c0b8b9..7f797584c86 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/quickFilter.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/quickFilter.js
@@ -36,7 +36,7 @@
 
 'use strict';
 
-var template = require('./quick-filter.html')();
+var template = require('./quick-filter.html?raw');
 
 var $ = require('jquery');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/sortableTableHead.js b/webapps/frontend/ui/cockpit/client/scripts/directives/sortableTableHead.js
index d3d564c554d..3b8aeca2f3d 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/sortableTableHead.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/sortableTableHead.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./sortable-table-head.html')();
+var template = require('./sortable-table-head.html?raw');
 
 var Directive = function() {
   return {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live-dialog.js b/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live-dialog.js
index 2d159ffcb1b..5135d871e7e 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live-dialog.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live-dialog.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-const template = require('./time-to-live-dialog.html')();
+const template = require('./time-to-live-dialog.html?raw');
 
 const Controller = [
   'camAPI',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live.js b/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live.js
index 7bc05b918da..f72ca306be7 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/time-to-live/time-to-live.js
@@ -20,7 +20,7 @@
 const angular = require('angular');
 const modalDialog = require('./time-to-live-dialog');
 
-const template = require('./time-to-live.html')();
+const template = require('./time-to-live.html?raw');
 
 module.exports = [
   '$translate',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/directives/variable.js b/webapps/frontend/ui/cockpit/client/scripts/directives/variable.js
index f0a184d9546..947f7c42732 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/directives/variable.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/directives/variable.js
@@ -24,7 +24,7 @@
 
 var angular = require('angular');
 
-var template = require('./variable.html')();
+var template = require('./variable.html?raw');
 
 module.exports = [
   'typeUtils',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/index.html b/webapps/frontend/ui/cockpit/client/scripts/index.html
index 1b862670dbe..b922639f0ae 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/index.html
+++ b/webapps/frontend/ui/cockpit/client/scripts/index.html
@@ -16,13 +16,13 @@
           content="camunda services GmbH" />
 
     <!-- settings the base path for relative links -->
-    <base href="$BASE"
-          admin-api="$APP_ROOT/api/admin/"
-          cockpit-api="$APP_ROOT/api/cockpit/"
-          tasklist-api="$APP_ROOT/api/tasklist/"
-          welcome-api="$APP_ROOT/api/welcome/"
-          engine-api="$APP_ROOT/api/engine/"
-          app-root="$APP_ROOT"
+    <base href="<%= htmlWebpackPlugin.options.base %>"
+          admin-api="<%= htmlWebpackPlugin.options.appRoot %>/api/admin/"
+          cockpit-api="<%= htmlWebpackPlugin.options.appRoot %>/api/cockpit/"
+          tasklist-api="<%= htmlWebpackPlugin.options.appRoot %>/api/tasklist/"
+          welcome-api="<%= htmlWebpackPlugin.options.appRoot %>/api/welcome/"
+          engine-api="<%= htmlWebpackPlugin.options.appRoot %>/api/engine/"
+          app-root="<%= htmlWebpackPlugin.options.appRoot %>"
           app-name="cockpit" />
 
     <!-- an example of plugin/feature exclusion -->
@@ -39,7 +39,7 @@
 
     <link rel="stylesheet"
           type="text/css"
-          href="${'$APP_ROOT/app/cockpit/styles/user-styles.css?bust=$CACHE_BUST'}">
+          href="<%= htmlWebpackPlugin.options.appRoot %>/app/cockpit/styles/user-styles.css?bust=<%= htmlWebpackPlugin.options.version %>">
           <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
   <body>
     <!-- navigation -->
@@ -98,13 +98,13 @@
 
     <!-- footer -->
     <footer cam-widget-footer
-            version="v$VERSION"></footer>
+            version="v<%= htmlWebpackPlugin.options.version %>"></footer>
 
     <script type="application/javascript" $CSP_NONCE>
         window.camCockpitConf = {};
 
-        window.PLUGIN_DEPENDENCIES = $PLUGIN_DEPENDENCIES || [];
-        window.PLUGIN_PACKAGES = $PLUGIN_PACKAGES || [];
+        window.PLUGIN_DEPENDENCIES = <%= htmlWebpackPlugin.options.pluginDeps %> || [];
+        window.PLUGIN_PACKAGES = <%= htmlWebpackPlugin.options.pluginPackages %> || [];
 
         window.require = {
           waitSeconds: 0
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/dashboard.js b/webapps/frontend/ui/cockpit/client/scripts/pages/dashboard.js
index 47406124956..b8d6b3c21ab 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/dashboard.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/dashboard.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./dashboard.html')();
+var template = require('./dashboard.html?raw');
 var series = require('camunda-bpm-sdk-js').utils.series;
 
 function prioritySort(a, b) {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/decisionDefinition.js b/webapps/frontend/ui/cockpit/client/scripts/pages/decisionDefinition.js
index 63781cbdb9c..7e1495ee1c7 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/decisionDefinition.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/decisionDefinition.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decision-definition.html')();
+var template = require('./decision-definition.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular'),
   routeUtil = require('../../../../common/scripts/util/routeUtil'),
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/decisionInstance.js b/webapps/frontend/ui/cockpit/client/scripts/pages/decisionInstance.js
index 5363a51d3fb..019ca62371b 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/decisionInstance.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/decisionInstance.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decision-instance.html')();
+var template = require('./decision-instance.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular'),
   routeUtil = require('../../../../common/scripts/util/routeUtil');
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/decisions.js b/webapps/frontend/ui/cockpit/client/scripts/pages/decisions.js
index 1bf1b5f3820..d96f5ea98c3 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/decisions.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/decisions.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decisions.html')();
+var template = require('./decisions.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/processDefinition.js b/webapps/frontend/ui/cockpit/client/scripts/pages/processDefinition.js
index f93152ed863..a6c9cceb298 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/processDefinition.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/processDefinition.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./process-definition.html')();
+var template = require('./process-definition.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var routeUtil = require('../../../../common/scripts/util/routeUtil');
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/processInstance.js b/webapps/frontend/ui/cockpit/client/scripts/pages/processInstance.js
index c243b126002..10c5618e968 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/processInstance.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/processInstance.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./process-instance.html')();
+var template = require('./process-instance.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var commonModule = require('../../../../common/scripts/module');
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/processes.js b/webapps/frontend/ui/cockpit/client/scripts/pages/processes.js
index a7ef9643294..b2aa685402f 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/processes.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/processes.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./processes.html')();
+var template = require('./processes.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/pages/tasks.js b/webapps/frontend/ui/cockpit/client/scripts/pages/tasks.js
index 937c20be79d..ed4c378532c 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/pages/tasks.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/pages/tasks.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./tasks.html')();
+var template = require('./tasks.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/reports/controllers/reports-view-ctrl.js b/webapps/frontend/ui/cockpit/client/scripts/reports/controllers/reports-view-ctrl.js
index 243f48f5cfa..d899e781fd2 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/reports/controllers/reports-view-ctrl.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/reports/controllers/reports-view-ctrl.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./reports-view.html')();
+var template = require('./reports-view.html?raw');
 var angular = require('camunda-commons-ui/vendor/angular');
 var extend = angular.extend;
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-plugin.js b/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-plugin.js
index fcd3be0c510..88ac29e407c 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-plugin.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./reports-plugin.html')();
+var template = require('./reports-plugin.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-type.js b/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-type.js
index f8f6b020347..e06f5fb3fa5 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-type.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/reports/directives/reports-type.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./reports-type.html')();
+var template = require('./reports-type.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/config/routes.js b/webapps/frontend/ui/cockpit/client/scripts/repository/config/routes.js
index 6f10288c94b..3e94dc38100 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/config/routes.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/config/routes.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./../controllers/cam-cockpit-repository-view.html')();
+var template = require('./../controllers/cam-cockpit-repository-view.html?raw');
 
 module.exports = [
   '$routeProvider',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployment.js b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployment.js
index 9a3119b433d..4bccb469b5d 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployment.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployment.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-deployment.html')();
+var template = require('./cam-cockpit-deployment.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments-sorting-choices.js b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments-sorting-choices.js
index da8b2129ad3..e0ed94f2881 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments-sorting-choices.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments-sorting-choices.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-deployments-sorting-choices.html')();
+var template = require('./cam-cockpit-deployments-sorting-choices.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments.js b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments.js
index 18fc00077e6..5617d7d9dc0 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/directives/cam-cockpit-deployments.js
@@ -19,7 +19,7 @@
 
 var lodash = require('camunda-commons-ui/vendor/lodash');
 
-var template = require('./cam-cockpit-deployments.html')();
+var template = require('./cam-cockpit-deployments.html?raw');
 var searchConfigJSON = require('./cam-cockpit-deployments-search-plugin-config.json');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/plugins/actions/delete/cam-cockpit-delete-deployment-plugin.js b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/plugins/actions/delete/cam-cockpit-delete-deployment-plugin.js
index 4d6ca133b05..a52f1d6e604 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/plugins/actions/delete/cam-cockpit-delete-deployment-plugin.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/deployments/plugins/actions/delete/cam-cockpit-delete-deployment-plugin.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-delete-deployment-plugin.html')();
-var modalTemplate = require('./modals/cam-cockpit-delete-deployment-modal.html')();
+var template = require('./cam-cockpit-delete-deployment-plugin.html?raw');
+var modalTemplate = require('./modals/cam-cockpit-delete-deployment-modal.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-form.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-form.js
index 1677460d7e1..d168baf1bae 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-form.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-form.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-form.html')();
+var template = require('./cam-cockpit-form.html?raw');
 
 const Form = require('@bpmn-io/form-js').Form;
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-html-source.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-html-source.js
index 0467e0ec7bb..f4de1b3ebe3 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-html-source.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-html-source.js
@@ -19,7 +19,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-html-source.html')();
+var template = require('./cam-cockpit-html-source.html?raw');
 
 module.exports = [
   '$sce',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-content.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-content.js
index 85ecab9865f..0684caa729d 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-content.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-content.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-resource-content.html')();
+var template = require('./cam-cockpit-resource-content.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-meta.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-meta.js
index 4576b6028f1..4615c74d4d4 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-meta.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-meta.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-resource-meta.html')();
+var template = require('./cam-cockpit-resource-meta.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-wrapper.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-wrapper.js
index 074ce814bb8..2baf4681d0a 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-wrapper.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-resource-wrapper.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-resource-wrapper.html')();
+var template = require('./cam-cockpit-resource-wrapper.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-source.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-source.js
index 7cde73d614b..713eef6f663 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-source.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/directives/cam-cockpit-source.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-source.html')();
+var template = require('./cam-cockpit-source.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 require('camunda-commons-ui/vendor/prism');
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/actions/download/cam-cockpit-resource-action-download-plugin.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/actions/download/cam-cockpit-resource-action-download-plugin.js
index e80ad8383dc..2f31cca60bf 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/actions/download/cam-cockpit-resource-action-download-plugin.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/actions/download/cam-cockpit-resource-action-download-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-resource-action-download-plugin.html')();
+var template = require('./cam-cockpit-resource-action-download-plugin.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/details/definitions/cam-cockpit-definitions-plugin.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/details/definitions/cam-cockpit-definitions-plugin.js
index 1b283adff30..0c5860eb876 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/details/definitions/cam-cockpit-definitions-plugin.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resource/plugins/details/definitions/cam-cockpit-definitions-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-definitions-plugin.html')();
+var template = require('./cam-cockpit-definitions-plugin.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/client/scripts/repository/resources/directives/cam-cockpit-resources.js b/webapps/frontend/ui/cockpit/client/scripts/repository/resources/directives/cam-cockpit-resources.js
index 793b8fe4052..c21316dad5c 100644
--- a/webapps/frontend/ui/cockpit/client/scripts/repository/resources/directives/cam-cockpit-resources.js
+++ b/webapps/frontend/ui/cockpit/client/scripts/repository/resources/directives/cam-cockpit-resources.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-cockpit-resources.html')();
+var template = require('./cam-cockpit-resources.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/common/diagramPlugins/instanceCount.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/common/diagramPlugins/instanceCount.js
index b0769aa470b..015a237b0fc 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/common/diagramPlugins/instanceCount.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/common/diagramPlugins/instanceCount.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./instanceCount.html')();
+var template = require('./instanceCount.html?raw');
 
 module.exports = function(
   $scope,
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/calledProcessDefinitionTable.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/calledProcessDefinitionTable.js
index 0db20e19d1e..cc3b0acfec5 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/calledProcessDefinitionTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/calledProcessDefinitionTable.js
@@ -20,7 +20,7 @@
 var angular = require('angular');
 var searchWidgetUtils = require('../../../../../../common/scripts/util/search-widget-utils');
 
-var template = require('./called-process-definition-table.html')();
+var template = require('./called-process-definition-table.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/diagramPlugins/instanceCount.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/diagramPlugins/instanceCount.js
index 03732e97718..5d4ce7bbd7e 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/diagramPlugins/instanceCount.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/diagramPlugins/instanceCount.js
@@ -19,7 +19,7 @@
 
 var instanceCount = require('../../common/diagramPlugins/instanceCount');
 
-var template = require('./overlayAction.html')();
+var template = require('./overlayAction.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/pdIncidentsTab.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/pdIncidentsTab.js
index 2f7a6001e0b..a00f1259405 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/pdIncidentsTab.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/pdIncidentsTab.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./pd-incidents-tab.html')();
+var template = require('./pd-incidents-tab.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.processDefinition.runtime.tab', {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/processInstanceTable.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/processInstanceTable.js
index a484137330c..8ae33b00a65 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/processInstanceTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/processInstanceTable.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./process-instance-table.html')();
+var template = require('./process-instance-table.html?raw');
 var searchConfig = require('./process-instance-search-config.json');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/updateSuspensionStateAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/updateSuspensionStateAction.js
index 8dc961eb03e..3148225be52 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/updateSuspensionStateAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processDefinition/updateSuspensionStateAction.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var actionTemplate = require('./update-suspension-state-action.html')();
-var dialogTemplate = require('./update-suspension-state-dialog.html')();
+var actionTemplate = require('./update-suspension-state-action.html?raw');
+var dialogTemplate = require('./update-suspension-state-dialog.html?raw');
 var angular = require('angular');
 
 module.exports = [
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/addVariableAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/addVariableAction.js
index e2197b4bd51..82e07129508 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/addVariableAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/addVariableAction.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var actionTemplate = require('./add-variable-action.html')();
+var actionTemplate = require('./add-variable-action.html?raw');
 var addTemplate = require('../../../../../client/scripts/components/variables/variable-add-dialog');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/calledProcessInstanceTable.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/calledProcessInstanceTable.js
index 2728378fc24..4222a70ec82 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/calledProcessInstanceTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/calledProcessInstanceTable.js
@@ -20,7 +20,7 @@
 var searchWidgetUtils = require('../../../../../../common/scripts/util/search-widget-utils');
 var angular = require('angular');
 
-var template = require('./called-process-instance-table.html')();
+var template = require('./called-process-instance-table.html?raw');
 
 module.exports = function(ngModule) {
   ngModule.controller('CalledProcessInstanceController', [
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/cancelProcessInstanceAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/cancelProcessInstanceAction.js
index 7fa9ae0c7af..8a2cb8b4a4e 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/cancelProcessInstanceAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/cancelProcessInstanceAction.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var dialogTemplate = require('./cancel-process-instance-dialog.html')();
-var actionTemplate = require('./cancel-process-instance-action.html')();
+var dialogTemplate = require('./cancel-process-instance-dialog.html?raw');
+var actionTemplate = require('./cancel-process-instance-action.html?raw');
 
 module.exports = function(ngModule) {
   ngModule.controller('CancelProcessInstanceActionController', [
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incident-externalTask-retry-action.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incident-externalTask-retry-action.js
index dc9637558f8..8693e57ca06 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incident-externalTask-retry-action.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incident-externalTask-retry-action.js
@@ -18,8 +18,8 @@
 'use strict';
 
 var angular = require('angular');
-var actionTemplate = require('./incident-external-task-action.html')();
-var dialogTemplate = require('./job-retry-dialog.html')();
+var actionTemplate = require('./incident-external-task-action.html?raw');
+var dialogTemplate = require('./job-retry-dialog.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.incident.action', {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentJobRetryAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentJobRetryAction.js
index dec8d7a8007..b2bfa57e09a 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentJobRetryAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentJobRetryAction.js
@@ -18,8 +18,8 @@
 'use strict';
 
 var angular = require('angular');
-var actionTemplate = require('./incident-job-retry-action.html')();
-var dialogTemplate = require('./job-retry-dialog.html')();
+var actionTemplate = require('./incident-job-retry-action.html?raw');
+var dialogTemplate = require('./job-retry-dialog.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.incident.action', {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentsTab.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentsTab.js
index 6bb5baef457..0f9a9cb7561 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentsTab.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/incidentsTab.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var incidentsTemplate = require('./incidents-tab.html')();
+var incidentsTemplate = require('./incidents-tab.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.processInstance.runtime.tab', {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobRetryBulkAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobRetryBulkAction.js
index 9d5d8f7b20f..23d2fc859ef 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobRetryBulkAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobRetryBulkAction.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var dialogTemplate = require('./job-retry-bulk-dialog.html')();
-var actionTemplate = require('./job-retry-bulk-action.html')();
+var dialogTemplate = require('./job-retry-bulk-dialog.html?raw');
+var actionTemplate = require('./job-retry-bulk-action.html?raw');
 
 module.exports = function(ngModule, pluginPoint) {
   ngModule.controller('JobRetryActionController', [
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobsTab.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobsTab.js
index c43ee7d10cf..23b244d20fc 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobsTab.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/jobsTab.js
@@ -20,8 +20,8 @@
 var angular = require('angular');
 var moment = require('camunda-commons-ui/vendor/moment');
 
-var jobsTemplate = require('./jobs-tab.html')();
-var jobRescheduleTemplate = require('./jobs-reschedule-modal.html')();
+var jobsTemplate = require('./jobs-tab.html?raw');
+var jobRescheduleTemplate = require('./jobs-reschedule-modal.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.processInstance.runtime.tab', {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/updateSuspensionStateAction.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/updateSuspensionStateAction.js
index 26158fa3dca..a2de84a4fd6 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/updateSuspensionStateAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/updateSuspensionStateAction.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var actionTemplate = require('./update-suspension-state-action.html')();
-var dialogTemplate = require('./update-suspension-state-dialog.html')();
+var actionTemplate = require('./update-suspension-state-action.html?raw');
+var dialogTemplate = require('./update-suspension-state-dialog.html?raw');
 var angular = require('angular');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/userTasksTable.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/userTasksTable.js
index 820d8782ad1..cc92f02e75c 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/userTasksTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/userTasksTable.js
@@ -20,8 +20,8 @@
 var searchWidgetUtils = require('../../../../../../common/scripts/util/search-widget-utils');
 var angular = require('angular');
 
-var identityLinksTemplate = require('./identity-links-modal.html')();
-var userTasksTemplate = require('./user-tasks-table.html')();
+var identityLinksTemplate = require('./identity-links-modal.html?raw');
+var userTasksTemplate = require('./user-tasks-table.html?raw');
 
 module.exports = function(ngModule) {
   /**
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/variableInstancesTab.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/variableInstancesTab.js
index 197a3037741..c8bb889ae5f 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/variableInstancesTab.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processInstance/variableInstancesTab.js
@@ -22,7 +22,7 @@ var angular = require('angular');
 var searchWidgetUtils = require('../../../../../../common/scripts/util/search-widget-utils');
 var variableInstancesTabSearchConfig = require('./variable-instances-tab-search-config.json');
 
-var instancesTemplate = require('./variable-instances-tab.html')();
+var instancesTemplate = require('./variable-instances-tab.html?raw');
 var inspectTemplate = require('../../../../../client/scripts/components/variables/variable-inspect-dialog');
 var uploadTemplate = require('../../../../../client/scripts/components/variables/variable-upload-dialog');
 
diff --git a/webapps/frontend/ui/cockpit/plugins/base/app/views/processesDashboard/process-definitions.js b/webapps/frontend/ui/cockpit/plugins/base/app/views/processesDashboard/process-definitions.js
index 8bbf7720cf6..e6abe213d68 100644
--- a/webapps/frontend/ui/cockpit/plugins/base/app/views/processesDashboard/process-definitions.js
+++ b/webapps/frontend/ui/cockpit/plugins/base/app/views/processesDashboard/process-definitions.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./process-definitions.html')();
+var template = require('./process-definitions.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/components/decisions-table.js b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/components/decisions-table.js
index 423e264e8b0..dfa62ab8526 100644
--- a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/components/decisions-table.js
+++ b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/components/decisions-table.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decisions-table.html')();
+var template = require('./decisions-table.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/views/decision-list.js b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/views/decision-list.js
index 721456f90df..1769b98959c 100644
--- a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/views/decision-list.js
+++ b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/dashboard/views/decision-list.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./decision-list.html')();
+var template = require('./decision-list.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionDefinition/decisionInstanceTable.js b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionDefinition/decisionInstanceTable.js
index 9f7af25a0c7..ff71403b54d 100644
--- a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionDefinition/decisionInstanceTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionDefinition/decisionInstanceTable.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./decision-instance-table.html')();
+var template = require('./decision-instance-table.html?raw');
 var decisionSearchConfig = require('./decision-instance-search-config.json');
 
 var debouncePromiseFactory = require('camunda-bpm-sdk-js').utils
diff --git a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/inputTable.js b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/inputTable.js
index 216de8bcd3a..7f63ab3ab61 100644
--- a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/inputTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/inputTable.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./input-variable-table.html')();
+var template = require('./input-variable-table.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/outputTable.js b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/outputTable.js
index d916dace939..59c8d7c7ed2 100644
--- a/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/outputTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/decisionList/app/views/decisionInstance/outputTable.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./output-variable-table.html')();
+var template = require('./output-variable-table.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/external-tasks-process-instance-runtime-tab/view-provider.config.js b/webapps/frontend/ui/cockpit/plugins/external-tasks-process-instance-runtime-tab/view-provider.config.js
index da98794d2cc..3dc94d1b110 100644
--- a/webapps/frontend/ui/cockpit/plugins/external-tasks-process-instance-runtime-tab/view-provider.config.js
+++ b/webapps/frontend/ui/cockpit/plugins/external-tasks-process-instance-runtime-tab/view-provider.config.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./process-instance-runtime-external-tasks.html')();
+var template = require('./process-instance-runtime-external-tasks.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/bulk-override-job-priority/bulk-override-job-priority-action.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/bulk-override-job-priority/bulk-override-job-priority-action.js
index 976761db017..2eb931c8a52 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/bulk-override-job-priority/bulk-override-job-priority-action.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/bulk-override-job-priority/bulk-override-job-priority-action.js
@@ -18,8 +18,8 @@
 'use strict';
 
 var angular = require('angular');
-var actionTemplate = require('./bulk-override-job-priority-action.html')();
-var dialogTemplate = require('./bulk-override-job-priority-dialog.html')();
+var actionTemplate = require('./bulk-override-job-priority-action.html?raw');
+var dialogTemplate = require('./bulk-override-job-priority-dialog.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView(
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/override-job-priority/override-job-priority-action.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/override-job-priority/override-job-priority-action.js
index 0d1c063b8fa..0bf1e494b92 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/override-job-priority/override-job-priority-action.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/actions/override-job-priority/override-job-priority-action.js
@@ -18,8 +18,8 @@
 'use strict';
 
 var angular = require('angular');
-var actionTemplate = require('./override-job-priority-action.html')();
-var dialogTemplate = require('./override-job-priority-dialog.html')();
+var actionTemplate = require('./override-job-priority-action.html?raw');
+var dialogTemplate = require('./override-job-priority-dialog.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.jobDefinition.action', {
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/diagramPlugins/jobSuspension.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/diagramPlugins/jobSuspension.js
index bcd934019ba..ed70d283664 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/diagramPlugins/jobSuspension.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/diagramPlugins/jobSuspension.js
@@ -19,7 +19,7 @@
 
 var angular = require('angular');
 
-var template = require('./jobSuspension.html')();
+var template = require('./jobSuspension.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionSuspensionOverlay.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionSuspensionOverlay.js
index 666cc3c5914..eed0d2b455d 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionSuspensionOverlay.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionSuspensionOverlay.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./job-definition-suspension-overlay.html')();
+var template = require('./job-definition-suspension-overlay.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionTable.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionTable.js
index 0c1a08b235e..d9c45b68b39 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionTable.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/jobDefinitionTable.js
@@ -20,7 +20,7 @@
 var angular = require('angular');
 var searchWidgetUtils = require('../../../../../../common/scripts/util/search-widget-utils');
 
-var template = require('./job-definition-table.html')();
+var template = require('./job-definition-table.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/suspensionStateAction.js b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/suspensionStateAction.js
index b52efe4816f..1f9684c0231 100644
--- a/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/suspensionStateAction.js
+++ b/webapps/frontend/ui/cockpit/plugins/jobDefinition/app/views/processDefinition/suspensionStateAction.js
@@ -18,8 +18,8 @@
 'use strict';
 
 var angular = require('angular');
-var actionTemplate = require('./suspension-state-action.html')();
-var dialogTemplate = require('./job-definition-suspension-state-dialog.html')();
+var actionTemplate = require('./suspension-state-action.html?raw');
+var dialogTemplate = require('./job-definition-suspension-state-dialog.html?raw');
 
 var Configuration = function PluginConfiguration(ViewsProvider) {
   ViewsProvider.registerDefaultView('cockpit.jobDefinition.action', {
diff --git a/webapps/frontend/ui/cockpit/plugins/tasks/app/views/dashboard/task-dashboard.js b/webapps/frontend/ui/cockpit/plugins/tasks/app/views/dashboard/task-dashboard.js
index 3fe79224588..7651fb4c7cf 100644
--- a/webapps/frontend/ui/cockpit/plugins/tasks/app/views/dashboard/task-dashboard.js
+++ b/webapps/frontend/ui/cockpit/plugins/tasks/app/views/dashboard/task-dashboard.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./task-dashboard.html')();
+var template = require('./task-dashboard.html?raw');
 
 module.exports = [
   'ViewsProvider',
diff --git a/webapps/frontend/ui/common/scripts/directives/breadcrumbs.js b/webapps/frontend/ui/common/scripts/directives/breadcrumbs.js
index 76ebee496d2..9d135e12c9b 100644
--- a/webapps/frontend/ui/common/scripts/directives/breadcrumbs.js
+++ b/webapps/frontend/ui/common/scripts/directives/breadcrumbs.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./breadcrumbs.html')();
+var template = require('./breadcrumbs.html?raw');
 
 module.exports = [
   '$location',
diff --git a/webapps/frontend/ui/common/scripts/module/components/cam-pagination.js b/webapps/frontend/ui/common/scripts/module/components/cam-pagination.js
index 09d61c26613..50cd1403817 100644
--- a/webapps/frontend/ui/common/scripts/module/components/cam-pagination.js
+++ b/webapps/frontend/ui/common/scripts/module/components/cam-pagination.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-pagination.html')();
+var template = require('./cam-pagination.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/components/cam-searchable-area.js b/webapps/frontend/ui/common/scripts/module/components/cam-searchable-area.js
index a8b02a41950..59b9e801211 100644
--- a/webapps/frontend/ui/common/scripts/module/components/cam-searchable-area.js
+++ b/webapps/frontend/ui/common/scripts/module/components/cam-searchable-area.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-searchable-area.html')();
+var template = require('./cam-searchable-area.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/components/cam-tabs.js b/webapps/frontend/ui/common/scripts/module/components/cam-tabs.js
index 5d1dc65b5c3..4c79a2b0d93 100644
--- a/webapps/frontend/ui/common/scripts/module/components/cam-tabs.js
+++ b/webapps/frontend/ui/common/scripts/module/components/cam-tabs.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tabs.html')();
+var template = require('./cam-tabs.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/components/cam-toolbar.js b/webapps/frontend/ui/common/scripts/module/components/cam-toolbar.js
index 22c30e59907..de8751457e6 100644
--- a/webapps/frontend/ui/common/scripts/module/components/cam-toolbar.js
+++ b/webapps/frontend/ui/common/scripts/module/components/cam-toolbar.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-toolbar.html')();
+var template = require('./cam-toolbar.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/directives/cam-sortable-table-column.js b/webapps/frontend/ui/common/scripts/module/directives/cam-sortable-table-column.js
index 923cd4c8b96..47a7299fcba 100644
--- a/webapps/frontend/ui/common/scripts/module/directives/cam-sortable-table-column.js
+++ b/webapps/frontend/ui/common/scripts/module/directives/cam-sortable-table-column.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-sortable-table-column.html')();
+var template = require('./cam-sortable-table-column.html?raw');
 
 var Directive = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-activity-link.js b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-activity-link.js
index d5430232a81..bfb9484b117 100644
--- a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-activity-link.js
+++ b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-activity-link.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./external-task-activity-link.html')();
+var template = require('./external-task-activity-link.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-error-message-link.js b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-error-message-link.js
index 2b600c7d713..ec5811c97db 100644
--- a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-error-message-link.js
+++ b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-task-error-message-link.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./external-task-error-message-link.html')();
+var template = require('./external-task-error-message-link.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-tasks-tab.js b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-tasks-tab.js
index f543c50bef7..c9fbcd5cb28 100644
--- a/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-tasks-tab.js
+++ b/webapps/frontend/ui/common/scripts/module/external-tasks-common/components/external-tasks-tab.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./external-tasks-tab.html')();
+var template = require('./external-tasks-tab.html?raw');
 
 module.exports = function() {
   return {
diff --git a/webapps/frontend/ui/common/scripts/services/plugins/loadPlugins.js b/webapps/frontend/ui/common/scripts/services/plugins/loadPlugins.js
index a5bd02565d5..b3786bfa8ce 100644
--- a/webapps/frontend/ui/common/scripts/services/plugins/loadPlugins.js
+++ b/webapps/frontend/ui/common/scripts/services/plugins/loadPlugins.js
@@ -45,7 +45,7 @@ module.exports = async function loadPlugins(config, appName) {
       !camundaPlugins.includes(el.name) &&
       !el.name.startsWith(`${appName}-plugin-legacy`)
   ).map(el => {
-    addCssSource(`${el.location}/plugin.css?bust=$CACHE_BUST`);
+    addCssSource(`${el.location}/plugin.css?bust=${CAMUNDA_VERSION}`); // eslint-disable-line
     return `${el.location}/${el.main}`;
   });
 
diff --git a/webapps/frontend/ui/tasklist/client/index.html b/webapps/frontend/ui/tasklist/client/index.html
index e2ca30bb38f..ebe6a96cdef 100644
--- a/webapps/frontend/ui/tasklist/client/index.html
+++ b/webapps/frontend/ui/tasklist/client/index.html
@@ -16,18 +16,18 @@
         content="Camunda services GmbH"/>
 
   <!--< base href="/" /> -->
-  <base href="$BASE"
-        admin-api="$APP_ROOT/api/admin/"
-        cockpit-api="$APP_ROOT/api/cockpit/"
-        tasklist-api="$APP_ROOT/api/tasklist/"
-        welcome-api="$APP_ROOT/api/welcome/"
-        engine-api="$APP_ROOT/api/engine/"
-        app-root="$APP_ROOT"
+  <base href="<%= htmlWebpackPlugin.options.base %>"
+        admin-api="<%= htmlWebpackPlugin.options.appRoot %>/api/admin/"
+        cockpit-api="<%= htmlWebpackPlugin.options.appRoot %>/api/cockpit/"
+        tasklist-api="<%= htmlWebpackPlugin.options.appRoot %>/api/tasklist/"
+        welcome-api="<%= htmlWebpackPlugin.options.appRoot %>/api/welcome/"
+        engine-api="<%= htmlWebpackPlugin.options.appRoot %>/api/engine/"
+        app-root="<%= htmlWebpackPlugin.options.appRoot %>"
         app-name="tasklist"/>
 
   <link rel="stylesheet"
         type="text/css"
-        href="${'$APP_ROOT/app/tasklist/styles/user-styles.css?bust=$CACHE_BUST'}">
+        href="<%= htmlWebpackPlugin.options.appRoot %>/app/tasklist/styles/user-styles.css?bust=<%= htmlWebpackPlugin.options.version %>">
         <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
 
 <body ng-controller="camTasklistAppCtrl">
@@ -71,20 +71,20 @@
 
 <!-- # page-footer -->
 <footer cam-widget-footer
-        version="v$VERSION"></footer>
+        version="v<%= htmlWebpackPlugin.options.version %>"></footer>
 
 
 <script type="text/javascript" $CSP_NONCE>
   window.tasklistConf = {
-    apiUri: '$APP_ROOT/api/engine',
+    apiUri: '<%= htmlWebpackPlugin.options.appRoot %>/api/engine',
     mock: false,
 
     // overrides the settings above
     resources: {}
   };
 
-  window.PLUGIN_DEPENDENCIES = $PLUGIN_DEPENDENCIES || [];
-  window.PLUGIN_PACKAGES = $PLUGIN_PACKAGES || [];
+  window.PLUGIN_DEPENDENCIES = <%= htmlWebpackPlugin.options.pluginDeps %> || [];
+  window.PLUGIN_PACKAGES = <%= htmlWebpackPlugin.options.pluginPackages %> || [];
 
   window.require = {
     waitSeconds: 0
diff --git a/webapps/frontend/ui/tasklist/client/scripts/camunda-tasklist-bootstrap.js b/webapps/frontend/ui/tasklist/client/scripts/camunda-tasklist-bootstrap.js
index 3a0230d1625..00d87bd2577 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/camunda-tasklist-bootstrap.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/camunda-tasklist-bootstrap.js
@@ -27,7 +27,7 @@ import {
 
 window.define = define;
 window.require = rjsrequire;
-window.bust = '$CACHE_BUST';
+window.bust = CAMUNDA_VERSION; // eslint-disable-line
 
 //  camunda-tasklist-bootstrap is copied as-is, so we have to inline everything
 const appRoot = document.querySelector('base').getAttribute('app-root');
@@ -35,7 +35,7 @@ const baseImportPath = `${appRoot}/app/tasklist/`;
 
 requirejs.config({
   baseUrl: baseImportPath,
-  urlArgs: 'bust=$CACHE_BUST'
+  urlArgs: `bust=${CAMUNDA_VERSION}` // eslint-disable-line
 });
 
 const loadConfig = (async function() {
@@ -90,7 +90,7 @@ define('camunda-tasklist-bootstrap', function() {
         node.setAttribute('rel', 'stylesheet');
         node.setAttribute(
           'href',
-          plugin.location + '/plugin.css?bust=$CACHE_BUST'
+          plugin.location + `/plugin.css?bust=${CAMUNDA_VERSION}` // eslint-disable-line
         );
         document.head.appendChild(node);
       });
diff --git a/webapps/frontend/ui/tasklist/client/scripts/config/routes.js b/webapps/frontend/ui/tasklist/client/scripts/config/routes.js
index 98b08efb4fc..d579b392722 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/config/routes.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/config/routes.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var tasklistTemplate = require('./../index.html')();
+var tasklistTemplate = require('./../index.html?raw');
 
 module.exports = [
   '$routeProvider',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/controllers/cam-tasklist-filters-ctrl.js b/webapps/frontend/ui/tasklist/client/scripts/filter/controllers/cam-tasklist-filters-ctrl.js
index 3a57eeab5a4..cc6ab537c4c 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/controllers/cam-tasklist-filters-ctrl.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/controllers/cam-tasklist-filters-ctrl.js
@@ -18,7 +18,7 @@
 'use strict';
 var $ = require('jquery');
 
-var template = require('./../modals/cam-tasklist-filter-modal.html')();
+var template = require('./../modals/cam-tasklist-filter-modal.html?raw');
 
 module.exports = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-criteria.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-criteria.js
index ef08eed9461..490d261056d 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-criteria.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-criteria.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filter-modal-form-criteria.html')();
+var template = require('./cam-tasklist-filter-modal-form-criteria.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var criteria = require('./cam-tasklist-filter-modal-criteria');
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-general.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-general.js
index 27faa05f66b..9c1df9ed57d 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-general.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-general.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filter-modal-form-general.html')();
+var template = require('./cam-tasklist-filter-modal-form-general.html?raw');
 
 module.exports = [
   function() {
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-permission.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-permission.js
index c4691eeb395..d2e214476bc 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-permission.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-permission.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filter-modal-form-permission.html')();
+var template = require('./cam-tasklist-filter-modal-form-permission.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-variable.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-variable.js
index d515fc44994..0b0ca75f036 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-variable.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form-variable.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filter-modal-form-variable.html')();
+var template = require('./cam-tasklist-filter-modal-form-variable.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form.js
index 544fb9466f4..cb2deda1110 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filter-modal-form.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filter-modal-form.html')();
+var template = require('./cam-tasklist-filter-modal-form.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filters.js b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filters.js
index d44674df1e3..f70681fa971 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filters.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/filter/directives/cam-tasklist-filters.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-filters.html')();
+var template = require('./cam-tasklist-filters.html?raw');
 
 var noop = function() {};
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-embedded.js b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-embedded.js
index fc961ec71e7..7062a7e0664 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-embedded.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-embedded.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-form-embedded.html')();
+var template = require('./cam-tasklist-form-embedded.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var $ = require('jquery');
diff --git a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-external.js b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-external.js
index b797bc104c6..327fa516612 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-external.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-external.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-form-external.html')();
+var template = require('./cam-tasklist-form-external.html?raw');
 
 module.exports = [
   '$location',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic-variables.js b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic-variables.js
index ce93cf87da4..9b31fc26163 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic-variables.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic-variables.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-form-generic-variables.html')();
+var template = require('./cam-tasklist-form-generic-variables.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic.js b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic.js
index 89dbbeda39b..40f552c3c49 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form-generic.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-form-generic.html')();
+var template = require('./cam-tasklist-form-generic.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var $ = require('jquery');
diff --git a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form.js b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form.js
index b5668c80bb5..c15e148efe6 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/form/directives/cam-tasklist-form.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-form.html')();
+var template = require('./cam-tasklist-form.html?raw');
 
 var EMBEDDED_KEY = 'embedded:',
   APP_KEY = 'app:',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/process/plugins/action/cam-tasklist-navbar-action-start-process-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/process/plugins/action/cam-tasklist-navbar-action-start-process-plugin.js
index 9b6060e5be1..8d3a52621cd 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/process/plugins/action/cam-tasklist-navbar-action-start-process-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/process/plugins/action/cam-tasklist-navbar-action-start-process-plugin.js
@@ -19,8 +19,8 @@
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
-var startProcessActionTemplate = require('./cam-tasklist-navbar-action-start-process-plugin.html')();
-var template = require('./modals/cam-tasklist-process-start-modal.html')();
+var startProcessActionTemplate = require('./cam-tasklist-navbar-action-start-process-plugin.html?raw');
+var template = require('./modals/cam-tasklist-process-start-modal.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/shortcuts/plugins/action/cam-tasklist-shortcut-help-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/shortcuts/plugins/action/cam-tasklist-shortcut-help-plugin.js
index 4c947b4a536..b11b37413fd 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/shortcuts/plugins/action/cam-tasklist-shortcut-help-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/shortcuts/plugins/action/cam-tasklist-shortcut-help-plugin.js
@@ -18,8 +18,8 @@
 'use strict';
 require('mousetrap');
 
-var helpLinkTemplate = require('./cam-tasklist-shortcut-help-plugin.html')();
-var showHelpTemplate = require('./modals/cam-tasklist-shortcut-help.html')();
+var helpLinkTemplate = require('./cam-tasklist-shortcut-help-plugin.html?raw');
+var showHelpTemplate = require('./modals/cam-tasklist-shortcut-help.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task-meta.js b/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task-meta.js
index 18b92c26617..d3507844f55 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task-meta.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task-meta.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task-meta.html')();
-var editGroupsFormTemplate = require('./../modals/cam-tasklist-groups-modal.html')();
+var template = require('./cam-tasklist-task-meta.html?raw');
+var editGroupsFormTemplate = require('./../modals/cam-tasklist-groups-modal.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task.js b/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task.js
index 2cfc9624c2f..e728bb44844 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/directives/cam-tasklist-task.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task.html')();
+var template = require('./cam-tasklist-task.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/action/cam-tasklist-task-action-comment-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/action/cam-tasklist-task-action-comment-plugin.js
index 320285fae93..fa858260224 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/action/cam-tasklist-task-action-comment-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/action/cam-tasklist-task-action-comment-plugin.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var addCommentTemplate = require('./cam-tasklist-task-action-comment-plugin.html')();
-var addCommentFormTemplate = require('./modals/cam-tasklist-comment-form.html')();
+var addCommentTemplate = require('./cam-tasklist-task-action-comment-plugin.html?raw');
+var addCommentFormTemplate = require('./modals/cam-tasklist-comment-form.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-description-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-description-plugin.js
index 89a6d6c73ee..fa847795418 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-description-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-description-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task-detail-description-plugin.html')();
+var template = require('./cam-tasklist-task-detail-description-plugin.html?raw');
 
 var Controller = ['$scope', function() {}];
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-diagram-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-diagram-plugin.js
index 3bff65cbd24..063a7c08371 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-diagram-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-diagram-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task-detail-diagram-plugin.html')();
+var template = require('./cam-tasklist-task-detail-diagram-plugin.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-form-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-form-plugin.js
index 5575fb3c575..cfbf27aa377 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-form-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-form-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task-detail-form-plugin.html')();
+var template = require('./cam-tasklist-task-detail-form-plugin.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-history-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-history-plugin.js
index 4b65ba38b1f..326b611cbe9 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-history-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/task/plugins/detail/cam-tasklist-task-detail-history-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-task-detail-history-plugin.html')();
+var template = require('./cam-tasklist-task-detail-history-plugin.html?raw');
 
 var jquery = require('jquery');
 var moment = require('camunda-commons-ui/vendor/moment');
diff --git a/webapps/frontend/ui/tasklist/client/scripts/tasklist/directives/cam-tasklist-tasks.js b/webapps/frontend/ui/tasklist/client/scripts/tasklist/directives/cam-tasklist-tasks.js
index 8b399eef17d..245a80235d8 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/tasklist/directives/cam-tasklist-tasks.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/tasklist/directives/cam-tasklist-tasks.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-tasks.html')();
+var template = require('./cam-tasklist-tasks.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var $ = require('jquery');
diff --git a/webapps/frontend/ui/tasklist/client/scripts/tasklist/plugins/cam-tasklist-search-plugin.js b/webapps/frontend/ui/tasklist/client/scripts/tasklist/plugins/cam-tasklist-search-plugin.js
index d65878548b0..72a9fe4ec7a 100644
--- a/webapps/frontend/ui/tasklist/client/scripts/tasklist/plugins/cam-tasklist-search-plugin.js
+++ b/webapps/frontend/ui/tasklist/client/scripts/tasklist/plugins/cam-tasklist-search-plugin.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-search-plugin.html')();
+var template = require('./cam-tasklist-search-plugin.html?raw');
 var searchConfigJSON = require('./cam-tasklist-search-plugin-config.json');
 
 var angular = require('camunda-commons-ui/vendor/angular');
diff --git a/webapps/frontend/ui/tasklist/plugins/standaloneTask/app/navbar/action/cam-tasklist-navbar-action-create-task-plugin.js b/webapps/frontend/ui/tasklist/plugins/standaloneTask/app/navbar/action/cam-tasklist-navbar-action-create-task-plugin.js
index ea2eabbfbfc..4b3dc998b1d 100644
--- a/webapps/frontend/ui/tasklist/plugins/standaloneTask/app/navbar/action/cam-tasklist-navbar-action-create-task-plugin.js
+++ b/webapps/frontend/ui/tasklist/plugins/standaloneTask/app/navbar/action/cam-tasklist-navbar-action-create-task-plugin.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var createTaskActionTemplate = require('./cam-tasklist-navbar-action-create-task-plugin.html')();
-var createTaskModalTemplate = require('./modals/cam-tasklist-create-task-modal.html')();
+var createTaskActionTemplate = require('./cam-tasklist-navbar-action-create-task-plugin.html?raw');
+var createTaskModalTemplate = require('./modals/cam-tasklist-create-task-modal.html?raw');
 
 var Controller = [
   '$scope',
diff --git a/webapps/frontend/ui/tasklist/plugins/tasklistCard/app/variables/directives/cam-tasklist-variables.js b/webapps/frontend/ui/tasklist/plugins/tasklistCard/app/variables/directives/cam-tasklist-variables.js
index 5d0dbda14dd..a965b7e908a 100644
--- a/webapps/frontend/ui/tasklist/plugins/tasklistCard/app/variables/directives/cam-tasklist-variables.js
+++ b/webapps/frontend/ui/tasklist/plugins/tasklistCard/app/variables/directives/cam-tasklist-variables.js
@@ -17,8 +17,8 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-variables.html')();
-var modalTemplate = require('./../modals/cam-tasklist-variables-detail-modal.html')();
+var template = require('./cam-tasklist-variables.html?raw');
+var modalTemplate = require('./../modals/cam-tasklist-variables-detail-modal.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 
diff --git a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-choices.js b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-choices.js
index 167c5f10b47..0e3168d748d 100644
--- a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-choices.js
+++ b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-choices.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-sorting-choices.html')();
+var template = require('./cam-tasklist-sorting-choices.html?raw');
 
 var angular = require('camunda-commons-ui/vendor/angular');
 var $ = require('jquery');
diff --git a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-dropdown.js b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-dropdown.js
index 8086f2a63ea..4ec4b652065 100644
--- a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-dropdown.js
+++ b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-dropdown.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-sorting-dropdown.html')();
+var template = require('./cam-tasklist-sorting-dropdown.html?raw');
 
 module.exports = [
   '$translate',
diff --git a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-inputs.js b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-inputs.js
index ab0cf64c46b..a3df1a3308f 100644
--- a/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-inputs.js
+++ b/webapps/frontend/ui/tasklist/plugins/tasklistSorting/app/tasklistHeader/cam-tasklist-sorting-inputs.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./cam-tasklist-sorting-inputs.html')();
+var template = require('./cam-tasklist-sorting-inputs.html?raw');
 
 module.exports = [
   '$translate',
diff --git a/webapps/frontend/ui/welcome/client/scripts/camunda-welcome-bootstrap.js b/webapps/frontend/ui/welcome/client/scripts/camunda-welcome-bootstrap.js
index d821fea69ed..7f503061406 100644
--- a/webapps/frontend/ui/welcome/client/scripts/camunda-welcome-bootstrap.js
+++ b/webapps/frontend/ui/welcome/client/scripts/camunda-welcome-bootstrap.js
@@ -27,7 +27,7 @@ import {
 
 window.define = define;
 window.require = rjsrequire;
-window.bust = '$CACHE_BUST';
+window.bust = CAMUNDA_VERSION; // eslint-disable-line
 
 // camunda-welcome-bootstrap is copied as-is, so we have to inline everything
 const appRoot = document.querySelector('base').getAttribute('app-root');
@@ -35,7 +35,7 @@ const baseImportPath = `${appRoot}/app/welcome/`;
 
 requirejs.config({
   baseUrl: baseImportPath,
-  urlArgs: 'bust=$CACHE_BUST'
+  urlArgs: `bust=${CAMUNDA_VERSION}` // eslint-disable-line
 });
 
 const loadConfig = (async function() {
@@ -80,7 +80,7 @@ define('camunda-welcome-bootstrap', function() {
         node.setAttribute('rel', 'stylesheet');
         node.setAttribute(
           'href',
-          plugin.location + '/plugin.css?bust=$CACHE_BUST'
+          plugin.location + `/plugin.css?bust=${CAMUNDA_VERSION}` // eslint-disable-line
         );
         document.head.appendChild(node);
       });
diff --git a/webapps/frontend/ui/welcome/client/scripts/directives/custom-links.js b/webapps/frontend/ui/welcome/client/scripts/directives/custom-links.js
index 501993443f5..af8c466a0ca 100644
--- a/webapps/frontend/ui/welcome/client/scripts/directives/custom-links.js
+++ b/webapps/frontend/ui/welcome/client/scripts/directives/custom-links.js
@@ -16,7 +16,7 @@
  */
 
 'use strict';
-var template = require('./custom-links.html')();
+var template = require('./custom-links.html?raw');
 
 module.exports = [
   'customLinks',
diff --git a/webapps/frontend/ui/welcome/client/scripts/directives/user-profile.js b/webapps/frontend/ui/welcome/client/scripts/directives/user-profile.js
index 4ab0b59d687..3e34431af55 100644
--- a/webapps/frontend/ui/welcome/client/scripts/directives/user-profile.js
+++ b/webapps/frontend/ui/welcome/client/scripts/directives/user-profile.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./user-profile.html')();
+var template = require('./user-profile.html?raw');
 var angular = require('camunda-commons-ui/vendor/angular');
 
 module.exports = [
diff --git a/webapps/frontend/ui/welcome/client/scripts/index.html b/webapps/frontend/ui/welcome/client/scripts/index.html
index 13e549abb55..2c741f966d5 100644
--- a/webapps/frontend/ui/welcome/client/scripts/index.html
+++ b/webapps/frontend/ui/welcome/client/scripts/index.html
@@ -16,13 +16,13 @@
           content="camunda services GmbH" />
 
     <!-- settings the base path for relative links -->
-    <base href="$BASE"
-          admin-api="$APP_ROOT/api/admin/"
-          cockpit-api="$APP_ROOT/api/cockpit/"
-          tasklist-api="$APP_ROOT/api/tasklist/"
-          welcome-api="$APP_ROOT/api/welcome/"
-          engine-api="$APP_ROOT/api/engine/"
-          app-root="$APP_ROOT"
+    <base href="<%= htmlWebpackPlugin.options.base %>"
+          admin-api="<%= htmlWebpackPlugin.options.appRoot %>/api/admin/"
+          cockpit-api="<%= htmlWebpackPlugin.options.appRoot %>/api/cockpit/"
+          tasklist-api="<%= htmlWebpackPlugin.options.appRoot %>/api/tasklist/"
+          welcome-api="<%= htmlWebpackPlugin.options.appRoot %>/api/welcome/"
+          engine-api="<%= htmlWebpackPlugin.options.appRoot %>/api/engine/"
+          app-root="<%= htmlWebpackPlugin.options.appRoot %>"
           app-name="welcome" />
 
     <!-- an example of plugin/feature exclusion -->
@@ -39,7 +39,7 @@
 
     <link rel="stylesheet"
           type="text/css"
-          href="${'$APP_ROOT/app/welcome/styles/user-styles.css?bust=$CACHE_BUST'}">
+          href="<%= htmlWebpackPlugin.options.appRoot %>/app/admin/styles/user-styles.css?bust=<%= htmlWebpackPlugin.options.version %>">
           <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
   <body ng-controller="WelcomePage as welcomePage">
     <!-- navigation -->
@@ -68,11 +68,11 @@
 
     <!-- footer -->
     <footer cam-widget-footer
-            version="v$VERSION"></footer>
+            version="v<%= htmlWebpackPlugin.options.version %>"></footer>
 
     <script type="text/javascript" $CSP_NONCE>
-      window.PLUGIN_DEPENDENCIES = $PLUGIN_DEPENDENCIES || [];
-      window.PLUGIN_PACKAGES = $PLUGIN_PACKAGES || [];
+      window.PLUGIN_DEPENDENCIES = <%= htmlWebpackPlugin.options.pluginDeps %> || [];
+      window.PLUGIN_PACKAGES = <%= htmlWebpackPlugin.options.pluginPackages %> || [];
 
       window.require = {
         waitSeconds: 0
diff --git a/webapps/frontend/ui/welcome/client/scripts/pages/welcome.js b/webapps/frontend/ui/welcome/client/scripts/pages/welcome.js
index cd37011d17f..fd52d1f61fc 100644
--- a/webapps/frontend/ui/welcome/client/scripts/pages/welcome.js
+++ b/webapps/frontend/ui/welcome/client/scripts/pages/welcome.js
@@ -17,7 +17,7 @@
 
 'use strict';
 
-var template = require('./welcome.html')();
+var template = require('./welcome.html?raw');
 
 var RouteConfig = [
   '$routeProvider',
diff --git a/webapps/frontend/webpack.common.js b/webapps/frontend/webpack.common.js
index fa506c30717..ccfa72e4aa5 100644
--- a/webapps/frontend/webpack.common.js
+++ b/webapps/frontend/webpack.common.js
@@ -104,44 +104,9 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /(\.js)|(\.html)$/,
-        exclude: /node_modules/,
-        loader: 'string-replace-loader',
-        options: {
-          multiple: [
-            {
-              search: /\$CACHE_BUST/g,
-              replace: version
-            }
-          ]
-        }
-      },
-      {
-        test: /\.html$/,
-        loader: 'string-replace-loader',
-        options: {
-          multiple: [{search: /\$VERSION/g, replace: version}]
-        }
-      },
-      {
-        test: /\.html$/,
-        use: [
-          {
-            loader: 'ejs-loader',
-            options: {
-              esModule: false
-            }
-          },
-          {
-            loader: 'extract-loader'
-          },
-          {
-            loader: 'html-loader',
-            options: {
-              minimize: false
-            }
-          }
-        ]
+        test: /(\.html)|(\.svg)$/,
+        resourceQuery: /raw/,
+        type: 'asset/source'
       },
       {
         test: /\.less$/i,
@@ -157,35 +122,43 @@ module.exports = {
   plugins: [
     new HtmlWebPackPlugin({
       minify: false,
+      appName: 'cockpit',
       template: path.resolve(__dirname, 'ui/cockpit/client/scripts/index.html'),
       filename: 'app/cockpit/index.html',
       chunks: ['app/cockpit/camunda-cockpit-bootstrap'],
       favicon: path.resolve(__dirname, 'ui/common/images/favicon.ico'),
-      publicPath: '$APP_ROOT'
+      publicPath: '$APP_ROOT',
+      version
     }),
     new HtmlWebPackPlugin({
       minify: false,
+      appName: 'tasklist',
       template: path.resolve(__dirname, 'ui/tasklist/client/index.html'),
       filename: 'app/tasklist/index.html',
       chunks: ['app/tasklist/camunda-tasklist-bootstrap'],
       favicon: path.resolve(__dirname, 'ui/common/images/favicon.ico'),
-      publicPath: '$APP_ROOT'
+      publicPath: '$APP_ROOT',
+      version
     }),
     new HtmlWebPackPlugin({
       minify: false,
+      appName: 'admin',
       template: path.resolve(__dirname, 'ui/admin/client/scripts/index.html'),
       filename: 'app/admin/index.html',
       chunks: ['app/admin/camunda-admin-bootstrap'],
       favicon: path.resolve(__dirname, 'ui/common/images/favicon.ico'),
-      publicPath: '$APP_ROOT'
+      publicPath: '$APP_ROOT',
+      version
     }),
     new HtmlWebPackPlugin({
       minify: false,
+      appName: 'welcome',
       template: path.resolve(__dirname, 'ui/welcome/client/scripts/index.html'),
       filename: 'app/welcome/index.html',
       chunks: ['app/welcome/camunda-welcome-bootstrap'],
       favicon: path.resolve(__dirname, 'ui/common/images/favicon.ico'),
-      publicPath: '$APP_ROOT'
+      publicPath: '$APP_ROOT',
+      version
     }),
     new MiniCssExtractPlugin({
       // both options are optional, similar to the same options in webpackOptions.output
diff --git a/webapps/frontend/webpack.dev.js b/webapps/frontend/webpack.dev.js
index f80c87ac35a..df06887303b 100644
--- a/webapps/frontend/webpack.dev.js
+++ b/webapps/frontend/webpack.dev.js
@@ -27,21 +27,6 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 
 module.exports = (_env, argv = {}) => {
   const eeBuild = !!argv.eeBuild;
-  const webapps = [
-    {
-      name: 'cockpit',
-      indexFile: /ui\/cockpit\/client\/scripts\/index\.html$/
-    },
-    {
-      name: 'admin',
-      indexFile: /ui\/admin\/client\/scripts\/index\.html$/
-    },
-    {name: 'tasklist', indexFile: /ui\/tasklist\/client\/index\.html$/},
-    {
-      name: 'welcome',
-      indexFile: /ui\/welcome\/client\/scripts\/index\.html$/
-    }
-  ];
 
   const addEngines = engines => {
     return engines.reduce((acc, engine) => {
@@ -64,7 +49,6 @@ module.exports = (_env, argv = {}) => {
     }, {});
   };
 
-  const eeApps = ['admin', 'cockpit'];
   const developmentConfig = {
     output: {
       publicPath: '/'
@@ -110,60 +94,6 @@ module.exports = (_env, argv = {}) => {
       },
       open: ['/camunda/app/cockpit/default/']
     },
-    module: {
-      rules: [
-        ...webapps.map(({name, indexFile}) => {
-          const pluginDependencies = [];
-          if (name !== 'welcome') {
-            pluginDependencies.push({
-              ngModuleName: `${name}.plugin.${name}Plugins`,
-              requirePackageName: `${name}-plugin-${name}Plugins`
-            });
-            if (eeBuild && eeApps.includes(name)) {
-              pluginDependencies.push({
-                ngModuleName: `${name}.plugin.${name}EE`,
-                requirePackageName: `${name}-plugin-${name}EE`
-              });
-            }
-          }
-          const pluginPackages = [];
-          if (name !== 'welcome') {
-            pluginPackages.push({
-              name: `${name}-plugin-${name}Plugins`,
-              location: `/plugin/${name}/app/`,
-              main: 'plugin.js'
-            });
-            if (eeBuild && eeApps.includes(name)) {
-              pluginPackages.push({
-                name: `${name}-plugin-${name}EE`,
-                location: `/plugin/${name}EE/app/`,
-                main: 'plugin.js'
-              });
-            }
-          }
-
-          return {
-            test: indexFile,
-            exclude: /node_modules/,
-            loader: 'string-replace-loader',
-            options: {
-              multiple: [
-                {search: /\$APP_ROOT/g, replace: '/camunda'},
-                {search: /\$BASE/g, replace: `/camunda/app/${name}/{ENGINE}/`},
-                {
-                  search: /\$PLUGIN_DEPENDENCIES/g,
-                  replace: JSON.stringify(pluginDependencies)
-                },
-                {
-                  search: /\$PLUGIN_PACKAGES/g,
-                  replace: JSON.stringify(pluginPackages)
-                }
-              ]
-            }
-          };
-        })
-      ]
-    },
     plugins: [
       new webpack.DefinePlugin({
         // define custom global variables
@@ -177,8 +107,53 @@ module.exports = (_env, argv = {}) => {
 
   const merged = merge(commonConfig, developmentConfig);
   merged.plugins.forEach(plugin => {
+    const eeApps = ['admin', 'cockpit'];
+    function getPluginDeps(appName) {
+      const pluginDependencies = [];
+      if (appName !== 'welcome') {
+        pluginDependencies.push({
+          ngModuleName: `${appName}.plugin.${appName}Plugins`,
+          requirePackageName: `${appName}-plugin-${appName}Plugins`
+        });
+        if (eeBuild && eeApps.includes(appName)) {
+          pluginDependencies.push({
+            ngModuleName: `${appName}.plugin.${appName}EE`,
+            requirePackageName: `${appName}-plugin-${appName}EE`
+          });
+        }
+      }
+      return JSON.stringify(pluginDependencies);
+    }
+
+    function getPluginPackages(appName) {
+      const pluginPackages = [];
+      if (appName !== 'welcome') {
+        pluginPackages.push({
+          name: `${appName}-plugin-${appName}Plugins`,
+          location: `/plugin/${appName}/app/`,
+          main: 'plugin.js'
+        });
+        if (eeBuild && eeApps.includes(appName)) {
+          pluginPackages.push({
+            name: `${appName}-plugin-${appName}EE`,
+            location: `/plugin/${appName}EE/app/`,
+            main: 'plugin.js'
+          });
+        }
+      }
+      return JSON.stringify(pluginPackages);
+    }
+
     if (plugin instanceof HtmlWebpackPlugin) {
-      plugin.userOptions.publicPath = '/camunda';
+      const options = plugin.userOptions;
+      plugin.userOptions = {
+        ...options,
+        publicPath: '/camunda',
+        appRoot: '/camunda',
+        base: `/camunda/app/${options['appName']}/{ENGINE}/`,
+        pluginDeps: getPluginDeps(options['appName']),
+        pluginPackages: getPluginPackages(options['appName'])
+      };
     }
   });
   return merged;
diff --git a/webapps/frontend/webpack.prod.js b/webapps/frontend/webpack.prod.js
index c890258fdb1..ef0b51de5df 100644
--- a/webapps/frontend/webpack.prod.js
+++ b/webapps/frontend/webpack.prod.js
@@ -24,23 +24,26 @@ const commonConfig = require(path.resolve(__dirname, './webpack.common.js'));
 
 const {merge} = require('webpack-merge');
 const TerserPlugin = require('terser-webpack-plugin');
-const HtmlWebPackPlugin = require("html-webpack-plugin");
+const HtmlWebPackPlugin = require('html-webpack-plugin');
 const fs = require('fs');
 
 class HtmlAdditionalAttributesPlugin {
   apply(compiler) {
-    compiler.hooks.compilation.tap(HtmlAdditionalAttributesPlugin.name, compilation => {
-      HtmlWebPackPlugin.getHooks(compilation).alterAssetTags.tap(
-        HtmlAdditionalAttributesPlugin.name,
-        config => {
-          config.assetTags.scripts.forEach(script => {
-            script.attributes['$CSP_NONCE'] = true;
-            script.attributes.charset = 'UTF-8';
-          });
-          return config;
-        }
-      );
-    });
+    compiler.hooks.compilation.tap(
+      HtmlAdditionalAttributesPlugin.name,
+      compilation => {
+        HtmlWebPackPlugin.getHooks(compilation).alterAssetTags.tap(
+          HtmlAdditionalAttributesPlugin.name,
+          config => {
+            config.assetTags.scripts.forEach(script => {
+              script.attributes['$CSP_NONCE'] = true;
+              script.attributes.charset = 'UTF-8';
+            });
+            return config;
+          }
+        );
+      }
+    );
   }
 }
 
@@ -103,5 +106,18 @@ module.exports = () => {
     }
   };
 
-  return merge(commonConfig, productionConfig);
+  const merged = merge(commonConfig, productionConfig);
+
+  merged.plugins.forEach(plugin => {
+    if (plugin instanceof HtmlWebPackPlugin) {
+      plugin.userOptions = {
+        ...plugin.userOptions,
+        appRoot: '$APP_ROOT',
+        base: '$BASE',
+        pluginDeps: '$PLUGIN_DEPENDENCIES',
+        pluginPackages: '$PLUGIN_PACKAGES'
+      };
+    }
+  });
+  return merged;
 };