diff --git a/src/components/mediaLibraryCreator/mediaLibraryCreator.js b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
index c7011ba1d8..6940da1baf 100644
--- a/src/components/mediaLibraryCreator/mediaLibraryCreator.js
+++ b/src/components/mediaLibraryCreator/mediaLibraryCreator.js
@@ -201,8 +201,7 @@ export class editor {
                 currentOptions = options;
                 currentResolve = resolve;
                 hasChanges = false;
-                // TODO: remove require
-                require(['text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html'], template => {
+                import('text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html').then(({default: template}) => {
                     const dlg = dialogHelper.createDialog({
                         size: 'small',
                         modal: false,
diff --git a/src/components/mediaLibraryEditor/mediaLibraryEditor.js b/src/components/mediaLibraryEditor/mediaLibraryEditor.js
index 5b533b2ac9..7996867b2e 100644
--- a/src/components/mediaLibraryEditor/mediaLibraryEditor.js
+++ b/src/components/mediaLibraryEditor/mediaLibraryEditor.js
@@ -216,8 +216,7 @@ export class editor {
             currentOptions = options;
             currentDeferred = deferred;
             hasChanges = false;
-            // TODO: remove require
-            require(['text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html'], template => {
+            import('text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html').then(({default: template}) => {
                 const dlg = dialogHelper.createDialog({
                     size: 'small',
                     modal: false,