diff --git a/package.json b/package.json
index 5d4742686d..9181dcb9b2 100644
--- a/package.json
+++ b/package.json
@@ -116,6 +116,7 @@
           "src/components/syncPlay/timeSyncManager.js",
           "src/controllers/dashboard/logs.js",
           "src/controllers/dashboard/plugins/repositories.js",
+          "src/controllers/music/musicrecommended.js",
           "src/controllers/user/display.js",
           "src/controllers/user/home.js",
           "src/controllers/user/playback.js",
diff --git a/src/controllers/music/musicrecommended.js b/src/controllers/music/musicrecommended.js
index 3f025799f6..f92ee588b8 100644
--- a/src/controllers/music/musicrecommended.js
+++ b/src/controllers/music/musicrecommended.js
@@ -1,8 +1,25 @@
-define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'libraryMenu', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button', 'flexStyles'], function (browser, layoutManager, userSettings, inputManager, loading, cardBuilder, dom, appHost, imageLoader, libraryMenu, playbackManager, mainTabsManager, globalize) {
-    'use strict';
+import browser from 'browser';
+import layoutManager from 'layoutManager';
+import * as userSettings from 'userSettings';
+import inputManager from 'inputManager';
+import loading from 'loading';
+import cardBuilder from 'cardBuilder';
+import dom from 'dom';
+import appHost from 'apphost';
+import imageLoader from 'imageLoader';
+import libraryMenu from 'libraryMenu';
+import mainTabsManager from 'mainTabsManager';
+import globalize from 'globalize';
+import 'scrollStyles';
+import 'emby-itemscontainer';
+import 'emby-tabs';
+import 'emby-button';
+import 'flexStyles';
+
+/* eslint-disable indent */
 
     function itemsPerRow() {
-        var screenWidth = dom.getWindowSize().innerWidth;
+        const screenWidth = dom.getWindowSize().innerWidth;
 
         if (screenWidth >= 1920) {
             return 9;
@@ -29,8 +46,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
 
     function loadLatest(page, parentId) {
         loading.show();
-        var userId = ApiClient.getCurrentUserId();
-        var options = {
+        const userId = ApiClient.getCurrentUserId();
+        const options = {
             IncludeItemTypes: 'Audio',
             Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(),
             Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
@@ -40,8 +57,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             EnableTotalRecordCount: false
         };
         ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
-            var elem = page.querySelector('#recentlyAddedSongs');
-            var supportsImageAnalysis = appHost.supports('imageanalysis');
+            const elem = page.querySelector('#recentlyAddedSongs');
+            let supportsImageAnalysis = appHost.supports('imageanalysis');
             supportsImageAnalysis = false;
             elem.innerHTML = cardBuilder.getCardsHtml({
                 items: items,
@@ -60,14 +77,14 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             imageLoader.lazyChildren(elem);
             loading.hide();
 
-            require(['autoFocuser'], function (autoFocuser) {
+            import('autoFocuser').then(({default: autoFocuser}) => {
                 autoFocuser.autoFocus(page);
             });
         });
     }
 
     function loadRecentlyPlayed(page, parentId) {
-        var options = {
+        const options = {
             SortBy: 'DatePlayed',
             SortOrder: 'Descending',
             IncludeItemTypes: 'Audio',
@@ -81,7 +98,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             EnableTotalRecordCount: false
         };
         ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
-            var elem = page.querySelector('#recentlyPlayed');
+            const elem = page.querySelector('#recentlyPlayed');
 
             if (result.Items.length) {
                 elem.classList.remove('hide');
@@ -89,8 +106,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
                 elem.classList.add('hide');
             }
 
-            var itemsContainer = elem.querySelector('.itemsContainer');
-            var supportsImageAnalysis = appHost.supports('imageanalysis');
+            const itemsContainer = elem.querySelector('.itemsContainer');
+            let supportsImageAnalysis = appHost.supports('imageanalysis');
             supportsImageAnalysis = false;
             itemsContainer.innerHTML = cardBuilder.getCardsHtml({
                 items: result.Items,
@@ -111,7 +128,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
     }
 
     function loadFrequentlyPlayed(page, parentId) {
-        var options = {
+        const options = {
             SortBy: 'PlayCount',
             SortOrder: 'Descending',
             IncludeItemTypes: 'Audio',
@@ -125,7 +142,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             EnableTotalRecordCount: false
         };
         ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
-            var elem = page.querySelector('#topPlayed');
+            const elem = page.querySelector('#topPlayed');
 
             if (result.Items.length) {
                 elem.classList.remove('hide');
@@ -133,8 +150,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
                 elem.classList.add('hide');
             }
 
-            var itemsContainer = elem.querySelector('.itemsContainer');
-            var supportsImageAnalysis = appHost.supports('imageanalysis');
+            const itemsContainer = elem.querySelector('.itemsContainer');
+            let supportsImageAnalysis = appHost.supports('imageanalysis');
             supportsImageAnalysis = false;
             itemsContainer.innerHTML = cardBuilder.getCardsHtml({
                 items: result.Items,
@@ -160,7 +177,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         loadRecentlyPlayed(tabContent, parentId);
         loadFrequentlyPlayed(tabContent, parentId);
 
-        require(['components/favoriteitems'], function (favoriteItems) {
+        import('components/favoriteitems').then(({default: favoriteItems}) => {
             favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']);
         });
     }
@@ -211,10 +228,10 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         }
     }
 
-    return function (view, params) {
+    export default function (view, params) {
         function reload() {
             loading.show();
-            var tabContent = view.querySelector(".pageTabContent[data-index='0']");
+            const tabContent = view.querySelector(".pageTabContent[data-index='0']");
             loadSuggestionsTab(view, tabContent, params.topParentId);
         }
 
@@ -257,46 +274,48 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
         }
 
         function getTabController(page, index, callback) {
-            var depends = [];
+            let depends;
 
             switch (index) {
                 case 0:
+                    depends = 'controllers/music/musicrecommended';
                     break;
 
                 case 1:
-                    depends.push('controllers/music/musicalbums');
+                    depends = 'controllers/music/musicalbums';
                     break;
 
                 case 2:
                 case 3:
-                    depends.push('controllers/music/musicartists');
+                    depends = 'controllers/music/musicartists';
                     break;
 
                 case 4:
-                    depends.push('controllers/music/musicplaylists');
+                    depends = 'controllers/music/musicplaylists';
                     break;
 
                 case 5:
-                    depends.push('controllers/music/songs');
+                    depends = 'controllers/music/songs';
                     break;
 
                 case 6:
-                    depends.push('controllers/music/musicgenres');
+                    depends = 'controllers/music/musicgenres';
                     break;
 
                 case 7:
-                    depends.push('scripts/searchtab');
+                    depends = 'scripts/searchtab';
+                    break;
             }
 
-            require(depends, function (controllerFactory) {
-                var tabContent;
+            import(depends).then(({default: controllerFactory}) => {
+                let tabContent;
 
                 if (0 == index) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
                     self.tabContent = tabContent;
                 }
 
-                var controller = tabControllers[index];
+                let controller = tabControllers[index];
 
                 if (!controller) {
                     tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
@@ -356,16 +375,16 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             }
         }
 
-        var isViewRestored;
-        var self = this;
-        var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
-        var initialTabIndex = currentTabIndex;
+        let isViewRestored;
+        const self = this;
+        let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
+        let initialTabIndex = currentTabIndex;
 
         self.initTab = function () {
-            var tabContent = view.querySelector(".pageTabContent[data-index='0']");
-            var containers = tabContent.querySelectorAll('.itemsContainer');
+            const tabContent = view.querySelector(".pageTabContent[data-index='0']");
+            const containers = tabContent.querySelectorAll('.itemsContainer');
 
-            for (var i = 0, length = containers.length; i < length; i++) {
+            for (let i = 0, length = containers.length; i < length; i++) {
                 setScrollClasses(containers[i], enableScrollX());
             }
         };
@@ -374,13 +393,13 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
             reload();
         };
 
-        var tabControllers = [];
-        var renderedTabs = [];
+        const tabControllers = [];
+        const renderedTabs = [];
         view.addEventListener('viewshow', function (e) {
             isViewRestored = e.detail.isRestored;
             initTabs();
             if (!view.getAttribute('data-title')) {
-                var parentId = params.topParentId;
+                const parentId = params.topParentId;
 
                 if (parentId) {
                     ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) {
@@ -405,5 +424,6 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
                 }
             });
         });
-    };
-});
+    }
+
+/* eslint-enable indent */