diff --git a/package.json b/package.json
index 94d06ae186..776e52bff6 100644
--- a/package.json
+++ b/package.json
@@ -171,6 +171,13 @@
           "src/controllers/dashboard/networking.js",
           "src/controllers/dashboard/playback.js",
           "src/controllers/dashboard/plugins/repositories.js",
+          "src/controllers/shows/episodes.js",
+          "src/controllers/shows/tvgenres.js",
+          "src/controllers/shows/tvlatest.js",
+          "src/controllers/shows/tvrecommended.js",
+          "src/controllers/shows/tvshows.js",
+          "src/controllers/shows/tvstudios.js",
+          "src/controllers/shows/tvupcoming.js",
           "src/controllers/searchpage.js",
           "src/controllers/dashboard/scheduledtasks/scheduledtask.js",
           "src/controllers/dashboard/scheduledtasks/scheduledtasks.js",
diff --git a/src/controllers/shows/episodes.js b/src/controllers/shows/episodes.js
index eeede20661..1e067a7674 100644
--- a/src/controllers/shows/episodes.js
+++ b/src/controllers/shows/episodes.js
@@ -1,10 +1,19 @@
-define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (loading, events, libraryBrowser, imageLoader, listView, cardBuilder, userSettings, globalize) {
-    'use strict';
+import loading from 'loading';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import * as userSettings from 'userSettings';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
 
-    return function (view, params, tabContent) {
+/* eslint-disable indent */
+
+    export default function (view, params, tabContent) {
         function getPageData(context) {
-            var key = getSavedQueryKey(context);
-            var pageData = data[key];
+            const key = getSavedQueryKey(context);
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -46,8 +55,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
         }
 
         function onViewStyleChange() {
-            var viewStyle = self.getCurrentViewStyle();
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const viewStyle = self.getCurrentViewStyle();
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
             if ('List' == viewStyle) {
                 itemsContainer.classList.add('vertical-list');
@@ -63,7 +72,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
         function reloadItems(page) {
             loading.show();
             isLoading = true;
-            var query = getQuery(page);
+            const query = getQuery(page);
             ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) {
                 function onNextPageClick() {
                     if (isLoading) {
@@ -88,8 +97,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
                 }
 
                 window.scrollTo(0, 0);
-                var html;
-                var pagingHtml = libraryBrowser.getQueryPagingHtml({
+                let html;
+                const pagingHtml = libraryBrowser.getQueryPagingHtml({
                     startIndex: query.StartIndex,
                     limit: query.Limit,
                     totalRecordCount: result.TotalRecordCount,
@@ -99,8 +108,8 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
                     sortButton: false,
                     filterButton: false
                 });
-                var viewStyle = self.getCurrentViewStyle();
-                var itemsContainer = tabContent.querySelector('.itemsContainer');
+                const viewStyle = self.getCurrentViewStyle();
+                const itemsContainer = tabContent.querySelector('.itemsContainer');
                 if (viewStyle == 'List') {
                     html = listView.getListViewHtml({
                         items: result.Items,
@@ -128,22 +137,20 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
                         overlayPlayButton: true
                     });
                 }
-                var i;
-                var length;
-                var elems;
+                let elems;
 
                 elems = tabContent.querySelectorAll('.paging');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].innerHTML = pagingHtml;
                 }
 
                 elems = tabContent.querySelectorAll('.btnNextPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onNextPageClick);
                 }
 
                 elems = tabContent.querySelectorAll('.btnPreviousPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onPreviousPageClick);
                 }
 
@@ -153,19 +160,19 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
                 loading.hide();
                 isLoading = false;
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(page);
                 });
             });
         }
 
-        var self = this;
-        var data = {};
-        var isLoading = false;
+        const self = this;
+        const data = {};
+        let isLoading = false;
 
         self.showFilterMenu = function () {
-            require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
-                var filterDialog = new filterDialogFactory({
+            import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
+                const filterDialog = new filterDialogFactory({
                     query: getQuery(tabContent),
                     mode: 'episodes',
                     serverId: ApiClient.serverId()
@@ -219,12 +226,12 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
                     button: e.target
                 });
             });
-            var btnSelectView = tabContent.querySelector('.btnSelectView');
+            const btnSelectView = tabContent.querySelector('.btnSelectView');
             btnSelectView.addEventListener('click', function (e) {
                 libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
             });
             btnSelectView.addEventListener('layoutchange', function (e) {
-                var viewStyle = e.detail.viewStyle;
+                const viewStyle = e.detail.viewStyle;
                 getPageData(tabContent).view = viewStyle;
                 libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
                 onViewStyleChange();
@@ -240,5 +247,6 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
         };
 
         self.destroy = function () {};
-    };
-});
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvgenres.js b/src/controllers/shows/tvgenres.js
index 7d09307fc2..f48b91d68f 100644
--- a/src/controllers/shows/tvgenres.js
+++ b/src/controllers/shows/tvgenres.js
@@ -1,10 +1,20 @@
-define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'appRouter', 'dom', 'emby-button'], function (layoutManager, loading, libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, appRouter, dom) {
-    'use strict';
+import layoutManager from 'layoutManager';
+import loading from 'loading';
+import libraryBrowser from 'libraryBrowser';
+import cardBuilder from 'cardBuilder';
+import lazyLoader from 'lazyLoader';
+import appHost from 'apphost';
+import globalize from 'globalize';
+import appRouter from 'appRouter';
+import dom from 'dom';
+import 'emby-button';
 
-    return function (view, params, tabContent) {
+/* eslint-disable indent */
+
+    export default function (view, params, tabContent) {
         function getPageData() {
-            var key = getSavedQueryKey();
-            var pageData = data[key];
+            const key = getSavedQueryKey();
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -34,7 +44,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
 
         function getPromise() {
             loading.show();
-            var query = getQuery();
+            const query = getQuery();
             return ApiClient.getGenres(ApiClient.getCurrentUserId(), query);
         }
 
@@ -51,17 +61,17 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
         }
 
         function fillItemsContainer(entry) {
-            var elem = entry.target;
-            var id = elem.getAttribute('data-id');
-            var viewStyle = self.getCurrentViewStyle();
-            var limit = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 5 : 9;
+            const elem = entry.target;
+            const id = elem.getAttribute('data-id');
+            const viewStyle = self.getCurrentViewStyle();
+            let limit = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 5 : 9;
 
             if (enableScrollX()) {
                 limit = 10;
             }
 
-            var enableImageTypes = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 'Primary,Backdrop,Thumb' : 'Primary';
-            var query = {
+            const enableImageTypes = 'Thumb' == viewStyle || 'ThumbCard' == viewStyle ? 'Primary,Backdrop,Thumb' : 'Primary';
+            const query = {
                 SortBy: 'SortName',
                 SortOrder: 'Ascending',
                 IncludeItemTypes: 'Series',
@@ -75,7 +85,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
                 ParentId: params.topParentId
             };
             ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) {
-                var supportsImageAnalysis = appHost.supports('imageanalysis');
+                const supportsImageAnalysis = appHost.supports('imageanalysis');
 
                 if (viewStyle == 'Thumb') {
                     cardBuilder.buildCards(result.Items, {
@@ -128,14 +138,14 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
         }
 
         function reloadItems(context, promise) {
-            var query = getQuery();
+            const query = getQuery();
             promise.then(function (result) {
-                var elem = context.querySelector('#items');
-                var html = '';
-                var items = result.Items;
+                const elem = context.querySelector('#items');
+                let html = '';
+                const items = result.Items;
 
-                for (var i = 0, length = items.length; i < length; i++) {
-                    var item = items[i];
+                for (let i = 0, length = items.length; i < length; i++) {
+                    const item = items[i];
                     html += '<div class="verticalSection">';
                     html += '<div class="sectionTitleContainer sectionTitleContainer-cards padded-left">';
                     html += '<a is="emby-linkbutton" href="' + appRouter.getRouteUrl(item, {
@@ -149,7 +159,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
                     html += '</a>';
                     html += '</div>';
                     if (enableScrollX()) {
-                        var scrollXClass = 'scrollX hiddenScrollX';
+                        let scrollXClass = 'scrollX hiddenScrollX';
                         if (layoutManager.tv) {
                             scrollXClass += 'smoothScrollX padded-top-focusscale padded-bottom-focusscale';
                         }
@@ -182,8 +192,8 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
             self.renderTab();
         }
 
-        var self = this;
-        var data = {};
+        const self = this;
+        const data = {};
 
         self.getViewStyles = function () {
             return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
@@ -200,7 +210,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
         };
 
         self.enableViewSelection = true;
-        var promise;
+        let promise;
 
         self.preRender = function () {
             promise = getPromise();
@@ -209,5 +219,6 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
         self.renderTab = function () {
             reloadItems(tabContent, promise);
         };
-    };
-});
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvlatest.js b/src/controllers/shows/tvlatest.js
index 08e420a595..c08f3d5a15 100644
--- a/src/controllers/shows/tvlatest.js
+++ b/src/controllers/shows/tvlatest.js
@@ -1,11 +1,16 @@
-define(['loading', 'components/groupedcards', 'cardBuilder', 'apphost', 'imageLoader'], function (loading, groupedcards, cardBuilder, appHost, imageLoader) {
-    'use strict';
+import loading from 'loading';
+import groupedcards from 'components/groupedcards';
+import cardBuilder from 'cardBuilder';
+import appHost from 'apphost';
+import imageLoader from 'imageLoader';
+
+/* eslint-disable indent */
 
     function getLatestPromise(context, params) {
         loading.show();
-        var userId = ApiClient.getCurrentUserId();
-        var parentId = params.topParentId;
-        var options = {
+        const userId = ApiClient.getCurrentUserId();
+        const parentId = params.topParentId;
+        const options = {
             IncludeItemTypes: 'Episode',
             Limit: 30,
             Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
@@ -18,7 +23,7 @@ define(['loading', 'components/groupedcards', 'cardBuilder', 'apphost', 'imageLo
 
     function loadLatest(context, params, promise) {
         promise.then(function (items) {
-            var html = '';
+            let html = '';
             appHost.supports('imageanalysis');
             html += cardBuilder.getCardsHtml({
                 items: items,
@@ -36,20 +41,20 @@ define(['loading', 'components/groupedcards', 'cardBuilder', 'apphost', 'imageLo
                 overlayPlayButton: true,
                 lines: 2
             });
-            var elem = context.querySelector('#latestEpisodes');
+            const elem = context.querySelector('#latestEpisodes');
             elem.innerHTML = html;
             imageLoader.lazyChildren(elem);
             loading.hide();
 
-            require(['autoFocuser'], function (autoFocuser) {
+            import('autoFocuser').then(({default: autoFocuser}) => {
                 autoFocuser.autoFocus(context);
             });
         });
     }
 
-    return function (view, params, tabContent) {
-        var self = this;
-        var latestPromise;
+    export default function (view, params, tabContent) {
+        const self = this;
+        let latestPromise;
 
         self.preRender = function () {
             latestPromise = getLatestPromise(view, params);
@@ -59,6 +64,7 @@ define(['loading', 'components/groupedcards', 'cardBuilder', 'apphost', 'imageLo
             loadLatest(tabContent, params, latestPromise);
         };
 
-        tabContent.querySelector('#latestEpisodes').addEventListener('click', groupedcards.onItemsContainerClick);
-    };
-});
+        tabContent.querySelector('#latestEpisodes').addEventListener('click', groupedcards);
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvrecommended.js b/src/controllers/shows/tvrecommended.js
index 8087a03096..6853f11d65 100644
--- a/src/controllers/shows/tvrecommended.js
+++ b/src/controllers/shows/tvrecommended.js
@@ -1,5 +1,19 @@
-define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'dom', 'userSettings', 'cardBuilder', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-button'], function (events, inputManager, libraryMenu, layoutManager, loading, dom, userSettings, cardBuilder, playbackManager, mainTabsManager, globalize) {
-    'use strict';
+import events from 'events';
+import inputManager from 'inputManager';
+import libraryMenu from 'libraryMenu';
+import layoutManager from 'layoutManager';
+import loading from 'loading';
+import dom from 'dom';
+import * as userSettings from 'userSettings';
+import cardBuilder from 'cardBuilder';
+import playbackManager from 'playbackManager';
+import mainTabsManager from 'mainTabsManager';
+import globalize from 'globalize';
+import 'scrollStyles';
+import 'emby-itemscontainer';
+import 'emby-button';
+
+/* eslint-disable indent */
 
     function getTabs() {
         return [{
@@ -59,7 +73,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
     }
 
-    return function (view, params) {
+    export default function (view, params) {
         function reload() {
             loading.show();
             loadResume();
@@ -67,7 +81,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
 
         function loadNextUp() {
-            var query = {
+            const query = {
                 Limit: 24,
                 Fields: 'PrimaryImageAspectRatio,SeriesInfo,DateCreated,BasicSyncInfo',
                 UserId: ApiClient.getCurrentUserId(),
@@ -83,7 +97,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
                     view.querySelector('.noNextUpItems').classList.remove('hide');
                 }
 
-                var container = view.querySelector('#nextUpItems');
+                const container = view.querySelector('#nextUpItems');
                 cardBuilder.buildCards(result.Items, {
                     itemsContainer: container,
                     preferThumb: true,
@@ -98,7 +112,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
                 });
                 loading.hide();
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(view);
                 });
             });
@@ -113,10 +127,10 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
 
         function loadResume() {
-            var parentId = libraryMenu.getTopParentId();
-            var screenWidth = dom.getWindowSize().innerWidth;
-            var limit = screenWidth >= 1600 ? 5 : 6;
-            var options = {
+            const parentId = libraryMenu.getTopParentId();
+            const screenWidth = dom.getWindowSize().innerWidth;
+            const limit = screenWidth >= 1600 ? 5 : 6;
+            const options = {
                 SortBy: 'DatePlayed',
                 SortOrder: 'Descending',
                 IncludeItemTypes: 'Episode',
@@ -137,8 +151,8 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
                     view.querySelector('#resumableSection').classList.add('hide');
                 }
 
-                var allowBottomPadding = !enableScrollX();
-                var container = view.querySelector('#resumableItems');
+                const allowBottomPadding = !enableScrollX();
+                const container = view.querySelector('#resumableItems');
                 cardBuilder.buildCards(result.Items, {
                     itemsContainer: container,
                     preferThumb: true,
@@ -160,7 +174,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
 
         function onTabChange(e) {
-            var newIndex = parseInt(e.detail.selectedTabIndex);
+            const newIndex = parseInt(e.detail.selectedTabIndex);
             loadTab(view, newIndex);
         }
 
@@ -173,49 +187,50 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
 
         function getTabController(page, index, callback) {
-            var depends = [];
+            let depends;
 
             switch (index) {
                 case 0:
-                    depends.push('controllers/shows/tvshows');
+                    depends = 'controllers/shows/tvshows';
                     break;
 
                 case 1:
+                    depends = 'controllers/shows/tvrecommended';
                     break;
 
                 case 2:
-                    depends.push('controllers/shows/tvlatest');
+                    depends = 'controllers/shows/tvlatest';
                     break;
 
                 case 3:
-                    depends.push('controllers/shows/tvupcoming');
+                    depends = 'controllers/shows/tvupcoming';
                     break;
 
                 case 4:
-                    depends.push('controllers/shows/tvgenres');
+                    depends = 'controllers/shows/tvgenres';
                     break;
 
                 case 5:
-                    depends.push('controllers/shows/tvstudios');
+                    depends = 'controllers/shows/tvstudios';
                     break;
 
                 case 6:
-                    depends.push('controllers/shows/episodes');
+                    depends = 'controllers/shows/episodes';
                     break;
 
                 case 7:
-                    depends.push('scripts/searchtab');
+                    depends = 'scripts/searchtab';
             }
 
-            require(depends, function (controllerFactory) {
-                var tabContent;
+            import(depends).then(({default: controllerFactory}) => {
+                let tabContent;
 
                 if (index === 1) {
                     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 + "']");
@@ -270,7 +285,7 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
         }
 
         function onWebSocketMessage(e, data) {
-            var msg = data;
+            const msg = data;
 
             if (msg.MessageType === 'UserDataChanged' && msg.Data.UserId == ApiClient.getCurrentUserId()) {
                 renderedTabs = [];
@@ -285,13 +300,13 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
             }
         }
 
-        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 = self.tabContent;
+            const tabContent = self.tabContent;
             setScrollClasses(tabContent.querySelector('#resumableItems'), enableScrollX());
         };
 
@@ -299,14 +314,14 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
             reload();
         };
 
-        var tabControllers = [];
-        var renderedTabs = [];
+        const tabControllers = [];
+        let renderedTabs = [];
         setScrollClasses(view.querySelector('#resumableItems'), enableScrollX());
         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) {
@@ -335,5 +350,6 @@ define(['events', 'inputManager', 'libraryMenu', 'layoutManager', 'loading', 'do
                 }
             });
         });
-    };
-});
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvshows.js b/src/controllers/shows/tvshows.js
index 4425c3aee1..cde5ae5058 100644
--- a/src/controllers/shows/tvshows.js
+++ b/src/controllers/shows/tvshows.js
@@ -1,10 +1,21 @@
-define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'alphaPicker', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, listView, cardBuilder, AlphaPicker, userSettings, globalize) {
-    'use strict';
+import layoutManager from 'layoutManager';
+import loading from 'loading';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import AlphaPicker from 'alphaPicker';
+import * as userSettings from 'userSettings';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
 
-    return function (view, params, tabContent) {
+/* eslint-disable indent */
+
+    export default function (view, params, tabContent) {
         function getPageData(context) {
-            var key = getSavedQueryKey(context);
-            var pageData = data[key];
+            const key = getSavedQueryKey(context);
+            let pageData = data[key];
 
             if (!pageData) {
                 pageData = data[key] = {
@@ -45,8 +56,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         }
 
         function onViewStyleChange() {
-            var viewStyle = self.getCurrentViewStyle();
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const viewStyle = self.getCurrentViewStyle();
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
             if ('List' == viewStyle) {
                 itemsContainer.classList.add('vertical-list');
@@ -62,7 +73,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         function reloadItems(page) {
             loading.show();
             isLoading = true;
-            var query = getQuery(page);
+            const query = getQuery(page);
             ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) {
                 function onNextPageClick() {
                     if (isLoading) {
@@ -88,8 +99,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
 
                 window.scrollTo(0, 0);
                 updateFilterControls(page);
-                var html;
-                var pagingHtml = libraryBrowser.getQueryPagingHtml({
+                let html;
+                const pagingHtml = libraryBrowser.getQueryPagingHtml({
                     startIndex: query.StartIndex,
                     limit: query.Limit,
                     totalRecordCount: result.TotalRecordCount,
@@ -99,7 +110,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
                     sortButton: false,
                     filterButton: false
                 });
-                var viewStyle = self.getCurrentViewStyle();
+                const viewStyle = self.getCurrentViewStyle();
                 if (viewStyle == 'Thumb') {
                     html = cardBuilder.getCardsHtml({
                         items: result.Items,
@@ -156,49 +167,48 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
                         showYear: true
                     });
                 }
-                var i;
-                var length;
-                var elems = tabContent.querySelectorAll('.paging');
 
-                for (i = 0, length = elems.length; i < length; i++) {
+                let elems = tabContent.querySelectorAll('.paging');
+
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].innerHTML = pagingHtml;
                 }
 
                 elems = tabContent.querySelectorAll('.btnNextPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onNextPageClick);
                 }
 
                 elems = tabContent.querySelectorAll('.btnPreviousPage');
-                for (i = 0, length = elems.length; i < length; i++) {
+                for (let i = 0, length = elems.length; i < length; i++) {
                     elems[i].addEventListener('click', onPreviousPageClick);
                 }
 
-                var itemsContainer = tabContent.querySelector('.itemsContainer');
+                const itemsContainer = tabContent.querySelector('.itemsContainer');
                 itemsContainer.innerHTML = html;
                 imageLoader.lazyChildren(itemsContainer);
                 libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
                 loading.hide();
                 isLoading = false;
 
-                require(['autoFocuser'], function (autoFocuser) {
+                import('autoFocuser').then(({default: autoFocuser}) => {
                     autoFocuser.autoFocus(page);
                 });
             });
         }
 
         function updateFilterControls(tabContent) {
-            var query = getQuery(tabContent);
+            const query = getQuery(tabContent);
             self.alphaPicker.value(query.NameStartsWithOrGreater);
         }
 
-        var self = this;
-        var data = {};
-        var isLoading = false;
+        const self = this;
+        const data = {};
+        let isLoading = false;
 
         self.showFilterMenu = function () {
-            require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
-                var filterDialog = new filterDialogFactory({
+            import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
+                const filterDialog = new filterDialogFactory({
                     query: getQuery(tabContent),
                     mode: 'series',
                     serverId: ApiClient.serverId()
@@ -216,17 +226,17 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         };
 
         function initPage(tabContent) {
-            var alphaPickerElement = tabContent.querySelector('.alphaPicker');
-            var itemsContainer = tabContent.querySelector('.itemsContainer');
+            const alphaPickerElement = tabContent.querySelector('.alphaPicker');
+            const itemsContainer = tabContent.querySelector('.itemsContainer');
 
             alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
-                var newValue = e.detail.value;
-                var query = getQuery(tabContent);
+                const newValue = e.detail.value;
+                const query = getQuery(tabContent);
                 query.NameStartsWithOrGreater = newValue;
                 query.StartIndex = 0;
                 reloadItems(tabContent);
             });
-            self.alphaPicker = new AlphaPicker.default({
+            self.alphaPicker = new AlphaPicker({
                 element: alphaPickerElement,
                 valueChangeEvent: 'click'
             });
@@ -267,12 +277,12 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
                     button: e.target
                 });
             });
-            var btnSelectView = tabContent.querySelector('.btnSelectView');
+            const btnSelectView = tabContent.querySelector('.btnSelectView');
             btnSelectView.addEventListener('click', function (e) {
                 libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
             });
             btnSelectView.addEventListener('layoutchange', function (e) {
-                var viewStyle = e.detail.viewStyle;
+                const viewStyle = e.detail.viewStyle;
                 getPageData(tabContent).view = viewStyle;
                 libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
                 getQuery(tabContent).StartIndex = 0;
@@ -290,5 +300,6 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
         };
 
         self.destroy = function () {};
-    };
-});
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvstudios.js b/src/controllers/shows/tvstudios.js
index 1051bfa10b..ba7fdfaf78 100644
--- a/src/controllers/shows/tvstudios.js
+++ b/src/controllers/shows/tvstudios.js
@@ -1,9 +1,13 @@
-define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loading, libraryBrowser, cardBuilder, appHost) {
-    'use strict';
+import loading from 'loading';
+import libraryBrowser from 'libraryBrowser';
+import cardBuilder from 'cardBuilder';
+import appHost from 'apphost';
+
+/* eslint-disable indent */
 
     function getQuery(params) {
-        var key = getSavedQueryKey();
-        var pageData = data[key];
+        const key = getSavedQueryKey();
+        let pageData = data[key];
 
         if (!pageData) {
             pageData = data[key] = {
@@ -27,14 +31,14 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin
     }
 
     function getPromise(context, params) {
-        var query = getQuery(params);
+        const query = getQuery(params);
         loading.show();
         return ApiClient.getStudios(ApiClient.getCurrentUserId(), query);
     }
 
     function reloadItems(context, params, promise) {
         promise.then(function (result) {
-            var elem = context.querySelector('#items');
+            const elem = context.querySelector('#items');
             cardBuilder.buildCards(result.Items, {
                 itemsContainer: elem,
                 shape: 'backdrop',
@@ -47,16 +51,17 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin
             });
             loading.hide();
 
-            require(['autoFocuser'], function (autoFocuser) {
+            import('autoFocuser').then(({default: autoFocuser}) => {
                 autoFocuser.autoFocus(context);
             });
         });
     }
 
-    var data = {};
-    return function (view, params, tabContent) {
-        var promise;
-        var self = this;
+    const data = {};
+
+    export default function (view, params, tabContent) {
+        let promise;
+        const self = this;
 
         self.preRender = function () {
             promise = getPromise(view, params);
@@ -65,5 +70,6 @@ define(['loading', 'libraryBrowser', 'cardBuilder', 'apphost'], function (loadin
         self.renderTab = function () {
             reloadItems(tabContent, params, promise);
         };
-    };
-});
+    }
+
+/* eslint-enable indent */
diff --git a/src/controllers/shows/tvupcoming.js b/src/controllers/shows/tvupcoming.js
index d57a5ae3cd..a2016279b8 100644
--- a/src/controllers/shows/tvupcoming.js
+++ b/src/controllers/shows/tvupcoming.js
@@ -1,9 +1,19 @@
-define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'globalize', 'scrollStyles', 'emby-itemscontainer'], function (layoutManager, loading, datetime, libraryBrowser, cardBuilder, appHost, imageLoader, globalize) {
-    'use strict';
+import layoutManager from 'layoutManager';
+import loading from 'loading';
+import datetime from 'datetime';
+import libraryBrowser from 'libraryBrowser';
+import cardBuilder from 'cardBuilder';
+import appHost from 'apphost';
+import imageLoader from 'imageLoader';
+import globalize from 'globalize';
+import 'scrollStyles';
+import 'emby-itemscontainer';
+
+/* eslint-disable indent */
 
     function getUpcomingPromise(context, params) {
         loading.show();
-        var query = {
+        const query = {
             Limit: 48,
             Fields: 'AirTime,UserData',
             UserId: ApiClient.getCurrentUserId(),
@@ -17,7 +27,7 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
 
     function loadUpcoming(context, params, promise) {
         promise.then(function (result) {
-            var items = result.Items;
+            const items = result.Items;
 
             if (items.length) {
                 context.querySelector('.noItemsMessage').style.display = 'none';
@@ -39,19 +49,17 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
     }
 
     function renderUpcoming(elem, items) {
-        var i;
-        var length;
-        var groups = [];
-        var currentGroupName = '';
-        var currentGroup = [];
+        const groups = [];
+        let currentGroupName = '';
+        let currentGroup = [];
 
-        for (i = 0, length = items.length; i < length; i++) {
-            var item = items[i];
-            var dateText = '';
+        for (let i = 0, length = items.length; i < length; i++) {
+            const item = items[i];
+            let dateText = '';
 
             if (item.PremiereDate) {
                 try {
-                    var premiereDate = datetime.parseISO8601Date(item.PremiereDate, true);
+                    const premiereDate = datetime.parseISO8601Date(item.PremiereDate, true);
                     dateText = datetime.isRelativeDay(premiereDate, -1) ? globalize.translate('Yesterday') : datetime.toLocaleDateString(premiereDate, {
                         weekday: 'long',
                         month: 'short',
@@ -77,17 +85,17 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
             }
         }
 
-        var html = '';
+        let html = '';
 
-        for (i = 0, length = groups.length; i < length; i++) {
-            var group = groups[i];
+        for (let i = 0, length = groups.length; i < length; i++) {
+            const group = groups[i];
             html += '<div class="verticalSection">';
             html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + group.name + '</h2>';
-            var allowBottomPadding = true;
+            let allowBottomPadding = true;
 
             if (enableScrollX()) {
                 allowBottomPadding = false;
-                var scrollXClass = 'scrollX hiddenScrollX';
+                let scrollXClass = 'scrollX hiddenScrollX';
 
                 if (layoutManager.tv) {
                     scrollXClass += ' smoothScrollX';
@@ -98,7 +106,7 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
                 html += '<div is="emby-itemscontainer" class="itemsContainer vertical-wrap padded-left padded-right">';
             }
 
-            var supportsImageAnalysis = appHost.supports('imageanalysis');
+            let supportsImageAnalysis = appHost.supports('imageanalysis');
             supportsImageAnalysis = false;
             html += cardBuilder.getCardsHtml({
                 items: group.items,
@@ -124,9 +132,9 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
         imageLoader.lazyChildren(elem);
     }
 
-    return function (view, params, tabContent) {
-        var upcomingPromise;
-        var self = this;
+    export default function (view, params, tabContent) {
+        let upcomingPromise;
+        const self = this;
 
         self.preRender = function () {
             upcomingPromise = getUpcomingPromise(view, params);
@@ -135,5 +143,6 @@ define(['layoutManager', 'loading', 'datetime', 'libraryBrowser', 'cardBuilder',
         self.renderTab = function () {
             loadUpcoming(tabContent, params, upcomingPromise);
         };
-    };
-});
+    }
+
+/* eslint-enable indent */