diff --git a/.gitignore b/.gitignore
index 6c4a737a..98741ecb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,5 +4,8 @@ build
 src/localize/generated.ts
 !script/build
 hacs_frontend/*.js
-hacs_frontend/*.gz
+hacs_frontend/*.json
+hacs_frontend/*.js.gz
+!hacs_frontend/*.py
+
 yarn-error.log
\ No newline at end of file
diff --git a/hacs_frontend/__init__.py b/hacs_frontend/__init__.py
index e6f12d39..8a0c19fc 100644
--- a/hacs_frontend/__init__.py
+++ b/hacs_frontend/__init__.py
@@ -2,16 +2,4 @@
 from .version import VERSION
 
 def locate_dir():
-    return __path__[0]
-
-def locate_js():
-    return f"{__path__[0]}/main.js"
-
-def locate_gz():
-    return f"{__path__[0]}/main.js.gz"
-
-def locate_debug_js():
-    return f"{__path__[0]}/debug.js"
-
-def locate_debug_gz():
-    return f"{__path__[0]}/debug.js.gz"
\ No newline at end of file
+    return __path__[0]
\ No newline at end of file
diff --git a/package.json b/package.json
index b85c1b4e..f11d9874 100644
--- a/package.json
+++ b/package.json
@@ -114,6 +114,7 @@
     "@rollup/plugin-typescript": "^6.0.0",
     "@webcomponents/webcomponentsjs": "^2.4.4",
     "cpx": "^1.5.0",
-    "idb-keyval": "^3.2.0"
+    "idb-keyval": "^3.2.0",
+    "rollup-plugin-entrypoint-hashmanifest": "^0.1.2"
   }
 }
diff --git a/script/gulp/build.js b/script/gulp/build.js
index 5488bbbf..b4c9a56b 100644
--- a/script/gulp/build.js
+++ b/script/gulp/build.js
@@ -8,7 +8,6 @@ gulp.task(
       process.env.NODE_ENV = "production";
     },
     "common",
-    "rollup-build",
-    "rollup-build-debug"
+    "rollup-build"
   )
 );
diff --git a/script/gulp/common.js b/script/gulp/common.js
index 4b475727..846cbabe 100644
--- a/script/gulp/common.js
+++ b/script/gulp/common.js
@@ -7,12 +7,7 @@ require("./translations");
 
 gulp.task("cleanup", (task) => {
   del.sync(["./homeassistant-frontend/build/**", "./homeassistant-frontend/build"]);
-  del.sync([
-    "./hacs_frontend/main.js",
-    "./hacs_frontend/main.js.gz",
-    "./hacs_frontend/debug.js",
-    "./hacs_frontend/debug.js.gz",
-  ]);
+  del.sync(["./hacs_frontend/*.js", "./hacs_frontend/*.json", "./hacs_frontend/*.gz"]);
   task();
 });
 
diff --git a/script/gulp/rollup.js b/script/gulp/rollup.js
index 46db0c93..6789e85c 100644
--- a/script/gulp/rollup.js
+++ b/script/gulp/rollup.js
@@ -1,6 +1,8 @@
 const gulp = require("gulp");
 const rollup = require("rollup");
 const http = require("http");
+const path = require("path");
+const fs = require("fs-extra");
 const log = require("fancy-log");
 const { string } = require("rollup-plugin-string");
 const handler = require("serve-handler");
@@ -10,6 +12,7 @@ const babel = require("rollup-plugin-babel");
 const babelTypescript = require("@babel/preset-typescript");
 const babelDecorators = require("@babel/plugin-proposal-decorators");
 const babelClassProperties = require("@babel/plugin-proposal-class-properties");
+const entrypointHashmanifest = require("rollup-plugin-entrypoint-hashmanifest");
 
 const { nodeResolve } = require("@rollup/plugin-node-resolve");
 const gzipPlugin = require("rollup-plugin-gzip");
@@ -45,6 +48,7 @@ const DevelopPlugins = [
     extensions,
     exclude: [require.resolve("@mdi/js/mdi.js")],
   }),
+  entrypointHashmanifest({ manifestName: "./hacs_frontend/manifest.json" }),
 ];
 
 const BuildPlugins = DevelopPlugins.concat([
@@ -54,16 +58,19 @@ const BuildPlugins = DevelopPlugins.concat([
   gzipPlugin.default(),
 ]);
 
-const DebugPlugins = DevelopPlugins.concat([gzipPlugin.default()]);
-
 const inputconfig = {
   input: "./src/main.ts",
   plugins: DevelopPlugins,
 };
-const outputconfig = {
-  file: "./hacs_frontend/main.js",
-  format: "iife",
-  intro: "const __DEMO__ = false;",
+const outputconfig = (isDev) => {
+  return {
+    dir: "./hacs_frontend/",
+    chunkFileNames: !isDev ? "c.[hash].js" : "[name]-dev.js",
+    assetFileNames: !isDev ? "a.[hash].js" : "[name]-dev.js",
+    entryFileNames: "e.[hash].js",
+    format: "es",
+    intro: "const __DEMO__ = false;",
+  };
 };
 
 function createServer() {
@@ -74,17 +81,21 @@ function createServer() {
   });
 
   server.listen(5000, true, () => {
-    log.info("File will be served to http://127.0.0.1:5000/main.js");
+    log.info("File will be served to http://127.0.0.1:5000/entrypoint.js");
   });
 }
 
 gulp.task("rollup-develop", () => {
+  isDev = true;
   const watcher = rollup.watch({
     input: inputconfig.input,
     plugins: inputconfig.plugins,
-    output: outputconfig,
+    output: outputconfig(true),
     watch: {
       include: ["./src/**"],
+      chokidar: {
+        usePolling: true,
+      },
     },
   });
 
@@ -104,6 +115,7 @@ gulp.task("rollup-develop", () => {
         log("You can now use the generated file");
         log("A new file will be generated if you change something");
         first = false;
+        writeEntrypoint();
       }
     } else if (event.code === "ERROR") {
       log.error(event.error);
@@ -114,14 +126,24 @@ gulp.task("rollup-develop", () => {
 gulp.task("rollup-build", async function (task) {
   inputconfig.plugins = BuildPlugins;
   const bundle = await rollup.rollup(inputconfig);
-  await bundle.write(outputconfig);
+  await bundle.write(outputconfig(false));
+  writeEntrypoint();
   task();
 });
 
-gulp.task("rollup-build-debug", async function (task) {
-  inputconfig.plugins = DebugPlugins;
-  outputconfig.file = "./hacs_frontend/debug.js";
-  const bundle = await rollup.rollup(inputconfig);
-  await bundle.write(outputconfig);
-  task();
-});
+function writeEntrypoint() {
+  const entrypointManifest = require(path.resolve("./hacs_frontend/manifest.json"));
+  fs.writeFileSync(
+    path.resolve("./hacs_frontend/entrypoint.js"),
+    `
+try {
+  new Function("import('/hacsfiles/frontend/${entrypointManifest["./src/main.ts"]}')")();
+} catch (err) {
+  var el = document.createElement('script');
+  el.src = '/hacsfiles/frontend/${entrypointManifest["./src/main.ts"]}';
+  document.body.appendChild(el);
+}
+  `,
+    { encoding: "utf-8" }
+  );
+}
diff --git a/src/components/dialogs/hacs-add-repository-dialog.ts b/src/components/dialogs/hacs-add-repository-dialog.ts
index 220570b3..ff8ef8c2 100644
--- a/src/components/dialogs/hacs-add-repository-dialog.ts
+++ b/src/components/dialogs/hacs-add-repository-dialog.ts
@@ -1,22 +1,23 @@
+import { mdiGithub } from "@mdi/js";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
 import "@polymer/paper-item/paper-icon-item";
 import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
 import "@polymer/paper-listbox/paper-listbox";
-import memoizeOne from "memoize-one";
-import { customElement, html, TemplateResult, css, property, PropertyValues } from "lit-element";
+import { css, customElement, html, property, PropertyValues, TemplateResult } from "lit-element";
 import { classMap } from "lit-html/directives/class-map";
-import { HacsDialogBase } from "./hacs-dialog-base";
+import memoizeOne from "memoize-one";
+import "../../../homeassistant-frontend/src/common/search/search-input";
+import "../../../homeassistant-frontend/src/components/ha-svg-icon";
 import { Repository } from "../../data/common";
-import { mdiGithub } from "@mdi/js";
 import { localize } from "../../localize/localize";
 import { activePanel } from "../../panels/hacs-sections";
+import { scrollBarStyle, searchStyles } from "../../styles/element-styles";
 import { filterRepositoriesByInput } from "../../tools/filter-repositories-by-input";
-import { searchStyles, scrollBarStyle } from "../../styles/element-styles";
 import "../hacs-chip";
 import "../hacs-filter";
 import { hacsIcon } from "../hacs-icon";
-import "../../../homeassistant-frontend/src/common/search/search-input";
-import "../../../homeassistant-frontend/src/components/ha-svg-icon";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-add-repository-dialog")
 export class HacsAddRepositoryDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-custom-repositories-dialog.ts b/src/components/dialogs/hacs-custom-repositories-dialog.ts
index 7b57d7ee..b502a184 100644
--- a/src/components/dialogs/hacs-custom-repositories-dialog.ts
+++ b/src/components/dialogs/hacs-custom-repositories-dialog.ts
@@ -1,24 +1,22 @@
+import { mdiDelete, mdiGithub } from "@mdi/js";
 import "@polymer/paper-item/paper-icon-item";
 import "@polymer/paper-item/paper-item-body";
 import {
+  css,
   customElement,
   html,
-  TemplateResult,
-  css,
   property,
-  query,
   PropertyValues,
+  query,
+  TemplateResult,
 } from "lit-element";
-import { HacsDialogBase } from "./hacs-dialog-base";
-import { scrollBarStyle } from "../../styles/element-styles";
 import "../../../homeassistant-frontend/src/components/ha-svg-icon";
-import { mdiGithub, mdiDelete } from "@mdi/js";
-
-import { repositoryDelete, getRepositories, repositoryAdd } from "../../data/websocket";
-
+import { getRepositories, repositoryAdd, repositoryDelete } from "../../data/websocket";
 import { localize } from "../../localize/localize";
-
+import { scrollBarStyle } from "../../styles/element-styles";
 import "../hacs-icon-button";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-custom-repositories-dialog")
 export class HacsCustomRepositoriesDialog extends HacsDialogBase {
@@ -65,9 +63,7 @@ export class HacsCustomRepositoriesDialog extends HacsDialogBase {
                   three-line
                   >${repo.name}
                   <div secondary>${repo.description}</div>
-                  <div secondary>
-                    Category: ${repo.category}
-                  </div></paper-item-body
+                  <div secondary>Category: ${repo.category}</div></paper-item-body
                 ><hacs-icon-button
                   class="delete"
                   .icon=${mdiDelete}
diff --git a/src/components/dialogs/hacs-dialog-base.ts b/src/components/dialogs/hacs-dialog-base.ts
index c80ef382..128387d3 100644
--- a/src/components/dialogs/hacs-dialog-base.ts
+++ b/src/components/dialogs/hacs-dialog-base.ts
@@ -1,15 +1,14 @@
 import { LitElement, property, PropertyValues } from "lit-element";
 import { HomeAssistant, Route } from "../../../homeassistant-frontend/src/types";
-import { Hacs } from "../../data/hacs";
-
 import {
+  Configuration,
   Critical,
   LovelaceResource,
-  Status,
-  Configuration,
-  Repository,
   RemovedRepository,
+  Repository,
+  Status,
 } from "../../data/common";
+import { Hacs } from "../../data/hacs";
 
 export class HacsDialogBase extends LitElement {
   @property({ attribute: false }) public configuration: Configuration;
diff --git a/src/components/dialogs/hacs-dialog.ts b/src/components/dialogs/hacs-dialog.ts
index 1e87ec90..ddc14423 100644
--- a/src/components/dialogs/hacs-dialog.ts
+++ b/src/components/dialogs/hacs-dialog.ts
@@ -1,10 +1,9 @@
-import { css, customElement, html, TemplateResult, property } from "lit-element";
-import { HacsDialogBase } from "./hacs-dialog-base";
-import { hacsStyleDialog, scrollBarStyle } from "../../styles/element-styles";
-import { HacsStyles } from "../../styles//hacs-common-style";
+import { css, customElement, html, property, TemplateResult } from "lit-element";
 import { createCloseHeading } from "../../../homeassistant-frontend/src/components/ha-dialog";
-
+import { HacsStyles } from "../../styles//hacs-common-style";
+import { hacsStyleDialog, scrollBarStyle } from "../../styles/element-styles";
 import "../hacs-icon-button";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-dialog")
 export class HacsDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-event-dialog.ts b/src/components/dialogs/hacs-event-dialog.ts
index b47abd13..7627e463 100644
--- a/src/components/dialogs/hacs-event-dialog.ts
+++ b/src/components/dialogs/hacs-event-dialog.ts
@@ -1,15 +1,18 @@
 import { customElement, html, property, TemplateResult } from "lit-element";
-import "./hacs-about-dialog";
-import "./hacs-add-repository-dialog";
-import "./hacs-custom-repositories-dialog";
 import { HacsDialogBase } from "./hacs-dialog-base";
-import "./hacs-generic-dialog";
-import "./hacs-install-dialog";
-import "./hacs-navigate-dialog";
-import "./hacs-reload-dialog";
-import "./hacs-removed-dialog";
-import "./hacs-repository-info-dialog";
-import "./hacs-update-dialog";
+
+const DIALOG = {
+  about: () => import("./hacs-about-dialog"),
+  "add-repository": () => import("./hacs-add-repository-dialog"),
+  "custom-repositories": () => import("./hacs-custom-repositories-dialog"),
+  generic: () => import("./hacs-generic-dialog"),
+  install: () => import("./hacs-install-dialog"),
+  navigate: () => import("./hacs-navigate-dialog"),
+  reload: () => import("./hacs-reload-dialog"),
+  removed: () => import("./hacs-removed-dialog"),
+  update: () => import("./hacs-update-dialog"),
+  "repository-info": () => import("./hacs-repository-info-dialog"),
+};
 
 @customElement("hacs-event-dialog")
 export class HacsEventDialog extends HacsDialogBase {
@@ -17,7 +20,10 @@ export class HacsEventDialog extends HacsDialogBase {
 
   protected render(): TemplateResult | void {
     if (!this.active) return html``;
-    const el: any = document.createElement(`hacs-${this.params.type || "generic"}-dialog`);
+    const dialog = this.params.type || "generic";
+    DIALOG[dialog]();
+
+    const el: any = document.createElement(`hacs-${dialog}-dialog`);
     el.active = true;
     el.hass = this.hass;
     el.hacs = this.hacs;
diff --git a/src/components/dialogs/hacs-generic-dialog.ts b/src/components/dialogs/hacs-generic-dialog.ts
index 6ad08549..daaf1fde 100644
--- a/src/components/dialogs/hacs-generic-dialog.ts
+++ b/src/components/dialogs/hacs-generic-dialog.ts
@@ -1,9 +1,9 @@
-import { customElement, html, TemplateResult, property } from "lit-element";
+import { customElement, html, property, TemplateResult } from "lit-element";
 import memoizeOne from "memoize-one";
-
 import { Repository } from "../../data/common";
-import { HacsDialogBase } from "./hacs-dialog-base";
 import { markdown } from "../../tools/markdown/markdown";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-generic-dialog")
 export class HacsGenericDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-install-dialog.ts b/src/components/dialogs/hacs-install-dialog.ts
index 72c0c0e2..76d27f70 100644
--- a/src/components/dialogs/hacs-install-dialog.ts
+++ b/src/components/dialogs/hacs-install-dialog.ts
@@ -1,34 +1,32 @@
 import "@polymer/paper-item/paper-icon-item";
 import "@polymer/paper-item/paper-item-body";
-import memoizeOne from "memoize-one";
-
 import {
   css,
   CSSResultArray,
   customElement,
   html,
-  TemplateResult,
   property,
   PropertyValues,
   query,
+  TemplateResult,
 } from "lit-element";
-
+import memoizeOne from "memoize-one";
+import "../../../homeassistant-frontend/src/components/ha-circular-progress";
+import "../../../homeassistant-frontend/src/components/ha-formfield";
+import "../../../homeassistant-frontend/src/components/ha-switch";
+import { Repository } from "../../data/common";
 import {
-  repositoryToggleBeta,
-  repositoryInstall,
   getRepositories,
+  repositoryInstall,
   repositoryInstallVersion,
+  repositoryToggleBeta,
+  repositoryUpdate,
 } from "../../data/websocket";
-import { updateLovelaceResources } from "../../tools/update-lovelace-resources";
 import { localize } from "../../localize/localize";
-import { HacsDialogBase } from "./hacs-dialog-base";
-import { Repository } from "../../data/common";
-import { repositoryUpdate } from "../../data/websocket";
-import "../../../homeassistant-frontend/src/components/ha-switch";
-import "../../../homeassistant-frontend/src/components/ha-formfield";
-import "../../../homeassistant-frontend/src/components/ha-circular-progress";
-import "./hacs-dialog";
+import { updateLovelaceResources } from "../../tools/update-lovelace-resources";
 import "../hacs-link";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-install-dialog")
 export class HacsInstallDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-navigate-dialog.ts b/src/components/dialogs/hacs-navigate-dialog.ts
index 51230aa0..b38f1cd6 100644
--- a/src/components/dialogs/hacs-navigate-dialog.ts
+++ b/src/components/dialogs/hacs-navigate-dialog.ts
@@ -1,9 +1,8 @@
-import { customElement, html, TemplateResult, internalProperty, css, property } from "lit-element";
-
-import { HacsDialogBase } from "./hacs-dialog-base";
-import "./hacs-dialog";
-import "../../../homeassistant-frontend/src/components/ha-bar";
+import { css, customElement, html, internalProperty, property, TemplateResult } from "lit-element";
 import { navigate } from "../../../homeassistant-frontend/src/common/navigate";
+import "../../../homeassistant-frontend/src/components/ha-bar";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-navigate-dialog")
 export class HacsNavigateDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-reload-dialog.ts b/src/components/dialogs/hacs-reload-dialog.ts
index 8995b6a3..aa62b0d6 100644
--- a/src/components/dialogs/hacs-reload-dialog.ts
+++ b/src/components/dialogs/hacs-reload-dialog.ts
@@ -1,8 +1,7 @@
 import { customElement, html, TemplateResult } from "lit-element";
-
-import { HacsDialogBase } from "./hacs-dialog-base";
-import "./hacs-dialog";
 import { localize } from "../../localize/localize";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-reload-dialog")
 export class HacsReloadDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-removed-dialog.ts b/src/components/dialogs/hacs-removed-dialog.ts
index 84e0c6c8..36e5c948 100644
--- a/src/components/dialogs/hacs-removed-dialog.ts
+++ b/src/components/dialogs/hacs-removed-dialog.ts
@@ -1,9 +1,8 @@
-import { customElement, html, TemplateResult, property, css } from "lit-element";
-
+import { css, customElement, html, property, TemplateResult } from "lit-element";
 import { Repository } from "../../data/common";
-import { HacsDialogBase } from "./hacs-dialog-base";
-import { repositoryUninstall, deleteResource, fetchResources } from "../../data/websocket";
+import { deleteResource, fetchResources, repositoryUninstall } from "../../data/websocket";
 import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-removed-dialog")
 export class HacsRemovedDialog extends HacsDialogBase {
diff --git a/src/components/dialogs/hacs-repository-info-dialog.ts b/src/components/dialogs/hacs-repository-info-dialog.ts
index 3a3e8d03..d766d8b0 100644
--- a/src/components/dialogs/hacs-repository-info-dialog.ts
+++ b/src/components/dialogs/hacs-repository-info-dialog.ts
@@ -1,16 +1,16 @@
-import { customElement, html, TemplateResult, property, PropertyValues, css } from "lit-element";
+import { mdiAccount, mdiArrowDownBold, mdiCube, mdiExclamationThick, mdiStar } from "@mdi/js";
+import { css, customElement, html, property, PropertyValues, TemplateResult } from "lit-element";
+import { classMap } from "lit-html/directives/class-map";
 import memoizeOne from "memoize-one";
-import { mdiCube, mdiAccount, mdiStar, mdiExclamationThick, mdiArrowDownBold } from "@mdi/js";
-import { HacsDialogBase } from "./hacs-dialog-base";
 import { Repository } from "../../data/common";
-import { markdown } from "../../tools/markdown/markdown";
-import { classMap } from "lit-html/directives/class-map";
+import { getRepositories, repositoryUpdate } from "../../data/websocket";
 import { localize } from "../../localize/localize";
 import { scrollBarStyle } from "../../styles/element-styles";
+import { markdown } from "../../tools/markdown/markdown";
 import "../hacs-chip";
 import "../hacs-link";
-
-import { repositoryUpdate, getRepositories } from "../../data/websocket";
+import "./hacs-dialog";
+import { HacsDialogBase } from "./hacs-dialog-base";
 
 @customElement("hacs-repository-info-dialog")
 export class HacsRepositoryDialog extends HacsDialogBase {
diff --git a/src/hacs-router.ts b/src/hacs-router.ts
index c6f56b7f..638cb264 100644
--- a/src/hacs-router.ts
+++ b/src/hacs-router.ts
@@ -1,25 +1,20 @@
 import { customElement, property } from "lit-element";
+import { listenMediaQuery } from "../homeassistant-frontend/src/common/dom/media_query";
 import {
   HassRouterPage,
   RouterOptions,
 } from "../homeassistant-frontend/src/layouts/hass-router-page";
 import { HomeAssistant, Route } from "../homeassistant-frontend/src/types";
-import { listenMediaQuery } from "../homeassistant-frontend/src/common/dom/media_query";
-
 import {
   Configuration,
   Critical,
   LovelaceResource,
-  Repository,
   RemovedRepository,
+  Repository,
   Status,
 } from "./data/common";
-import { sectionsEnabled } from "./panels/hacs-sections";
 import { Hacs } from "./data/hacs";
 
-import "./panels/hacs-entry-panel";
-import "./panels/hacs-store-panel";
-
 @customElement("hacs-router")
 class HacsRouter extends HassRouterPage {
   @property({ attribute: false }) public hacs?: Hacs;
@@ -64,15 +59,19 @@ class HacsRouter extends HassRouterPage {
     routes: {
       entry: {
         tag: "hacs-entry-panel",
+        load: () => import("./panels/hacs-entry-panel"),
       },
       integrations: {
         tag: "hacs-store-panel",
+        load: () => import("./panels/hacs-store-panel"),
       },
       frontend: {
         tag: "hacs-store-panel",
+        load: () => import("./panels/hacs-store-panel"),
       },
       automation: {
         tag: "hacs-store-panel",
+        load: () => import("./panels/hacs-store-panel"),
       },
     },
   };
diff --git a/src/main.ts b/src/main.ts
index 68c3408d..6bf2e7c8 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,19 +1,21 @@
-import { customElement, html, property, PropertyValues, query, TemplateResult } from "lit-element";
-
-import { HomeAssistant, Route } from "../homeassistant-frontend/src/types";
-import { navigate } from "../homeassistant-frontend/src/common/navigate";
+import { customElement, html, property, query, TemplateResult } from "lit-element";
+import { atLeastVersion } from "../homeassistant-frontend/src/common/config/version";
 import { applyThemesOnElement } from "../homeassistant-frontend/src/common/dom/apply_themes_on_element";
+import { navigate } from "../homeassistant-frontend/src/common/navigate";
+import { makeDialogManager } from "../homeassistant-frontend/src/dialogs/make-dialog-manager";
+import { ProvideHassLitMixin } from "../homeassistant-frontend/src/mixins/provide-hass-lit-mixin";
 import "../homeassistant-frontend/src/resources/ha-style";
-import { atLeastVersion } from "../homeassistant-frontend/src/common/config/version";
+import { HomeAssistant, Route } from "../homeassistant-frontend/src/types";
+import "./components/dialogs/hacs-event-dialog";
 import {
   Configuration,
   Critical,
+  HacsDialogEvent,
   LocationChangedEvent,
   LovelaceResource,
   RemovedRepository,
   Repository,
   Status,
-  HacsDialogEvent,
 } from "./data/common";
 import {
   getConfiguration,
@@ -23,17 +25,16 @@ import {
   getRepositories,
   getStatus,
 } from "./data/websocket";
-import { hacsStyleVariables } from "./styles/variables";
-import { HacsStyles } from "./styles/hacs-common-style";
 import { HacsElement } from "./hacs";
 import "./hacs-router";
-import "./components/dialogs/hacs-event-dialog";
+import { HacsStyles } from "./styles/hacs-common-style";
+import { hacsStyleVariables } from "./styles/variables";
 
 @customElement("hacs-frontend")
-class HacsFrontend extends HacsElement {
+class HacsFrontend extends ProvideHassLitMixin(HacsElement) {
+  @property({ attribute: false }) public hass!: HomeAssistant;
   @property({ attribute: false }) public configuration: Configuration;
   @property({ attribute: false }) public critical!: Critical[];
-  @property({ attribute: false }) public hass!: HomeAssistant;
   @property({ attribute: false }) public lovelace: LovelaceResource[];
   @property({ attribute: false }) public narrow!: boolean;
   @property({ attribute: false }) public removed: RemovedRepository[];
@@ -44,8 +45,8 @@ class HacsFrontend extends HacsElement {
   @query("#hacs-dialog") private _hacsDialog?: any;
   @query("#hacs-dialog-secondary") private _hacsDialogSecondary?: any;
 
-  public async connectedCallback() {
-    super.connectedCallback();
+  protected firstUpdated(changedProps) {
+    super.firstUpdated(changedProps);
     this.addEventListener("hacs-location-changed", (e) =>
       this._setRoute(e as LocationChangedEvent)
     );
@@ -76,7 +77,13 @@ class HacsFrontend extends HacsElement {
       "lovelace_updated"
     );
 
-    await this._updateProperties();
+    makeDialogManager(this, this.shadowRoot!);
+    this._updateProperties();
+    if (this.route.path === "") {
+      navigate(this, "/hacs/entry", true);
+    }
+
+    this._applyTheme();
   }
 
   private async _updateProperties(prop: string = "all") {
@@ -125,16 +132,6 @@ class HacsFrontend extends HacsElement {
     }
   }
 
-  protected firstUpdated(changedProps: PropertyValues) {
-    super.firstUpdated(changedProps);
-
-    if (this.route.path === "") {
-      navigate(this, "/hacs/entry", true);
-    }
-
-    this._applyTheme();
-  }
-
   protected render(): TemplateResult | void {
     if (!this.hass || !this.hacs) return html``;
     return html`
diff --git a/src/panels/hacs-entry-panel.ts b/src/panels/hacs-entry-panel.ts
index 68115815..effeaac7 100644
--- a/src/panels/hacs-entry-panel.ts
+++ b/src/panels/hacs-entry-panel.ts
@@ -1,3 +1,4 @@
+import { mdiAlertCircle, mdiHomeAssistant, mdiOpenInNew } from "@mdi/js";
 import "@polymer/app-layout/app-header-layout/app-header-layout";
 import "@polymer/app-layout/app-header/app-header";
 import "@polymer/app-layout/app-toolbar/app-toolbar";
@@ -9,35 +10,30 @@ import {
   customElement,
   html,
   LitElement,
-  TemplateResult,
   property,
+  TemplateResult,
 } from "lit-element";
-import { mdiAlertCircle, mdiHomeAssistant, mdiOpenInNew } from "@mdi/js";
-
-import { haStyle } from "../../homeassistant-frontend/src/resources/styles";
-import { HomeAssistant, Route } from "../../homeassistant-frontend/src/types";
-
+import { isComponentLoaded } from "../../homeassistant-frontend/src/common/config/is_component_loaded";
 import "../../homeassistant-frontend/src/components/ha-card";
-import "../../homeassistant-frontend/src/components/ha-svg-icon";
 import "../../homeassistant-frontend/src/components/ha-menu-button";
+import "../../homeassistant-frontend/src/components/ha-svg-icon";
 import "../../homeassistant-frontend/src/panels/config/ha-config-section";
-
+import { haStyle } from "../../homeassistant-frontend/src/resources/styles";
+import { HomeAssistant, Route } from "../../homeassistant-frontend/src/types";
+import "../components/hacs-section-navigation";
 import {
-  Status,
+  Configuration,
+  LovelaceResource,
   Message,
+  RemovedRepository,
   Repository,
-  LovelaceResource,
-  Configuration,
   sortRepositoriesByName,
-  RemovedRepository,
+  Status,
 } from "../data/common";
+import { Hacs } from "../data/hacs";
+import { localize } from "../localize/localize";
 import { HacsStyles } from "../styles/hacs-common-style";
 import { getMessages } from "../tools/get-messages";
-import { localize } from "../localize/localize";
-import { Hacs } from "../data/hacs";
-
-import "../components/hacs-section-navigation";
-import { isComponentLoaded } from "../../homeassistant-frontend/src/common/config/is_component_loaded";
 
 @customElement("hacs-entry-panel")
 export class HacsEntryPanel extends LitElement {
@@ -91,9 +87,7 @@ export class HacsEntryPanel extends LitElement {
           </app-toolbar>
         </app-header>
         <ha-config-section .narrow=${this.narrow} .isWide=${this.isWide}>
-          <div slot="header">
-            ${this.narrow ? "HACS" : "Home Assistant Community Store"}
-          </div>
+          <div slot="header">${this.narrow ? "HACS" : "Home Assistant Community Store"}</div>
 
           <div slot="introduction">
             ${this.isWide || (this.hacs.updates.length === 0 && this.hacs.messages?.length === 0)
@@ -145,9 +139,7 @@ export class HacsEntryPanel extends LitElement {
                     <ha-svg-icon .path=${mdiHomeAssistant} slot="item-icon"></ha-svg-icon>
                     <paper-item-body two-line>
                       ${localize(`sections.addon.title`)}
-                      <div secondary>
-                        ${localize(`sections.addon.description`)}
-                      </div>
+                      <div secondary>${localize(`sections.addon.description`)}</div>
                     </paper-item-body>
                     <ha-svg-icon right .path=${mdiOpenInNew}></ha-svg-icon>
                   </paper-icon-item>
@@ -160,9 +152,7 @@ export class HacsEntryPanel extends LitElement {
               <ha-svg-icon .path=${mdiAlertCircle} slot="item-icon"></ha-svg-icon>
               <paper-item-body two-line>
                 ${localize(`sections.about.title`)}
-                <div secondary>
-                  ${localize(`sections.about.description`)}
-                </div>
+                <div secondary>${localize(`sections.about.description`)}</div>
               </paper-item-body>
             </paper-icon-item>
           </ha-card>
diff --git a/src/panels/hacs-sections.ts b/src/panels/hacs-sections.ts
index ace0fc56..fe9e9b18 100644
--- a/src/panels/hacs-sections.ts
+++ b/src/panels/hacs-sections.ts
@@ -1,5 +1,5 @@
 import memoizeOne from "memoize-one";
-import { mdiPuzzle, mdiPalette, mdiRobot, mdiHomeAssistant } from "@mdi/js";
+import { mdiPuzzle, mdiPalette, mdiRobot } from "@mdi/js";
 
 import { Route } from "../../homeassistant-frontend/src/types";
 
diff --git a/src/panels/hacs-store-panel.ts b/src/panels/hacs-store-panel.ts
index b09fd3df..b4a839b3 100644
--- a/src/panels/hacs-store-panel.ts
+++ b/src/panels/hacs-store-panel.ts
@@ -1,23 +1,22 @@
-import { LitElement, customElement, property, html, css, TemplateResult } from "lit-element";
-import memoizeOne from "memoize-one";
 import "@material/mwc-fab";
 import { mdiPlus } from "@mdi/js";
-import { HomeAssistant, Route } from "../../homeassistant-frontend/src/types";
-import "../../homeassistant-frontend/src/layouts/hass-tabs-subpage";
+import { css, customElement, html, LitElement, property, TemplateResult } from "lit-element";
+import memoizeOne from "memoize-one";
 import "../../homeassistant-frontend/src/common/search/search-input";
-import { Repository } from "../data/common";
-
-import "../components/hacs-repository-card";
-import "../components/hacs-filter";
+import "../../homeassistant-frontend/src/components/ha-card";
+import "../../homeassistant-frontend/src/layouts/hass-tabs-subpage";
+import { HomeAssistant, Route } from "../../homeassistant-frontend/src/types";
 import "../components/hacs-fab";
+import "../components/hacs-filter";
+import "../components/hacs-repository-card";
 import "../components/hacs-tabbed-menu";
-
+import { Repository } from "../data/common";
+import { Hacs } from "../data/hacs";
 import { localize } from "../localize/localize";
+import { fabStyles, hassTabsSubpage, scrollBarStyle, searchStyles } from "../styles/element-styles";
 import { HacsStyles } from "../styles/hacs-common-style";
-import { hassTabsSubpage, fabStyles, searchStyles, scrollBarStyle } from "../styles/element-styles";
-import { activePanel } from "./hacs-sections";
 import { filterRepositoriesByInput } from "../tools/filter-repositories-by-input";
-import { Hacs } from "../data/hacs";
+import { activePanel } from "./hacs-sections";
 
 @customElement("hacs-store-panel")
 export class HacsStorePanel extends LitElement {
@@ -149,9 +148,7 @@ export class HacsStorePanel extends LitElement {
             </div>`
           : ""}
         ${newRepositories?.length > 10
-          ? html`<div class="new-repositories">
-              ${localize("store.new_repositories_note")}
-            </div>`
+          ? html`<div class="new-repositories">${localize("store.new_repositories_note")}</div>`
           : ""}
         <div class="container ${this.narrow ? "narrow" : ""}">
           ${this.repositories === undefined
diff --git a/yarn.lock b/yarn.lock
index 3ebc8b84..55857cea 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6816,6 +6816,11 @@ rollup-plugin-babel@^4.4.0:
     "@babel/helper-module-imports" "^7.0.0"
     rollup-pluginutils "^2.8.1"
 
+rollup-plugin-entrypoint-hashmanifest@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-entrypoint-hashmanifest/-/rollup-plugin-entrypoint-hashmanifest-0.1.2.tgz#e6f0e0598ab49ec4ff866dbca2321301601832ed"
+  integrity sha512-TCGWj/PghD+EW7I60RwOzakcKWGQM9n7bN5Y4eyR8URsBYOgMtfe1kYQ+7+lfi389cFQHwV9kuYjAJexFbu+XA==
+
 rollup-plugin-gzip@^2.5.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/rollup-plugin-gzip/-/rollup-plugin-gzip-2.5.0.tgz#786650e7bddf86d7f723c205c3e3018ea727388c"