diff --git a/core/src/components/app/app.tsx b/core/src/components/app/app.tsx
index 4772777505..8f18362e08 100644
--- a/core/src/components/app/app.tsx
+++ b/core/src/components/app/app.tsx
@@ -19,6 +19,7 @@ export class App {
   @Element() el: HTMLElement;
 
   @Prop({ context: 'config' }) config: Config;
+  mode: string;
 
   componentWillLoad() {
     this.isDevice = this.config.getBoolean('isDevice', false);
@@ -26,12 +27,11 @@ export class App {
   }
 
   hostData() {
-    const mode = this.config.get('mode');
     const hoverCSS = this.config.getBoolean('hoverCSS', false);
 
     return {
       class: {
-        [mode]: true,
+        [this.mode]: true,
         'enable-hover': hoverCSS
       }
     };