diff --git a/packages/core/linterrors b/packages/core/linterrors
new file mode 100644
index 0000000000..f174414bd0
--- /dev/null
+++ b/packages/core/linterrors
@@ -0,0 +1,123 @@
+
+> @ionic/core@0.0.2-40 tslint /Users/brandyscarney/Documents/git/ionic/packages/core
+> tslint --project .
+
+
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animation-interface.tsx[6, 3]: Interfaces cannot be constructed, only classes. Did you mean `declare class`?
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[144, 9]: Identifier 'fx' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[181, 11]: Identifier 'shouldTrans' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[193, 9]: Identifier 'fxState' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[201, 11]: Identifier 'r' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[202, 11]: Identifier 'num' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[249, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[306, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[316, 9]: Identifier 'self' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[352, 11]: Identifier 'opts' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[374, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[397, 9]: Identifier 'self' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[408, 9]: Identifier 'dur' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[430, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[463, 11]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[485, 9]: Identifier 'self' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[530, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[566, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[584, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[623, 9]: Identifier 'effects' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[624, 9]: Identifier 'nuElements' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[637, 9]: Identifier 'elements' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[644, 13]: Identifier 'fromNum' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[645, 13]: Identifier 'toNum' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[646, 13]: Identifier 'tweenEffect' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[663, 15]: Identifier 'unit' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[671, 15]: Identifier 'prop' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[709, 9]: Identifier 'elements' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[710, 9]: Identifier 'easing' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[711, 9]: Identifier 'durString' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[712, 9]: Identifier 'cssTransform' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[713, 9]: Identifier 'cssTransitionDuration' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[714, 9]: Identifier 'cssTransitionTimingFn' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[764, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[774, 9]: Identifier 'addClasses' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[775, 9]: Identifier 'removeClasses' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[815, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[823, 9]: Identifier 'readFunctions' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[837, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[845, 9]: Identifier 'writeFunctions' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[861, 9]: Identifier 'elements' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[936, 9]: Identifier 'effects' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[942, 13]: Identifier 'propWC' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[981, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1002, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1016, 9]: Identifier 'self' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1026, 9]: Identifier 'stepValue' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1028, 9]: Identifier 'diff' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1061, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1111, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1152, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/animator.tsx[1166, 9]: Identifier 'children' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/constants.ts[3, 7]: Identifier 'css' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/constants.ts[31, 7]: Identifier 'prefix' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/animation-controller/transition-end.ts[6, 7]: Identifier 'opts' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/button/button.tsx[79, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/button/button.tsx[80, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/buttons/buttons.tsx[15, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/datetime/datetime-util.ts[50, 17]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/datetime/datetime-util.ts[251, 9]: Use a conditional expression instead of assigning to 'newData.hour.value' in multiple places.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/datetime/datetime.tsx[318, 9]: Use a conditional expression instead of assigning to 'values' in multiple places.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/datetime/datetime.tsx[526, 7]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/fab-button/fab-button.tsx[42, 42]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/fab-list/fab-list.tsx[18, 9]: Identifier 'timeout' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/gesture/gesture.tsx[276, 22]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/gesture/gesture.tsx[280, 11]: Identifier 'frequency' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/gesture/gesture.tsx[281, 11]: Identifier 'movedY' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/gesture/gesture.tsx[282, 11]: Identifier 'movedX' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/infinite-scroll/infinite-scroll.tsx[133, 5]: Use a conditional expression instead of assigning to 'distanceFromInfinite' in multiple places.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/infinite-scroll/infinite-scroll.tsx[180, 7]: jsdoc is not formatted correctly on this line
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/infinite-scroll/infinite-scroll.tsx[220, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/infinite-scroll/infinite-scroll.tsx[221, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/infinite-scroll/infinite-scroll.tsx[222, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/input/input.tsx[272, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/input/input.tsx[273, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/item/item.tsx[68, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/nav/nav.tsx[856, 7]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/nav/nav.tsx[873, 7]: Use a conditional expression instead of assigning to 'ti.opts.animation' in multiple places.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/nav/nav.tsx[1011, 9]: Identifier 'removeEnd' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/navbar/navbar.tsx[32, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/popover/popover.tsx[118, 55]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/range/range.tsx[340, 12]: redundant double negation in an if statement condition
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/range/range.tsx[348, 12]: redundant double negation in an if statement condition
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/route/test/router-utils.spec.ts[238, 33]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/router-controller/router-utils.ts[178, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/segment/segment.tsx[57, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/segment/segment.tsx[82, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/slides/slides.tsx[16, 11]: 'slideId' is declared but its value is never read.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/slides/slides.tsx[278, 10]: 'debounce' is declared but its value is never read.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/slides/slides.tsx[381, 17]: 'speed' is declared but its value is never read.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/spinner/spinner.tsx[98, 12]: Don't use the comma operator.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/spinner/spinner.tsx[103, 12]: Don't use the comma operator.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/split-pane/split-pane.tsx[70, 11]: Identifier 'child' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/split-pane/split-pane.tsx[71, 11]: Identifier 'isMain' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/tabs/tabs.tsx[123, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/tabs/tabs.tsx[124, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/tabs/tabs.tsx[125, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/textarea/textarea.tsx[212, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/textarea/textarea.tsx[213, 1]: asterisks in jsdoc must be aligned
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/toast/toast.tsx[183, 9]: 'userCssClass' is declared but its value is never read.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/components/toolbar/toolbar.tsx[45, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/config-controller.ts[21, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/dom-controller.ts[30, 14]: Assignments in conditional expressions are forbidden
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/dom-controller.ts[35, 14]: Assignments in conditional expressions are forbidden
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/dom-controller.ts[47, 9]: Assignments in conditional expressions are forbidden
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/platform-configs.ts[70, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/platform-configs.ts[72, 9]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/platform-configs.ts[88, 7]: Identifier 'regex' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/platform-configs.ts[89, 7]: Identifier 'results' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/global/test/dom-controller.spec.ts[29, 7]: 'dom' is declared but its value is never read.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[56, 24]: block is empty
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[62, 9]: Identifier 'changedTouches' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[79, 9]: Identifier 'changedTouches' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[81, 11]: Identifier 'touch' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[97, 9]: Identifier 'changedTouches' is never reassigned; use 'const' instead of 'let'.
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/helpers.ts[157, 5]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+ERROR: /Users/brandyscarney/Documents/git/ionic/packages/core/src/utils/theme.ts[32, 3]: Expected a 'for-of' loop instead of a 'for' loop with this simple iteration
+
diff --git a/packages/core/package.json b/packages/core/package.json
index f3dd49f5a7..246206e393 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -23,7 +23,7 @@
     "sass-lint": "^1.12.1",
     "selenium-webdriver": "^3.6.0",
     "tslint": "^5.8.0",
-    "tslint-ionic-rules": "0.0.11",
+    "tslint-ionic-rules": "0.0.12",
     "yargs": "^10.0.3"
   },
   "scripts": {
diff --git a/packages/core/src/components/action-sheet/action-sheet.tsx b/packages/core/src/components/action-sheet/action-sheet.tsx
index 7ae7a4913a..c840dc976e 100644
--- a/packages/core/src/components/action-sheet/action-sheet.tsx
+++ b/packages/core/src/components/action-sheet/action-sheet.tsx
@@ -94,17 +94,17 @@ export class ActionSheet {
   /**
    * If true, the action-sheet will be dismissed when the backdrop is clicked.
    */
-  @Prop() enableBackdropDismiss: boolean = true;
+  @Prop() enableBackdropDismiss = true;
 
   /**
    * If true, action-sheet will become translucent. Requires support for backdrop-filters.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   /**
    * Enable action-sheet animations. If false, action-sheet will not animate in
    */
-  @Prop() willAnimate: boolean = true;
+  @Prop() willAnimate = true;
 
   /**
    * Animation to use when the action-sheet is created
@@ -209,12 +209,12 @@ export class ActionSheet {
   }
 
   buttonClass(button: ActionSheetButton): CssClassMap {
-    let buttonClass: string[] = !button.role
+    const buttonClass: string[] = !button.role
       ? ['action-sheet-button']
       : [`action-sheet-button`, `action-sheet-${button.role}`];
 
     if (button.cssClass) {
-      let customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
+      const customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
       buttonClass.push(customClass);
     }
 
@@ -256,7 +256,7 @@ export class ActionSheet {
     }
 
     let cancelButton: ActionSheetButton;
-    let buttons = this.buttons
+    const buttons = this.buttons
       .map(b => {
         if (typeof b === 'string') {
           b = { text: b };
diff --git a/packages/core/src/components/alert/alert.tsx b/packages/core/src/components/alert/alert.tsx
index 8e2ec936c4..32c36fca0e 100644
--- a/packages/core/src/components/alert/alert.tsx
+++ b/packages/core/src/components/alert/alert.tsx
@@ -100,17 +100,17 @@ export class Alert {
   /**
    * If true, the alert will be dismissed when the backdrop is clicked.
    */
-  @Prop() enableBackdropDismiss: boolean = true;
+  @Prop() enableBackdropDismiss = true;
 
   /**
    * If true, alert will become translucent. Requires support for backdrop-filters.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   /**
    * Enable alert animations. If false, alert will not animate in
    */
-  @Prop() willAnimate: boolean = true;
+  @Prop() willAnimate = true;
 
   /**
    * Animation to be used when the alert is shown
@@ -148,7 +148,7 @@ export class Alert {
       return playAnimationAsync(animation);
     }).then((animation) => {
       animation.destroy();
-      const firstInput = this.el.querySelector('[tabindex]') as HTMLElement;
+      const firstInput = this.el.querySelector('[tabindex]');
       if (firstInput) {
         firstInput.focus();
       }
@@ -286,10 +286,10 @@ export class Alert {
   }
 
   buttonClass(button: AlertButton): CssClassMap {
-    let buttonClass: string[] = ['alert-button'];
+    const buttonClass: string[] = ['alert-button'];
 
     if (button.cssClass) {
-      let customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
+      const customClass = button.cssClass.split(' ').filter(b => b.trim() !== '').join(' ');
       buttonClass.push(customClass);
     }
 
@@ -412,7 +412,7 @@ export class Alert {
 
     this.inputs = this.inputs
       .map((i, index) => {
-        let r: AlertInput = {
+        const r: AlertInput = {
           type: i.type || 'text',
           name: i.name ? i.name : index + '',
           placeholder: i.placeholder ? i.placeholder : '',
diff --git a/packages/core/src/components/animation-controller/animator.tsx b/packages/core/src/components/animation-controller/animator.tsx
index 58896ed4ef..d8bca94352 100644
--- a/packages/core/src/components/animation-controller/animator.tsx
+++ b/packages/core/src/components/animation-controller/animator.tsx
@@ -30,18 +30,18 @@ export class Animator {
   private _timerId: any;
   private _unregisterTrnsEnd: Function;
   private _writeCallbacks: Function[];
-  private _destroyed: boolean = false;
+  private _destroyed = false;
 
   parent: Animator;
   opts: AnimationOptions;
-  hasChildren: boolean = false;
-  isPlaying: boolean = false;
-  hasCompleted: boolean = false;
+  hasChildren = false;
+  isPlaying = false;
+  hasCompleted = false;
 
   addElement(elm: Node|Node[]|NodeList): Animator {
     if (elm) {
       if ((elm as NodeList).length) {
-        for (var i = 0; i < (elm as NodeList).length; i++) {
+        for (let i = 0; i < (elm as NodeList).length; i++) {
           this._addElm((elm as any)[i]);
         }
 
@@ -141,7 +141,7 @@ export class Animator {
    * Add the "to" value for a specific property.
    */
   to(prop: string, val: any, clearProperyAfterTransition?: boolean): Animator {
-    var fx = this._addProp('to', prop, val);
+    let fx = this._addProp('to', prop, val);
 
     if (clearProperyAfterTransition) {
       // if this effect is a transform then clear the transform effect
@@ -174,11 +174,11 @@ export class Animator {
   }
 
   private _addProp(state: string, prop: string, val: any): EffectProperty {
-    var fxProp = this._getProp(prop);
+    let fxProp = this._getProp(prop);
 
     if (!fxProp) {
       // first time we've see this EffectProperty
-      var shouldTrans = (TRANSFORM_PROPS[prop] === 1);
+      let shouldTrans = (TRANSFORM_PROPS[prop] === 1);
       fxProp = {
         effectName: prop,
         trans: shouldTrans,
@@ -190,7 +190,7 @@ export class Animator {
     }
 
     // add from/to EffectState to the EffectProperty
-    var fxState: EffectState = {
+    let fxState: EffectState = {
       val: val,
       num: null,
       effectUnit: '',
@@ -198,8 +198,8 @@ export class Animator {
     fxProp[state] = fxState;
 
     if (typeof val === 'string' && val.indexOf(' ') < 0) {
-      var r = val.match(CSS_VALUE_REGEX);
-      var num = parseFloat(r[1]);
+      let r = val.match(CSS_VALUE_REGEX);
+      let num = parseFloat(r[1]);
 
       if (!isNaN(num)) {
         fxState.num = num;
@@ -246,7 +246,7 @@ export class Animator {
    */
   beforeClearStyles(propertyNames: string[]): Animator {
     this._beforeStyles = this._beforeStyles || {};
-    for (var i = 0; i < propertyNames.length; i++) {
+    for (let i = 0; i < propertyNames.length; i++) {
       this._beforeStyles[propertyNames[i]] = '';
     }
     return this;
@@ -303,7 +303,7 @@ export class Animator {
    */
   afterClearStyles(propertyNames: string[]): Animator {
     this._afterStyles = this._afterStyles || {};
-    for (var i = 0; i < propertyNames.length; i++) {
+    for (let i = 0; i < propertyNames.length; i++) {
       this._afterStyles[propertyNames[i]] = '';
     }
     return this;
@@ -313,7 +313,7 @@ export class Animator {
    * Play the animation.
    */
   play(opts?: PlayOptions) {
-    var self = this;
+    let self = this;
 
     // If the animation was already invalidated (it did finish), do nothing
     if (self._destroyed) {
@@ -349,7 +349,7 @@ export class Animator {
   syncPlay() {
     // If the animation was already invalidated (it did finish), do nothing
     if (!this._destroyed) {
-      var opts = { duration: 0 };
+      let opts = { duration: 0 };
       this._isAsync = false;
       this._clearAsync();
       this._playInit(opts);
@@ -371,8 +371,8 @@ export class Animator {
     this.hasCompleted = false;
     this._hasDur = (this.getDuration(opts) > DURATION_MIN);
 
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._playInit(opts);
     }
@@ -394,7 +394,7 @@ export class Animator {
    * ROOT ANIMATION
    */
   _playDomInspect(opts: PlayOptions) {
-    var self = this;
+    let self = this;
     // fire off all the "before" function that have DOM READS in them
     // elements will be in the DOM, however visibily hidden
     // so we can read their dimensions if need be
@@ -405,7 +405,7 @@ export class Animator {
     // for the root animation only
     // set the async TRANSITION END event
     // and run onFinishes when the transition ends
-    var dur = self.getDuration(opts);
+    let dur = self.getDuration(opts);
     if (self._isAsync) {
       self._asyncEnd(dur, true);
     }
@@ -427,8 +427,8 @@ export class Animator {
    * RECURSION
    */
   _playProgress(opts: PlayOptions) {
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._playProgress(opts);
     }
@@ -460,8 +460,8 @@ export class Animator {
    */
   _playToStep(stepValue: number) {
     if (!this._destroyed) {
-      var children = this._childAnimations;
-      for (var i = 0; i < this._childAnimationTotal; i++) {
+      let children = this._childAnimations;
+      for (let i = 0; i < this._childAnimationTotal; i++) {
         // ******** DOM WRITE ****************
         children[i]._playToStep(stepValue);
       }
@@ -482,7 +482,7 @@ export class Animator {
    * ROOT ANIMATION
    */
   _asyncEnd(dur: number, shouldComplete: boolean) {
-    var self = this;
+    let self = this;
 
     function onTransitionEnd() {
       // congrats! a successful transition completed!
@@ -527,8 +527,8 @@ export class Animator {
    * RECURSION
    */
   _playEnd(stepValue?: number) {
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._playEnd(stepValue);
     }
@@ -563,8 +563,8 @@ export class Animator {
       return true;
     }
 
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       if (children[i]._hasDuration(opts)) {
         return true;
       }
@@ -581,8 +581,8 @@ export class Animator {
       return true;
     }
 
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       if (children[i]._hasDomReads()) {
         return true;
       }
@@ -619,9 +619,9 @@ export class Animator {
    */
   _progress(stepValue: number) {
     // bread 'n butter
-    var val: any;
-    var effects = this._fxProperties;
-    var nuElements = this._elementTotal;
+    let val: any;
+    let effects = this._fxProperties;
+    let nuElements = this._elementTotal;
 
     if (!effects || !nuElements || this._destroyed) {
       return;
@@ -631,19 +631,19 @@ export class Animator {
     if (this._isReverse) {
       stepValue = 1 - stepValue;
     }
-    var i = 0;
-    var j = 0;
-    var finalTransform = '';
-    var elements = this._elements;
-    var fx: EffectProperty;
+    let i = 0;
+    let j = 0;
+    let finalTransform = '';
+    let elements = this._elements;
+    let fx: EffectProperty;
 
     for (i = 0; i < effects.length; i++) {
       fx = effects[i];
 
       if (fx.from && fx.to) {
-        var fromNum = fx.from.num;
-        var toNum = fx.to.num;
-        var tweenEffect = (fromNum !== toNum);
+        let fromNum = fx.from.num;
+        let toNum = fx.to.num;
+        let tweenEffect = (fromNum !== toNum);
 
         if (tweenEffect) {
           this._hasTweenEffect = true;
@@ -659,8 +659,8 @@ export class Animator {
 
         } else if (tweenEffect) {
           // EVERYTHING IN BETWEEN
-          var valNum = (((toNum - fromNum) * stepValue) + fromNum);
-          var unit = fx.to.effectUnit;
+          let valNum = (((toNum - fromNum) * stepValue) + fromNum);
+          let unit = fx.to.effectUnit;
           if (unit === 'px') {
             valNum = Math.round(valNum);
           }
@@ -668,7 +668,7 @@ export class Animator {
         }
 
         if (val !== null) {
-          var prop = fx.effectName;
+          let prop = fx.effectName;
           if (fx.trans) {
             finalTransform += prop + '(' + val + ') ';
 
@@ -706,15 +706,15 @@ export class Animator {
     }
 
     // set the TRANSITION properties inline on the element
-    var elements = this._elements;
-    var easing = (forcedLinearEasing ? 'linear' : this.getEasing());
-    var durString = dur + 'ms';
-    var cssTransform = CSS_PROP.transitionProp;
-    var cssTransitionDuration = CSS_PROP.transitionDurationProp;
-    var cssTransitionTimingFn = CSS_PROP.transitionTimingFnProp;
+    let elements = this._elements;
+    let easing = (forcedLinearEasing ? 'linear' : this.getEasing());
+    let durString = dur + 'ms';
+    let cssTransform = CSS_PROP.transitionProp;
+    let cssTransitionDuration = CSS_PROP.transitionDurationProp;
+    let cssTransitionTimingFn = CSS_PROP.transitionTimingFnProp;
 
-    var eleStyle: any;
-    for (var i = 0; i < this._elementTotal; i++) {
+    let eleStyle: any;
+    for (let i = 0; i < this._elementTotal; i++) {
       eleStyle = elements[i].style;
       if (dur > 0) {
         // ******** DOM WRITE ****************
@@ -760,8 +760,8 @@ export class Animator {
    * RECURSION
    */
   _setBeforeStyles() {
-    var i: number, j: number;
-    var children = this._childAnimations;
+    let i: number, j: number;
+    let children = this._childAnimations;
     for (i = 0; i < this._childAnimationTotal; i++) {
       children[i]._setBeforeStyles();
     }
@@ -771,12 +771,12 @@ export class Animator {
     if (this._isReverse) {
       return;
     }
-    var addClasses = this._beforeAddClasses;
-    var removeClasses = this._beforeRemoveClasses;
+    let addClasses = this._beforeAddClasses;
+    let removeClasses = this._beforeRemoveClasses;
 
-    var elm: HTMLElement;
-    var elementClassList: DOMTokenList;
-    var prop: string;
+    let elm: HTMLElement;
+    let elementClassList: DOMTokenList;
+    let prop: string;
     for (i = 0; i < this._elementTotal; i++) {
       elm = this._elements[i];
       elementClassList = elm.classList;
@@ -812,15 +812,15 @@ export class Animator {
    * RECURSION
    */
   _fireBeforeReadFunc() {
-    var children = this._childAnimations;
-    var i = 0;
+    let children = this._childAnimations;
+    let i = 0;
 
     for (i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM READ ****************
       children[i]._fireBeforeReadFunc();
     }
 
-    var readFunctions = this._readCallbacks;
+    let readFunctions = this._readCallbacks;
     if (readFunctions) {
       for (i = 0; i < readFunctions.length; i++) {
         // ******** DOM READ ****************
@@ -834,15 +834,15 @@ export class Animator {
    * RECURSION
    */
   _fireBeforeWriteFunc() {
-    var children = this._childAnimations;
-    var i = 0;
+    let children = this._childAnimations;
+    let i = 0;
 
     for (i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._fireBeforeWriteFunc();
     }
 
-    var writeFunctions = this._writeCallbacks;
+    let writeFunctions = this._writeCallbacks;
     if (this._writeCallbacks) {
       for (i = 0; i < writeFunctions.length; i++) {
         // ******** DOM WRITE ****************
@@ -855,11 +855,11 @@ export class Animator {
    * DOM WRITE
    */
   _setAfterStyles() {
-    var i: number, j: number;
-    var elm: HTMLElement;
-    var elementClassList: DOMTokenList;
-    var elements = this._elements;
-    var prop: string;
+    let i: number, j: number;
+    let elm: HTMLElement;
+    let elementClassList: DOMTokenList;
+    let elements = this._elements;
+    let prop: string;
 
     for (i = 0; i < this._elementTotal; i++) {
       elm = elements[i];
@@ -931,15 +931,15 @@ export class Animator {
    * NO RECURSION
    */
   _willChange(addWillChange: boolean) {
-    var i = 0;
-    var wc: string[];
-    var effects = this._fxProperties;
-    var willChange: string;
+    let i = 0;
+    let wc: string[];
+    let effects = this._fxProperties;
+    let willChange: string;
 
     if (addWillChange && effects) {
       wc = [];
       for (i = 0; i < effects.length; i++) {
-        var propWC = effects[i].wc;
+        let propWC = effects[i].wc;
         if (propWC === 'webkitTransform') {
           wc.push('transform', '-webkit-transform');
 
@@ -978,8 +978,8 @@ export class Animator {
    * RECURSION
    */
   _progressStart() {
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._progressStart();
     }
@@ -999,8 +999,8 @@ export class Animator {
     // only update if the last update was more than 16ms ago
     stepValue = Math.min(1, Math.max(0, stepValue));
 
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i].progressStep(stepValue);
     }
@@ -1013,7 +1013,7 @@ export class Animator {
    * End the progress animation.
    */
   progressEnd(shouldComplete: boolean, currentStepValue: number, dur: number) {
-    var self = this;
+    let self = this;
     if (dur === undefined) {
       dur = -1;
     }
@@ -1023,9 +1023,9 @@ export class Animator {
       // flip the step value: 0 becomes 1, 1 becomes 0
       currentStepValue = ((currentStepValue * -1) + 1);
     }
-    var stepValue = shouldComplete ? 1 : 0;
+    let stepValue = shouldComplete ? 1 : 0;
 
-    var diff = Math.abs(currentStepValue - stepValue);
+    let diff = Math.abs(currentStepValue - stepValue);
     if (diff < 0.05) {
       dur = 0;
     } else if (dur < 0) {
@@ -1058,8 +1058,8 @@ export class Animator {
    * RECURSION
    */
   _progressEnd(shouldComplete: boolean, stepValue: number, dur: number, isAsync: boolean) {
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       // ******** DOM WRITE ****************
       children[i]._progressEnd(shouldComplete, stepValue, dur, isAsync);
     }
@@ -1108,8 +1108,8 @@ export class Animator {
    * RECURSION
    */
   _didFinishAll(hasCompleted: boolean, finishAsyncAnimations: boolean, finishNoDurationAnimations: boolean) {
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       children[i]._didFinishAll(hasCompleted, finishAsyncAnimations, finishNoDurationAnimations);
     }
 
@@ -1124,7 +1124,7 @@ export class Animator {
   _didFinish(hasCompleted: boolean) {
     this.isPlaying = false;
     this.hasCompleted = hasCompleted;
-    var i = 0;
+    let i = 0;
 
     if (this._onFinishCallbacks) {
       // run all finish callbacks
@@ -1149,8 +1149,8 @@ export class Animator {
     if (shouldReverse === undefined) {
       shouldReverse = true;
     }
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       children[i].reverse(shouldReverse);
     }
     this._isReverse = shouldReverse;
@@ -1163,8 +1163,8 @@ export class Animator {
   destroy() {
     this._destroyed = true;
 
-    var children = this._childAnimations;
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    let children = this._childAnimations;
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       children[i].destroy();
     }
 
@@ -1200,9 +1200,9 @@ export class Animator {
    */
   _transEl(): HTMLElement {
     // get the lowest level element that has an Animation
-    var targetEl: HTMLElement;
+    let targetEl: HTMLElement;
 
-    for (var i = 0; i < this._childAnimationTotal; i++) {
+    for (let i = 0; i < this._childAnimationTotal; i++) {
       targetEl = this._childAnimations[i]._transEl();
       if (targetEl) {
         return targetEl;
diff --git a/packages/core/src/components/animation-controller/constants.ts b/packages/core/src/components/animation-controller/constants.ts
index 839649d59c..3101b0e425 100644
--- a/packages/core/src/components/animation-controller/constants.ts
+++ b/packages/core/src/components/animation-controller/constants.ts
@@ -1,6 +1,6 @@
 
-export var CSS_PROP = function(docEle: HTMLElement) {
-  var css: {
+export let CSS_PROP = function(docEle: HTMLElement) {
+  let css: {
     transformProp?: string;
     transitionProp?: string;
     transitionDurationProp?: string;
@@ -8,8 +8,8 @@ export var CSS_PROP = function(docEle: HTMLElement) {
   } = {};
 
   // transform
-  var i: number;
-  var keys = ['webkitTransform', '-webkit-transform', 'webkit-transform', 'transform'];
+  let i: number;
+  let keys = ['webkitTransform', '-webkit-transform', 'webkit-transform', 'transform'];
 
   for (i = 0; i < keys.length; i++) {
     if ((docEle.style as any)[keys[i]] !== undefined) {
@@ -28,7 +28,7 @@ export var CSS_PROP = function(docEle: HTMLElement) {
   }
 
   // The only prefix we care about is webkit for transitions.
-  var prefix = css.transitionProp.indexOf('webkit') > -1 ? '-webkit-' : '';
+  let prefix = css.transitionProp.indexOf('webkit') > -1 ? '-webkit-' : '';
 
   // transition duration
   css.transitionDurationProp = prefix + 'transition-duration';
@@ -41,7 +41,7 @@ export var CSS_PROP = function(docEle: HTMLElement) {
 }(document.documentElement);
 
 
-export var TRANSFORM_PROPS: {[key: string]: number} = {
+export let TRANSFORM_PROPS: {[key: string]: number} = {
   'translateX': 1,
   'translateY': 1,
   'translateZ': 1,
@@ -61,6 +61,6 @@ export var TRANSFORM_PROPS: {[key: string]: number} = {
   'perspective': 1
 };
 
-export var CSS_VALUE_REGEX = /(^-?\d*\.?\d*)(.*)/;
-export var DURATION_MIN = 32;
-export var TRANSITION_END_FALLBACK_PADDING_MS = 400;
+export let CSS_VALUE_REGEX = /(^-?\d*\.?\d*)(.*)/;
+export let DURATION_MIN = 32;
+export let TRANSITION_END_FALLBACK_PADDING_MS = 400;
diff --git a/packages/core/src/components/animation-controller/transition-end.ts b/packages/core/src/components/animation-controller/transition-end.ts
index 1ee9ffdeec..f7c3d71daa 100644
--- a/packages/core/src/components/animation-controller/transition-end.ts
+++ b/packages/core/src/components/animation-controller/transition-end.ts
@@ -1,9 +1,9 @@
 
 
 export function transitionEnd(elm: HTMLElement, callback: {(ev?: TransitionEvent): void}) {
-  var unRegTrans: Function;
-  var unRegWKTrans: Function;
-  var opts: any = { passive: true };
+  let unRegTrans: Function;
+  let unRegWKTrans: Function;
+  let opts: any = { passive: true };
 
   function unregister() {
     unRegWKTrans && unRegWKTrans();
diff --git a/packages/core/src/components/app/app.tsx b/packages/core/src/components/app/app.tsx
index 9188ee0bed..6d74024eed 100644
--- a/packages/core/src/components/app/app.tsx
+++ b/packages/core/src/components/app/app.tsx
@@ -19,8 +19,8 @@ export class App {
   @Element() element: HTMLElement;
 
   @State() modeCode: string;
-  @State() hoverCSS: boolean = false;
-  @State() useRouter: boolean = false;
+  @State() hoverCSS = false;
+  @State() useRouter = false;
 
   @Prop({ context: 'config' }) config: Config;
 
diff --git a/packages/core/src/components/button/button.tsx b/packages/core/src/components/button/button.tsx
index 3007c6df3e..67bee80ea8 100644
--- a/packages/core/src/components/button/button.tsx
+++ b/packages/core/src/components/button/button.tsx
@@ -25,7 +25,7 @@ export class Button {
    * The type of button.
    * Possible values are: `"button"`, `"bar-button"`.
    */
-  @Prop() buttonType: string = 'button';
+  @Prop() buttonType = 'button';
 
   /**
    * The button size.
@@ -36,7 +36,7 @@ export class Button {
   /**
    * If true, sets the button into a disabled state.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   /**
    * Set to `"clear"` for a transparent button, to `"outline"` for a transparent
@@ -48,7 +48,7 @@ export class Button {
   /**
    * If true, activates a button with rounded corners.
    */
-  @Prop() round: boolean = false;
+  @Prop() round = false;
 
   /**
    * Set to `"block"` for a full-width button or to `"full"` for a full-width button
@@ -59,7 +59,7 @@ export class Button {
   /**
    * If true, activates a button with a heavier font weight.
    */
-  @Prop() strong: boolean = false;
+  @Prop() strong = false;
 
   /**
    * The color to use from your Sass `$colors` map.
diff --git a/packages/core/src/components/buttons/buttons.tsx b/packages/core/src/components/buttons/buttons.tsx
index fdeb3359d8..3b9570d5a6 100644
--- a/packages/core/src/components/buttons/buttons.tsx
+++ b/packages/core/src/components/buttons/buttons.tsx
@@ -12,7 +12,7 @@ export class Buttons {
 
   componentDidLoad() {
     const buttons = this.el.querySelectorAll('ion-button') as any;
-    for (var i = 0; i < buttons.length; i++) {
+    for (let i = 0; i < buttons.length; i++) {
       buttons[i].setAttribute('button-type', 'bar-button');
     }
   }
diff --git a/packages/core/src/components/card-header/card-header.tsx b/packages/core/src/components/card-header/card-header.tsx
index 53946f2a41..7e8a661751 100644
--- a/packages/core/src/components/card-header/card-header.tsx
+++ b/packages/core/src/components/card-header/card-header.tsx
@@ -29,7 +29,7 @@ export class CardHeader {
    * If true, adds transparency to the card header.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   hostData() {
     const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'card-header-translucent') : {};
diff --git a/packages/core/src/components/chip-button/chip-button.tsx b/packages/core/src/components/chip-button/chip-button.tsx
index ef2cbdffb9..0880e8ee32 100644
--- a/packages/core/src/components/chip-button/chip-button.tsx
+++ b/packages/core/src/components/chip-button/chip-button.tsx
@@ -40,7 +40,7 @@ export class ChipButton {
   /**
    * @input {boolean} If true, sets the button into a disabled state.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   /**
    * Get the classes based on the button type
@@ -60,7 +60,7 @@ export class ChipButton {
    * Get the classes for the color
    */
   private getColorClassList(color: string, buttonType: string, style: string, mode: string): string[] {
-    let className = (style === 'default') ? `${buttonType}` : `${buttonType}-${style}`;
+    const className = (style === 'default') ? `${buttonType}` : `${buttonType}-${style}`;
 
     return [`${className}-${mode}`].concat(
         style !== 'default' ? `${className}` : [],
diff --git a/packages/core/src/components/content/content.tsx b/packages/core/src/components/content/content.tsx
index 9ed82dd70d..ac5b731e34 100644
--- a/packages/core/src/components/content/content.tsx
+++ b/packages/core/src/components/content/content.tsx
@@ -45,7 +45,7 @@ export class Content {
    * and footers. This effect can easily be seen by setting the toolbar
    * to transparent.
    */
-  @Prop() fullscreen: boolean = false;
+  @Prop() fullscreen = false;
 
   @Listen('body:ionNavChanged')
   onNavChanged() {
@@ -53,7 +53,7 @@ export class Content {
   }
 
   componentDidLoad() {
-    this.scrollEl = this.el.querySelector('ion-scroll') as HTMLIonScrollElement;
+    this.scrollEl = this.el.querySelector('ion-scroll');
     this.resize();
   }
 
@@ -81,7 +81,7 @@ export class Content {
    * @returns {Promise} Returns a promise which is resolved when the scroll has completed.
    */
   @Method()
-  scrollToTop(duration: number = 300) {
+  scrollToTop(duration = 300) {
     return this.scrollEl.scrollToTop(duration);
   }
 
@@ -92,7 +92,7 @@ export class Content {
    * @returns {Promise} Returns a promise which is resolved when the scroll has completed.
    */
   @Method()
-  scrollToBottom(duration: number = 300) {
+  scrollToBottom(duration = 300) {
     return this.scrollEl.scrollToBottom(duration);
   }
 
diff --git a/packages/core/src/components/datetime/datetime-util.ts b/packages/core/src/components/datetime/datetime-util.ts
index 45c30c3fdf..b77bd71b65 100644
--- a/packages/core/src/components/datetime/datetime-util.ts
+++ b/packages/core/src/components/datetime/datetime-util.ts
@@ -6,12 +6,12 @@ export function renderDatetime(template: string, value: DatetimeData, locale: Lo
     return '';
   }
 
-  let tokens: string[] = [];
+  const tokens: string[] = [];
   let hasText = false;
   FORMAT_KEYS.forEach((format, index) => {
     if (template.indexOf(format.f) > -1) {
-      var token = '{' + index + '}';
-      var text = renderTextFormat(format.f, (value as any)[format.k], value, locale);
+      const token = '{' + index + '}';
+      const text = renderTextFormat(format.f, (value as any)[format.k], value, locale);
 
       if (!hasText && text && (value as any)[format.k]) {
         hasText = true;
@@ -27,7 +27,7 @@ export function renderDatetime(template: string, value: DatetimeData, locale: Lo
     return '';
   }
 
-  for (var i = 0; i < tokens.length; i += 2) {
+  for (let i = 0; i < tokens.length; i += 2) {
     template = template.replace(tokens[i], tokens[i + 1]);
   }
 
@@ -99,7 +99,7 @@ export function renderTextFormat(format: string, value: any, date: DatetimeData,
 
 
 export function dateValueRange(format: string, min: DatetimeData, max: DatetimeData): any[] {
-  let opts: any[] = [];
+  const opts: any[] = [];
   let i: number;
 
   if (format === FORMAT_YYYY || format === FORMAT_YY) {
@@ -150,7 +150,7 @@ export function dateValueRange(format: string, min: DatetimeData, max: DatetimeD
   return opts;
 }
 
-export function dateSortValue(year: number, month: number, day: number, hour: number = 0, minute: number = 0): number {
+export function dateSortValue(year: number, month: number, day: number, hour = 0, minute = 0): number {
   return parseInt(`1${fourDigit(year)}${twoDigit(month)}${twoDigit(day)}${twoDigit(hour)}${twoDigit(minute)}`, 10);
 }
 
@@ -198,11 +198,11 @@ export function parseDate(val: any): DatetimeData {
   }
 
   // ensure all the parse values exist with at least 0
-  for (var i = 1; i < 8; i++) {
+  for (let i = 1; i < 8; i++) {
     parse[i] = (parse[i] !== undefined ? parseInt(parse[i], 10) : null);
   }
 
-  var tzOffset = 0;
+  let tzOffset = 0;
   if (parse[9] && parse[10]) {
     // hours
     tzOffset = parseInt(parse[10], 10) * 60;
@@ -258,7 +258,7 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
 
       // merge new values from the picker's selection
       // to the existing DatetimeData values
-      for (var k in newData) {
+      for (const k in newData) {
         (existingData as any)[k] = newData[k].value;
       }
 
@@ -270,7 +270,7 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean {
 
   } else {
     // blank data, clear everything out
-    for (let k in existingData) {
+    for (const k in existingData) {
       delete (existingData as any)[k];
     }
   }
@@ -324,7 +324,7 @@ export function getValueFromFormat(date: DatetimeData, format: string) {
 
 
 export function convertFormatToKey(format: string): string {
-  for (var k in FORMAT_KEYS) {
+  for (const k in FORMAT_KEYS) {
     if (FORMAT_KEYS[k].f === format) {
       return FORMAT_KEYS[k].k;
     }
@@ -406,7 +406,7 @@ export function convertToArrayOfStrings(input: any, type: string): string[] {
     input = input.replace(/\[|\]/g, '').split(',');
   }
 
-  var values: string[];
+  let values: string[];
   if (isArray(input)) {
     // trim up each string value
     values = input.map((val: string) => val.trim());
diff --git a/packages/core/src/components/datetime/datetime.tsx b/packages/core/src/components/datetime/datetime.tsx
index 393efae9da..db5f469093 100644
--- a/packages/core/src/components/datetime/datetime.tsx
+++ b/packages/core/src/components/datetime/datetime.tsx
@@ -50,7 +50,7 @@ export class Datetime {
   /**
    * @input {boolean} If true, the user cannot interact with the datetime. Defaults to `false`.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   /**
    * @input {string} The minimum datetime allowed. Value must be a date string
@@ -79,7 +79,7 @@ export class Datetime {
    * the datetime picker's columns. See the `pickerFormat` input description for
    * more info. Defaults to `MMM D, YYYY`.
    */
-  @Prop() displayFormat: string = 'MMM D, YYYY';
+  @Prop() displayFormat = 'MMM D, YYYY';
 
   /**
    * @input {string} The format of the date and time picker columns the user selects.
@@ -94,12 +94,12 @@ export class Datetime {
   /**
    * @input {string} The text to display on the picker's cancel button. Default: `Cancel`.
    */
-  @Prop() cancelText: string = 'Cancel';
+  @Prop() cancelText = 'Cancel';
 
   /**
    * @input {string} The text to display on the picker's "Done" button. Default: `Done`.
    */
-  @Prop() doneText: string = 'Done';
+  @Prop() doneText = 'Done';
 
   /**
    * @input {array | string} Values used to create the list of selectable years. By default
@@ -311,7 +311,7 @@ export class Datetime {
       parseTemplate(template).forEach((format: any) => {
         // loop through each format in the template
         // create a new picker column to build up with data
-        let key = convertFormatToKey(format);
+        const key = convertFormatToKey(format);
         let values: any[];
 
         // first see if they have exact values to use for this input
@@ -379,7 +379,7 @@ export class Datetime {
         selectedYear = yearCol.options[0].value;
       }
 
-      var yearOpt = yearCol.options[yearCol.selectedIndex];
+      const yearOpt = yearCol.options[yearCol.selectedIndex];
       if (yearOpt) {
         // they have a selected year value
         selectedYear = yearOpt.value;
@@ -423,7 +423,7 @@ export class Datetime {
     const todaysYear = (now || new Date()).getFullYear();
 
     if (this.yearValues) {
-      var years = convertToArrayOfNumbers(this.yearValues, 'year');
+      const years = convertToArrayOfNumbers(this.yearValues, 'year');
       if (isBlank(this.min)) {
         this.min = Math.min.apply(Math, years);
       }
@@ -486,13 +486,13 @@ export class Datetime {
     let indexMin = options.length - 1;
     let indexMax = 0;
 
-    for (var i = 0; i < options.length; i++) {
-      var opt = options[i];
-      var value = opt.value;
+    for (let i = 0; i < options.length; i++) {
+      const opt = options[i];
+      const value = opt.value;
       lb[index] = opt.value;
       ub[index] = opt.value;
 
-      var disabled = opt.disabled = (
+      const disabled = opt.disabled = (
         value < lowerBounds[index] ||
         value > upperBounds[index] ||
         dateSortValue(ub[0], ub[1], ub[2], ub[3], ub[4]) < min ||
@@ -503,7 +503,7 @@ export class Datetime {
         indexMax = Math.max(indexMax, i);
       }
     }
-    let selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
+    const selectedIndex = column.selectedIndex = clamp(indexMin, column.selectedIndex, indexMax);
     opt = column.options[selectedIndex];
     if (opt) {
       return opt.value;
@@ -516,14 +516,14 @@ export class Datetime {
    */
   divyColumns(columns: PickerColumn[]): PickerColumn[] {
     const pickerColumns = columns;
-    let columnsWidth: number[] = [];
+    const columnsWidth: number[] = [];
     let col: PickerColumn;
     let width: number;
-    for (var i = 0; i < pickerColumns.length; i++) {
+    for (let i = 0; i < pickerColumns.length; i++) {
       col = pickerColumns[i];
       columnsWidth.push(0);
 
-      for (var j = 0; j < col.options.length; j++) {
+      for (let j = 0; j < col.options.length; j++) {
         width = col.options[j].text.length;
         if (width > columnsWidth[i]) {
           columnsWidth[i] = width;
diff --git a/packages/core/src/components/fab-button/fab-button.tsx b/packages/core/src/components/fab-button/fab-button.tsx
index e56fed31b7..2a47a25656 100755
--- a/packages/core/src/components/fab-button/fab-button.tsx
+++ b/packages/core/src/components/fab-button/fab-button.tsx
@@ -36,20 +36,20 @@ export class FabButton {
    * @input {boolean} If true, adds transparency to the fab.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
-  @Prop() activated: boolean = false;
+  @Prop() activated = false;
   @Prop() toggleActive: Function = () => {};
 
-  @Prop() show: boolean = false;
+  @Prop() show = false;
 
-  @State() private inContainer: boolean = false;
-  @State() private inList: boolean = false;
+  @State() private inContainer = false;
+  @State() private inList = false;
 
   /**
    * @input {boolean} If true, sets the button into a disabled state.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   componentDidLoad() {
     const parentNode = this.el.parentNode.nodeName;
@@ -72,7 +72,7 @@ export class FabButton {
     if (!this.inList) {
       return [];
     }
-    let listClasses = [
+    const listClasses = [
       `fab-button-in-list`,
       `fab-button-${this.mode}-in-list`
     ];
diff --git a/packages/core/src/components/fab-list/fab-list.tsx b/packages/core/src/components/fab-list/fab-list.tsx
index d446a50be4..d30eacdb1d 100644
--- a/packages/core/src/components/fab-list/fab-list.tsx
+++ b/packages/core/src/components/fab-list/fab-list.tsx
@@ -8,15 +8,15 @@ import { Component, Element, Prop, Watch } from '@stencil/core';
 export class FabList {
   @Element() private el: HTMLIonFabElement;
 
-  @Prop() activated: boolean = false;
+  @Prop() activated = false;
 
   @Watch('activated')
   protected activatedChanged(activated: boolean) {
     const fabs = this.el.querySelectorAll('ion-fab-button');
 
     // if showing the fabs add a timeout, else show immediately
-    var timeout = activated ? 30 : 0;
-    for (var i = 0; i < fabs.length; i++) {
+    let timeout = activated ? 30 : 0;
+    for (let i = 0; i < fabs.length; i++) {
       const fab = fabs[i];
       setTimeout(() => fab.show = activated, i * timeout);
     }
diff --git a/packages/core/src/components/footer/footer.tsx b/packages/core/src/components/footer/footer.tsx
index 5cb7ec2b1e..2f456cbc0d 100644
--- a/packages/core/src/components/footer/footer.tsx
+++ b/packages/core/src/components/footer/footer.tsx
@@ -22,7 +22,7 @@ export class Footer {
    * attribute needs to be set on the content.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   hostData() {
     const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'header-translucent') : {};
diff --git a/packages/core/src/components/gesture-controller/gesture-controller.ts b/packages/core/src/components/gesture-controller/gesture-controller.ts
index b35e3f69aa..2ed7185807 100644
--- a/packages/core/src/components/gesture-controller/gesture-controller.ts
+++ b/packages/core/src/components/gesture-controller/gesture-controller.ts
@@ -5,7 +5,7 @@ import { Component } from '@stencil/core';
   tag: 'ion-gesture-controller'
 })
 export class GestureController {
-  private gestureId: number = 0;
+  private gestureId = 0;
   private requestedStart: { [eventId: number]: number } = {};
   private disabledGestures: { [eventName: string]: Set<number> } = {};
   private disabledScroll: Set<number> = new Set<number>();
@@ -41,9 +41,9 @@ export class GestureController {
     if (!this.start(gestureName, id, priority)) {
       return false;
     }
-    let requestedStart = this.requestedStart;
+    const requestedStart = this.requestedStart;
     let maxPriority = -10000;
-    for (let gestureID in requestedStart) {
+    for (const gestureID in requestedStart) {
       maxPriority = Math.max(maxPriority, requestedStart[gestureID]);
     }
 
@@ -75,7 +75,7 @@ export class GestureController {
   }
 
   enableGesture(gestureName: string, id: number) {
-    let set = this.disabledGestures[gestureName];
+    const set = this.disabledGestures[gestureName];
     if (set) {
       set.delete(id);
     }
@@ -121,7 +121,7 @@ export class GestureController {
   }
 
   isDisabled(gestureName: string): boolean {
-    let disabled = this.disabledGestures[gestureName];
+    const disabled = this.disabledGestures[gestureName];
     if (disabled && disabled.size > 0) {
       return true;
     }
@@ -162,7 +162,7 @@ export class GestureDelegate {
       return false;
     }
 
-    let captured = this.ctrl.capture(this.name, this.gestureDelegateId, this.priority);
+    const captured = this.ctrl.capture(this.name, this.gestureDelegateId, this.priority);
     if (captured && this.disableScroll) {
       this.ctrl.disableScroll(this.gestureDelegateId);
     }
@@ -190,7 +190,7 @@ export class GestureDelegate {
 
 export class BlockerDelegate {
 
-  blocked: boolean = false;
+  blocked = false;
 
   constructor(
     private blockerDelegateId: number,
diff --git a/packages/core/src/components/gesture/gesture.tsx b/packages/core/src/components/gesture/gesture.tsx
index 9ac8d41926..dd0e24ed77 100644
--- a/packages/core/src/components/gesture/gesture.tsx
+++ b/packages/core/src/components/gesture/gesture.tsx
@@ -30,17 +30,17 @@ export class Gesture {
   @Prop({ context: 'dom' }) dom: DomController;
   @Prop({ context: 'enableListener' }) enableListener: any;
 
-  @Prop() enabled: boolean = true;
+  @Prop() enabled = true;
   @Prop() attachTo: ElementRef = 'child';
-  @Prop() autoBlockAll: boolean = false;
+  @Prop() autoBlockAll = false;
   @Prop() block: string = null;
-  @Prop() disableScroll: boolean = false;
-  @Prop() direction: string = 'x';
-  @Prop() gestureName: string = '';
-  @Prop() gesturePriority: number = 0;
-  @Prop() maxAngle: number = 40;
-  @Prop() threshold: number = 10;
-  @Prop() type: string = 'pan';
+  @Prop() disableScroll = false;
+  @Prop() direction = 'x';
+  @Prop() gestureName = '';
+  @Prop() gesturePriority = 0;
+  @Prop() maxAngle = 40;
+  @Prop() threshold = 10;
+  @Prop() type = 'pan';
 
   @Prop() canStart: GestureCallback;
   @Prop() onWillStart: (_: GestureDetail) => Promise<void>;
@@ -277,9 +277,9 @@ export class Gesture {
 
     if (startPos > 1) {
       // compute relative movement between these two points
-      var frequency = 1 / (positions[startPos] - timestamp);
-      var movedY = positions[startPos - 1] - currentY;
-      var movedX = positions[startPos - 2] - currentX;
+      let frequency = 1 / (positions[startPos] - timestamp);
+      let movedY = positions[startPos - 1] - currentY;
+      let movedX = positions[startPos - 2] - currentX;
 
       // based on XXms compute the movement to apply for each render step
       // velocity = space/time = s*(1/t) = s*frequency
diff --git a/packages/core/src/components/gesture/recognizers.ts b/packages/core/src/components/gesture/recognizers.ts
index 87bd8f570d..8553c342b3 100644
--- a/packages/core/src/components/gesture/recognizers.ts
+++ b/packages/core/src/components/gesture/recognizers.ts
@@ -4,7 +4,7 @@ export class PanRecognizer {
   private startX: number;
   private startY: number;
 
-  private dirty: boolean = false;
+  private dirty = false;
   private threshold: number;
   private maxCosine: number;
   private isDirX: boolean;
diff --git a/packages/core/src/components/header/header.tsx b/packages/core/src/components/header/header.tsx
index 2711bf6a5c..a1c78671bf 100644
--- a/packages/core/src/components/header/header.tsx
+++ b/packages/core/src/components/header/header.tsx
@@ -22,7 +22,7 @@ export class Header {
    * attribute needs to be set on the content.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   hostData() {
     const themedClasses = this.translucent ? createThemedClasses(this.mode, this.color, 'header-translucent') : {};
diff --git a/packages/core/src/components/infinite-scroll/infinite-scroll.tsx b/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
index 3ca2091eac..b0524f0655 100644
--- a/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
+++ b/packages/core/src/components/infinite-scroll/infinite-scroll.tsx
@@ -13,15 +13,15 @@ const enum Position {
 })
 export class InfiniteScroll {
 
-  private thrPx: number = 0;
-  private thrPc: number = 0.15;
+  private thrPx = 0;
+  private thrPc = 0.15;
   private scrollEl: HTMLIonScrollElement;
   private didFire = false;
   private isBusy = false;
   private init = false;
 
   @Element() private el: HTMLElement;
-  @State() isLoading: boolean = false;
+  @State() isLoading = false;
 
   @Prop({ context: 'dom' }) dom: DomController;
   @Prop({ context: 'enableListener' }) enableListener: any;
@@ -36,7 +36,7 @@ export class InfiniteScroll {
    * scroll is within 100 pixels from the bottom of the page.
    * Default is `15%`.
    */
-  @Prop() threshold: string = '15%';
+  @Prop() threshold = '15%';
 
   @Watch('threshold')
   protected thresholdChanged(val: string) {
@@ -64,7 +64,7 @@ export class InfiniteScroll {
    * enabled or not. Setting to `false` will remove scroll event listeners
    * and hide the display.
    */
-  @Prop() enabled: boolean = true;
+  @Prop() enabled = true;
 
   @Watch('enabled')
   protected enabledChanged(val: boolean) {
diff --git a/packages/core/src/components/input/input.tsx b/packages/core/src/components/input/input.tsx
index 23bb7904d3..668424c6b4 100644
--- a/packages/core/src/components/input/input.tsx
+++ b/packages/core/src/components/input/input.tsx
@@ -52,27 +52,27 @@ export class Input implements InputComponent {
   /**
    * @input {string} Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Defaults to `"none"`.
    */
-  @Prop() autocapitalize: string = 'none';
+  @Prop() autocapitalize = 'none';
 
   /**
    * @input {string} Indicates whether the value of the control can be automatically completed by the browser. Defaults to `"off"`.
    */
-  @Prop() autocomplete: string = 'off';
+  @Prop() autocomplete = 'off';
 
   /**
    * @input {string} Whether autocorrection should be enabled when the user is entering/editing the text value. Defaults to `"off"`.
    */
-  @Prop() autocorrect: string = 'off';
+  @Prop() autocorrect = 'off';
 
   /**
    * @input {string} This Boolean attribute lets you specify that a form control should have input focus when the page loads. Defaults to `false`.
    */
-  @Prop() autofocus: boolean = false;
+  @Prop() autofocus = false;
 
   /**
    * @input {boolean} If true and the type is `checkbox` or `radio`, the control is selected by default. Defaults to `false`.
    */
-  @Prop() checked: boolean = false;
+  @Prop() checked = false;
 
   @Watch('checked')
   protected checkedChanged() {
@@ -82,7 +82,7 @@ export class Input implements InputComponent {
   /**
    * @input {boolean} If true, a clear icon will appear in the input when there is a value. Clicking it clears the input. Defaults to `false`.
    */
-  @Prop() clearInput: boolean = false;
+  @Prop() clearInput = false;
 
   /**
    * @input {boolean} If true, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
@@ -92,7 +92,7 @@ export class Input implements InputComponent {
   /**
    * @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `0`.
    */
-  @Prop() debounce: number = 0;
+  @Prop() debounce = 0;
 
   @Watch('debounce')
   private debounceInput() {
@@ -105,7 +105,7 @@ export class Input implements InputComponent {
   /**
    * @input {boolean} If true, the user cannot interact with the input. Defaults to `false`.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   @Watch('disabled')
   protected disabledChanged() {
@@ -160,12 +160,12 @@ export class Input implements InputComponent {
   /**
    * @input {boolean} If true, the user cannot modify the value. Defaults to `false`.
    */
-  @Prop() readonly: boolean = false;
+  @Prop() readonly = false;
 
   /**
    * @input {boolean} If true, the user must fill in a value before submitting a form.
    */
-  @Prop() required: boolean = false;
+  @Prop() required = false;
 
   /**
    * @input {number} This is a nonstandard attribute supported by Safari that only applies when the type is `"search"`. Its value should be a nonnegative decimal integer.
@@ -175,7 +175,7 @@ export class Input implements InputComponent {
   /**
    * @input {string} If true, the element will have its spelling and grammar checked. Defaults to `false`.
    */
-  @Prop() spellcheck: boolean = false;
+  @Prop() spellcheck = false;
 
   /**
    * @input {string} Works with the min and max attributes to limit the increments at which a value can be set. Possible values are: `"any"` or a positive floating point number.
@@ -190,7 +190,7 @@ export class Input implements InputComponent {
   /**
    * @input {string} The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
    */
-  @Prop() type: string = 'text';
+  @Prop() type = 'text';
 
   /**
    * @input {string} The value of the input.
@@ -223,7 +223,7 @@ export class Input implements InputComponent {
   private emitStyle() {
     clearTimeout(this.styleTmr);
 
-    let styles = {
+    const styles = {
       'input': true,
       'input-checked': this.checked,
       'input-disabled': this.disabled,
diff --git a/packages/core/src/components/item-option/item-option.tsx b/packages/core/src/components/item-option/item-option.tsx
index 65b589d260..2a5a162e0c 100644
--- a/packages/core/src/components/item-option/item-option.tsx
+++ b/packages/core/src/components/item-option/item-option.tsx
@@ -31,7 +31,7 @@ export class ItemOption {
   /**
    * @input {boolean} If true, sets the button into a disabled state.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   notCaptured() {
     // if (!clickedOptionButton(ev)) {
@@ -40,7 +40,7 @@ export class ItemOption {
   }
 
   clickedOptionButton(ev: any): boolean {
-    let el = ev.target.closest('ion-item-option');
+    const el = ev.target.closest('ion-item-option');
     return !!el;
   }
 
diff --git a/packages/core/src/components/item-sliding/item-sliding.tsx b/packages/core/src/components/item-sliding/item-sliding.tsx
index fe8cd08843..b50d07e028 100644
--- a/packages/core/src/components/item-sliding/item-sliding.tsx
+++ b/packages/core/src/components/item-sliding/item-sliding.tsx
@@ -45,7 +45,7 @@ export class ItemSliding {
   private tmr: any = null;
   private leftOptions: ItemOptions;
   private rightOptions: ItemOptions;
-  private optsDirty: boolean = true;
+  private optsDirty = true;
   private gestureOptions: any;
 
   @Element() private el: HTMLElement;
@@ -172,8 +172,8 @@ export class ItemSliding {
     // Reset left and right options in case they were removed
     this.leftOptions = this.rightOptions = null;
 
-    for (var i = 0; i < options.length; i++) {
-      let option = options.item(i);
+    for (let i = 0; i < options.length; i++) {
+      const option = options.item(i);
 
       if (option.isRightSide()) {
         this.rightOptions = option;
diff --git a/packages/core/src/components/item/item.tsx b/packages/core/src/components/item/item.tsx
index abdead3730..d173551f04 100644
--- a/packages/core/src/components/item/item.tsx
+++ b/packages/core/src/components/item/item.tsx
@@ -43,10 +43,10 @@ export class Item {
 
     let hasChildStyleChange = false;
 
-    let tagName: string = (ev.target as HTMLElement).tagName;
-    let updatedStyles: any = ev.detail;
+    const tagName: string = (ev.target as HTMLElement).tagName;
+    const updatedStyles: any = ev.detail;
 
-    for (var key in updatedStyles) {
+    for (const key in updatedStyles) {
       if (('item-' + key) !== key) {
         Object.defineProperty(updatedStyles, 'item-' + key, Object.getOwnPropertyDescriptor(updatedStyles, key));
         delete updatedStyles[key];
@@ -65,7 +65,7 @@ export class Item {
     // Change the button size to small for each ion-button in the item
     // unless the size is explicitly set
     const buttons = this.el.querySelectorAll('ion-button');
-    for (var i = 0; i < buttons.length; i++) {
+    for (let i = 0; i < buttons.length; i++) {
       if (!buttons[i].size) {
         buttons[i].size = 'small';
       }
@@ -75,11 +75,11 @@ export class Item {
   render() {
     let childStyles = {};
 
-    for (var key in this.itemStyles) {
+    for (const key in this.itemStyles) {
       childStyles = Object.assign(childStyles, this.itemStyles[key]);
     }
 
-    let themedClasses = {
+    const themedClasses = {
       ...childStyles,
       ...createThemedClasses(this.mode, this.color, 'item'),
       'item-block': true
diff --git a/packages/core/src/components/label/label.tsx b/packages/core/src/components/label/label.tsx
index 5ca65a80e5..7d29c1c624 100644
--- a/packages/core/src/components/label/label.tsx
+++ b/packages/core/src/components/label/label.tsx
@@ -38,17 +38,17 @@ export class Label {
   /**
    * @output {Event} If true, the label will sit alongside an input. Defaults to `false`.
    */
-  @Prop() fixed: boolean = false;
+  @Prop() fixed = false;
 
   /**
    * @output {Event} If true, the label will float above an input when the value is empty or the input is focused. Defaults to `false`.
    */
-  @Prop() floating: boolean = false;
+  @Prop() floating = false;
 
   /**
    * @output {Event} If true, the label will be stacked above an input. Defaults to `false`.
    */
-  @Prop() stacked: boolean = false;
+  @Prop() stacked = false;
 
   @Method()
   getText(): string {
@@ -62,7 +62,7 @@ export class Label {
   emitStyle() {
     clearTimeout(this.styleTmr);
 
-    let styles = {
+    const styles = {
       'label-fixed': this.fixed,
       'label-floating': this.floating,
       'label-stacked': this.stacked
diff --git a/packages/core/src/components/loading/loading.tsx b/packages/core/src/components/loading/loading.tsx
index c19d9b8ebd..f6cc8d1462 100644
--- a/packages/core/src/components/loading/loading.tsx
+++ b/packages/core/src/components/loading/loading.tsx
@@ -86,7 +86,7 @@ export class Loading {
   /**
    * Dismiss the loading indicator if the page is changed
    */
-  @Prop() dismissOnPageChange: boolean = false;
+  @Prop() dismissOnPageChange = false;
 
   /**
    * Number of milliseconds to wait before dismissing the loading indicator
@@ -96,12 +96,12 @@ export class Loading {
   /**
    * If true, the background will be translucent. Browser support for backdrop-filter is required for the full effect
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   /**
    * Show the backdrop of not
    */
-  @Prop() showBackdrop: boolean = true;
+  @Prop() showBackdrop = true;
 
   /**
    * Animation to use when loading indicator is presented
@@ -116,7 +116,7 @@ export class Loading {
   /**
    * Toggles whether animation should occur or not
    */
-  @Prop() willAnimate: boolean = true;
+  @Prop() willAnimate = true;
 
   /**
    * Present a loading overlay after it has been created
diff --git a/packages/core/src/components/menu-controller/menu-controller.ts b/packages/core/src/components/menu-controller/menu-controller.ts
index 150c81412d..5278ad524f 100644
--- a/packages/core/src/components/menu-controller/menu-controller.ts
+++ b/packages/core/src/components/menu-controller/menu-controller.ts
@@ -30,7 +30,7 @@ export class MenuController {
   open(menuId?: string): Promise<boolean> {
     const menu = this.get(menuId);
     if (menu && !this.isAnimating()) {
-      let openedMenu = this.getOpen();
+      const openedMenu = this.getOpen();
       if (openedMenu && menu !== openedMenu) {
         openedMenu.setOpen(false, false);
       }
@@ -69,7 +69,7 @@ export class MenuController {
   toggle(menuId?: string): Promise<boolean> {
     const menu = this.get(menuId);
     if (menu && !this.isAnimating()) {
-      var openedMenu = this.getOpen();
+      const openedMenu = this.getOpen();
       if (openedMenu && menu !== openedMenu) {
         openedMenu.setOpen(false, false);
       }
@@ -118,7 +118,7 @@ export class MenuController {
   @Method()
   isOpen(menuId?: string): boolean {
     if (menuId) {
-      var menu = this.get(menuId);
+      const menu = this.get(menuId);
       return menu && menu.isOpen() || false;
     }
     return !!this.getOpen();
@@ -148,7 +148,7 @@ export class MenuController {
    */
   @Method()
   get(menuId?: string): HTMLIonMenuElement {
-    var menu: Menu;
+    let menu: Menu;
 
     if (menuId === 'left' || menuId === 'right') {
       // there could be more than one menu on the same side
diff --git a/packages/core/src/components/menu/menu.tsx b/packages/core/src/components/menu/menu.tsx
index 8f8d8f12e4..7987c02801 100644
--- a/packages/core/src/components/menu/menu.tsx
+++ b/packages/core/src/components/menu/menu.tsx
@@ -17,13 +17,13 @@ export class Menu {
   private gestureBlocker: string;
   private animation: Animation;
   private isPane = false;
-  private _isOpen: boolean = false;
+  private _isOpen = false;
   private lastOnEnd = 0;
 
   mode: string;
   color: string;
-  isAnimating: boolean = false;
-  isRightSide: boolean = false;
+  isAnimating = false;
+  isRightSide = false;
   width: number = null;
 
   backdropEl: HTMLElement;
@@ -52,7 +52,7 @@ export class Menu {
    * see the `menuType` in the [config](../../config/Config). Available options:
    * `"overlay"`, `"reveal"`, `"push"`.
    */
-  @Prop({ mutable: true }) type: string = 'overlay';
+  @Prop({ mutable: true }) type = 'overlay';
 
   @Watch('type')
   typeChanged(type: string) {
@@ -91,7 +91,7 @@ export class Menu {
   /**
    * @input {boolean} If true, swiping the menu is enabled. Default `true`.
    */
-  @Prop() swipeEnabled: boolean = true;
+  @Prop() swipeEnabled = true;
 
   @Watch('swipeEnabled')
   protected swipeEnabledChanged() {
@@ -101,9 +101,9 @@ export class Menu {
   /**
    * @input {boolean} If true, the menu will persist on child pages.
    */
-  @Prop() persistent: boolean = false;
+  @Prop() persistent = false;
 
-  @Prop() maxEdgeStart: number = 50;
+  @Prop() maxEdgeStart = 50;
 
   /**
    * @output {Event} Emitted when the sliding position changes.
@@ -135,13 +135,13 @@ export class Menu {
       ? '#' + this.content
       : '[main]';
     const parent = el.parentElement;
-    const content = this.contentEl = parent.querySelector(contentQuery) as HTMLElement;
+    const content = this.contentEl = parent.querySelector(contentQuery);
     if (!content || !content.tagName) {
       // requires content element
       return console.error('Menu: must have a "content" element to listen for drag events on.');
     }
-    this.menuInnerEl = el.querySelector('.menu-inner') as HTMLElement;
-    this.backdropEl = el.querySelector('.menu-backdrop') as HTMLElement;
+    this.menuInnerEl = el.querySelector('.menu-inner');
+    this.backdropEl = el.querySelector('.menu-backdrop');
 
     // add menu's content classes
     content.classList.add('menu-content');
@@ -197,7 +197,7 @@ export class Menu {
   }
 
   @Method()
-  setOpen(shouldOpen: boolean, animated: boolean = true): Promise<boolean> {
+  setOpen(shouldOpen: boolean, animated = true): Promise<boolean> {
     // If the menu is disabled or it is currenly being animated, let's do nothing
     if (!this.isActive() || this.isAnimating || (shouldOpen === this._isOpen)) {
       return Promise.resolve(this._isOpen);
diff --git a/packages/core/src/components/modal-controller/modal-controller.tsx b/packages/core/src/components/modal-controller/modal-controller.tsx
index 3e4650ca10..09f0e2cb20 100644
--- a/packages/core/src/components/modal-controller/modal-controller.tsx
+++ b/packages/core/src/components/modal-controller/modal-controller.tsx
@@ -29,7 +29,7 @@ export class ModalController {
   }
 
   @Method()
-  dismiss(data?: any, role?: any, modalId: number = -1) {
+  dismiss(data?: any, role?: any, modalId = -1) {
     modalId = modalId >= 0 ? modalId : getHighestId();
     const modal = modals.get(modalId);
     return modal.dismiss(data, role);
diff --git a/packages/core/src/components/modal/modal.tsx b/packages/core/src/components/modal/modal.tsx
index a29f69799d..812c5a88e4 100644
--- a/packages/core/src/components/modal/modal.tsx
+++ b/packages/core/src/components/modal/modal.tsx
@@ -71,14 +71,14 @@ export class Modal {
   @Prop() component: any;
   @Prop() data: any = {};
   @Prop() cssClass: string;
-  @Prop() enableBackdropDismiss: boolean = true;
+  @Prop() enableBackdropDismiss = true;
 
   @Prop() modalId: number;
-  @Prop() showBackdrop: boolean = true;
+  @Prop() showBackdrop = true;
 
   @Prop() enterAnimation: AnimationBuilder;
   @Prop() leaveAnimation: AnimationBuilder;
-  @Prop() willAnimate: boolean = true;
+  @Prop() willAnimate = true;
   @Prop({ mutable: true }) delegate: FrameworkDelegate;
 
   private animation: Animation;
diff --git a/packages/core/src/components/nav/nav-utils.ts b/packages/core/src/components/nav/nav-utils.ts
index 8321fa87d1..a65d1ecf3d 100644
--- a/packages/core/src/components/nav/nav-utils.ts
+++ b/packages/core/src/components/nav/nav-utils.ts
@@ -21,7 +21,7 @@ export let NAV_ID_START = 1000;
 export let VIEW_ID_START = 2000;
 
 let transitionIds = 0;
-let activeTransitions = new Map<number, any>();
+const activeTransitions = new Map<number, any>();
 
 let portalZindex = 9999;
 
diff --git a/packages/core/src/components/nav/nav.tsx b/packages/core/src/components/nav/nav.tsx
index 27241ee968..2a0d4432ad 100644
--- a/packages/core/src/components/nav/nav.tsx
+++ b/packages/core/src/components/nav/nav.tsx
@@ -415,7 +415,7 @@ export function popTo(nav: Nav, delegate: FrameworkDelegate, animation: Animatio
   return queueTransaction(config, done);
 }
 
-export function remove(nav: Nav, delegate: FrameworkDelegate, animation: Animation, startIndex: number, removeCount: number = 1, opts?: NavOptions, done?: () => void): Promise<any> {
+export function remove(nav: Nav, delegate: FrameworkDelegate, animation: Animation, startIndex: number, removeCount = 1, opts?: NavOptions, done?: () => void): Promise<any> {
   return queueTransaction({
     removeStart: startIndex,
     removeCount: removeCount,
@@ -1017,7 +1017,7 @@ export function getEnteringView(ti: TransitionInstruction, nav: Nav, leavingView
     return ti.insertViews[ti.insertViews.length - 1];
   }
   if (isDef(ti.removeStart)) {
-    var removeEnd = ti.removeStart + ti.removeCount;
+    let removeEnd = ti.removeStart + ti.removeCount;
     for (let i = nav.views.length - 1; i >= 0; i--) {
       if ((i < ti.removeStart || i >= removeEnd) && nav.views[i] !== leavingView) {
         return nav.views[i];
diff --git a/packages/core/src/components/navbar/navbar.tsx b/packages/core/src/components/navbar/navbar.tsx
index 96d8962162..befd08c169 100644
--- a/packages/core/src/components/navbar/navbar.tsx
+++ b/packages/core/src/components/navbar/navbar.tsx
@@ -15,10 +15,10 @@ export class Navbar {
   color: string;
 
   @Prop({ context: 'config' }) config: Config;
-  @Prop() hideBackButton: boolean = false;
+  @Prop() hideBackButton = false;
   @Prop() backButtonText: string;
   @Prop() backButtonIcon: string;
-  @Prop() hidden: boolean = false;
+  @Prop() hidden = false;
 
   backButtonClick(ev: UIEvent) {
     ev.preventDefault();
@@ -29,7 +29,7 @@ export class Navbar {
 
   componentDidLoad() {
     const buttons = this.el.querySelectorAll('ion-button');
-    for (var i = 0; i < buttons.length; i++) {
+    for (let i = 0; i < buttons.length; i++) {
       buttons[i].setAttribute('button-type', 'bar-button');
     }
   }
diff --git a/packages/core/src/components/picker-column/picker-column.tsx b/packages/core/src/components/picker-column/picker-column.tsx
index e9a8f23339..c4304e53dd 100644
--- a/packages/core/src/components/picker-column/picker-column.tsx
+++ b/packages/core/src/components/picker-column/picker-column.tsx
@@ -23,7 +23,7 @@ export class PickerColumnCmp {
   private scaleFactor: number;
   private startY: number;
   private velocity: number;
-  private y: number = 0;
+  private y = 0;
 
   private activeBlock: string;
 
@@ -48,7 +48,7 @@ export class PickerColumnCmp {
 
   componentDidLoad() {
     // get the scrollable element within the column
-    let colEle = this.el.querySelector('.picker-opts');
+    const colEle = this.el.querySelector('.picker-opts');
 
     // get the height of one option
     this.optHeight = (colEle.firstElementChild ? colEle.firstElementChild.clientHeight : 0);
@@ -76,7 +76,7 @@ export class PickerColumnCmp {
   setSelected(selectedIndex: number, duration: number) {
     // if there is a selected index, then figure out it's y position
     // if there isn't a selected index, then just use the top y position
-    let y = (selectedIndex > -1) ? ((selectedIndex * this.optHeight) * -1) : 0;
+    const y = (selectedIndex > -1) ? ((selectedIndex * this.optHeight) * -1) : 0;
 
     this.velocity = 0;
 
@@ -214,7 +214,7 @@ export class PickerColumnCmp {
         this.velocity = 0;
       }
 
-      var notLockedIn = (y % this.optHeight !== 0 || Math.abs(this.velocity) > 1);
+      const notLockedIn = (y % this.optHeight !== 0 || Math.abs(this.velocity) > 1);
 
       this.update(y, 0, true, !notLockedIn);
 
@@ -225,7 +225,7 @@ export class PickerColumnCmp {
 
     } else if (this.y % this.optHeight !== 0) {
       // needs to still get locked into a position so options line up
-      var currentPos = Math.abs(this.y % this.optHeight);
+      const currentPos = Math.abs(this.y % this.optHeight);
 
       // create a velocity in the direction it needs to scroll
       this.velocity = (currentPos > (this.optHeight / 2) ? 1 : -1);
@@ -233,7 +233,7 @@ export class PickerColumnCmp {
       this.decelerate();
     }
 
-    let currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
+    const currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
 
     // TODO
     // if (currentIndex !== this.lastTempIndex) {
@@ -267,10 +267,10 @@ export class PickerColumnCmp {
     this.pos.length = 0;
     this.pos.push(this.startY, Date.now());
 
-    let options = this.col.options;
+    const options = this.col.options;
     let minY = (options.length - 1);
     let maxY = 0;
-    for (var i = 0; i < options.length; i++) {
+    for (let i = 0; i < options.length; i++) {
       if (!options[i].disabled) {
         minY = Math.min(minY, i);
         maxY = Math.max(maxY, i);
@@ -290,7 +290,7 @@ export class PickerColumnCmp {
 
     console.debug('picker, onDragMove', detail);
 
-    let currentY = detail.currentY;
+    const currentY = detail.currentY;
     this.pos.push(currentY, Date.now());
 
     if (this.startY === null) {
@@ -316,7 +316,7 @@ export class PickerColumnCmp {
 
     this.update(y, 0, false, false);
 
-    let currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
+    const currentIndex = Math.max(Math.abs(Math.round(y / this.optHeight)), 0);
     if (currentIndex !== this.lastTempIndex) {
       this.lastTempIndex = currentIndex;
     }
@@ -341,31 +341,31 @@ export class PickerColumnCmp {
       return;
     }
 
-    let endY = detail.currentY;
+    const endY = detail.currentY;
 
     this.pos.push(endY, Date.now());
 
-    let endPos = (this.pos.length - 1);
+    const endPos = (this.pos.length - 1);
     let startPos = endPos;
-    let timeRange = (Date.now() - 100);
+    const timeRange = (Date.now() - 100);
 
     // move pointer to position measured 100ms ago
-    for (var i = endPos; i > 0 && this.pos[i] > timeRange; i -= 2) {
+    for (let i = endPos; i > 0 && this.pos[i] > timeRange; i -= 2) {
       startPos = i;
     }
 
     if (startPos !== endPos) {
       // compute relative movement between these two points
-      var timeOffset = (this.pos[endPos] - this.pos[startPos]);
-      var movedTop = (this.pos[startPos - 1] - this.pos[endPos - 1]);
+      const timeOffset = (this.pos[endPos] - this.pos[startPos]);
+      const movedTop = (this.pos[startPos - 1] - this.pos[endPos - 1]);
 
       // based on XXms compute the movement to apply for each render step
-      var velocity = ((movedTop / timeOffset) * FRAME_MS);
+      const velocity = ((movedTop / timeOffset) * FRAME_MS);
       this.velocity = clamp(-MAX_PICKER_SPEED, velocity, MAX_PICKER_SPEED);
     }
 
     if (Math.abs(endY - this.startY) > 3) {
-      var y = this.y + (endY - this.startY);
+      const y = this.y + (endY - this.startY);
       this.update(y, 0, true, true);
     }
 
@@ -377,7 +377,7 @@ export class PickerColumnCmp {
     let min = this.col.options.length - 1;
     let max = 0;
     const options = this.col.options;
-    for (var i = 0; i < options.length; i++) {
+    for (let i = 0; i < options.length; i++) {
       if (!options[i].disabled) {
         min = Math.min(min, i);
         max = Math.max(max, i);
@@ -386,7 +386,7 @@ export class PickerColumnCmp {
 
     const selectedIndex = clamp(min, this.col.selectedIndex, max);
     if (this.col.prevSelected !== selectedIndex) {
-      var y = (selectedIndex * this.optHeight) * -1;
+      const y = (selectedIndex * this.optHeight) * -1;
       this.velocity = 0;
       this.update(y, 150, true, false);
     }
@@ -405,9 +405,9 @@ export class PickerColumnCmp {
   }
 
   render() {
-    let col = this.col;
+    const col = this.col;
 
-    let options = this.col.options
+    const options = this.col.options
     .map(o => {
       if (typeof o === 'string') {
         o = { text: o };
@@ -416,7 +416,7 @@ export class PickerColumnCmp {
     })
     .filter(clientInformation => clientInformation !== null);
 
-    let results: any[] = [];
+    const results: any[] = [];
 
     if (col.prefix) {
       results.push(
diff --git a/packages/core/src/components/picker/picker.tsx b/packages/core/src/components/picker/picker.tsx
index 5fd99b7756..562b96b26b 100644
--- a/packages/core/src/components/picker/picker.tsx
+++ b/packages/core/src/components/picker/picker.tsx
@@ -71,14 +71,14 @@ export class Picker {
 
   @Prop() cssClass: string;
   @Prop() content: string;
-  @Prop() dismissOnPageChange: boolean = false;
+  @Prop() dismissOnPageChange = false;
   @Prop() duration: number;
   @Prop() enterAnimation: AnimationBuilder;
   @Prop() leaveAnimation: AnimationBuilder;
   @Prop() pickerId: string;
-  @Prop() showBackdrop: boolean = true;
-  @Prop() enableBackdropDismiss: boolean = true;
-  @Prop() willAnimate: boolean = true;
+  @Prop() showBackdrop = true;
+  @Prop() enableBackdropDismiss = true;
+  @Prop() willAnimate = true;
 
   @Prop() buttons: PickerButton[] = [];
   @Prop() columns: PickerColumn[] = [];
@@ -210,9 +210,9 @@ export class Picker {
   }
 
   getSelected(): any {
-    let selected: {[k: string]: any} = {};
+    const selected: {[k: string]: any} = {};
     this.columns.forEach((col, index) => {
-      let selectedColumn = col.options[col.selectedIndex];
+      const selectedColumn = col.options[col.selectedIndex];
       selected[col.name] = {
         text: selectedColumn ? selectedColumn.text : null,
         value: selectedColumn ? selectedColumn.value : null,
@@ -251,7 +251,7 @@ export class Picker {
   protected backdropClick() {
     // TODO this.enabled
     if (this.enableBackdropDismiss) {
-      let cancelBtn = this.buttons.find(b => b.role === 'cancel');
+      const cancelBtn = this.buttons.find(b => b.role === 'cancel');
       if (cancelBtn) {
         this.buttonClick(cancelBtn);
       } else {
@@ -263,7 +263,7 @@ export class Picker {
   render() {
     // TODO: cssClass
 
-    let buttons = this.buttons
+    const buttons = this.buttons
     .map(b => {
       if (typeof b === 'string') {
         b = { text: b };
@@ -275,7 +275,7 @@ export class Picker {
     })
     .filter(b => b !== null);
 
-    let columns = this.columns;
+    const columns = this.columns;
 
     // // clean up dat data
     // data.columns = data.columns.map(column => {
@@ -353,7 +353,7 @@ export class Picker {
   }
 
   buttonWrapperClass(button: PickerButton): CssClassMap {
-    let buttonClass: string[] = !button.role
+    const buttonClass: string[] = !button.role
       ? ['picker-toolbar-button']
       : [`picker-toolbar-button`, `picker-toolbar-${button.role}`];
     return buttonClass.reduce((prevValue: any, cssClass: any) => {
@@ -363,7 +363,7 @@ export class Picker {
   }
 
   buttonClass(button: PickerButton): CssClassMap {
-    let buttonClass: string[] = !button.cssClass
+    const buttonClass: string[] = !button.cssClass
       ? ['picker-button']
       : [`picker-button`, `${button.cssClass}`];
     return buttonClass.reduce((prevValue: any, cssClass: any) => {
diff --git a/packages/core/src/components/popover/animations/ios.enter.ts b/packages/core/src/components/popover/animations/ios.enter.ts
index 62d049ed75..34a2a619d8 100644
--- a/packages/core/src/components/popover/animations/ios.enter.ts
+++ b/packages/core/src/components/popover/animations/ios.enter.ts
@@ -7,43 +7,43 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
   let originY = 'top';
   let originX = 'left';
 
-  let contentEl = baseElm.querySelector('.popover-content') as HTMLElement;
-  let contentDimentions = contentEl.getBoundingClientRect();
-  let contentWidth = contentDimentions.width;
-  let contentHeight = contentDimentions.height;
+  const contentEl = baseElm.querySelector('.popover-content');
+  const contentDimentions = contentEl.getBoundingClientRect();
+  const contentWidth = contentDimentions.width;
+  const contentHeight = contentDimentions.height;
 
-  let bodyWidth = window.innerWidth;
-  let bodyHeight = window.innerHeight;
+  const bodyWidth = window.innerWidth;
+  const bodyHeight = window.innerHeight;
 
   // If ev was passed, use that for target element
-  let targetDim =
+  const targetDim =
     ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect();
 
-  let targetTop =
+  const targetTop =
     targetDim && 'top' in targetDim
       ? targetDim.top
       : bodyHeight / 2 - contentHeight / 2;
-  let targetLeft =
+  const targetLeft =
     targetDim && 'left' in targetDim ? targetDim.left : bodyWidth / 2;
-  let targetWidth = (targetDim && targetDim.width) || 0;
-  let targetHeight = (targetDim && targetDim.height) || 0;
+  const targetWidth = (targetDim && targetDim.width) || 0;
+  const targetHeight = (targetDim && targetDim.height) || 0;
 
-  let arrowEl = baseElm.querySelector('.popover-arrow') as HTMLElement;
+  const arrowEl = baseElm.querySelector('.popover-arrow');
 
-  let arrowDim = arrowEl.getBoundingClientRect();
-  let arrowWidth = arrowDim.width;
-  let arrowHeight = arrowDim.height;
+  const arrowDim = arrowEl.getBoundingClientRect();
+  const arrowWidth = arrowDim.width;
+  const arrowHeight = arrowDim.height;
 
   if (!targetDim) {
     arrowEl.style.display = 'none';
   }
 
-  let arrowCSS = {
+  const arrowCSS = {
     top: targetTop + targetHeight,
     left: targetLeft + targetWidth / 2 - arrowWidth / 2
   };
 
-  let popoverCSS: { top: any; left: any } = {
+  const popoverCSS: { top: any; left: any } = {
     top: targetTop + targetHeight + (arrowHeight - 1),
     left: targetLeft + targetWidth / 2 - contentWidth / 2
   };
diff --git a/packages/core/src/components/popover/animations/md.enter.ts b/packages/core/src/components/popover/animations/md.enter.ts
index 76acdb5664..99b746c755 100644
--- a/packages/core/src/components/popover/animations/md.enter.ts
+++ b/packages/core/src/components/popover/animations/md.enter.ts
@@ -7,31 +7,31 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
   let originY = 'top';
   let originX = 'left';
 
-  let contentEl = baseElm.querySelector('.popover-content') as HTMLElement;
-  let contentDimentions = contentEl.getBoundingClientRect();
-  let contentWidth = contentDimentions.width;
-  let contentHeight = contentDimentions.height;
+  const contentEl = baseElm.querySelector('.popover-content');
+  const contentDimentions = contentEl.getBoundingClientRect();
+  const contentWidth = contentDimentions.width;
+  const contentHeight = contentDimentions.height;
 
-  let bodyWidth = window.innerWidth;
-  let bodyHeight = window.innerHeight;
+  const bodyWidth = window.innerWidth;
+  const bodyHeight = window.innerHeight;
 
   // If ev was passed, use that for target element
-  let targetDim =
+  const targetDim =
     ev && ev.target && (ev.target as HTMLElement).getBoundingClientRect();
 
-  let targetTop =
+  const targetTop =
     targetDim && 'top' in targetDim
       ? targetDim.top
       : bodyHeight / 2 - contentHeight / 2;
 
-  let targetLeft =
+  const targetLeft =
     targetDim && 'left' in targetDim
       ? targetDim.left
       : bodyWidth / 2 - contentWidth / 2;
 
-  let targetHeight = (targetDim && targetDim.height) || 0;
+  const targetHeight = (targetDim && targetDim.height) || 0;
 
-  let popoverCSS: { top: any; left: any } = {
+  const popoverCSS: { top: any; left: any } = {
     top: targetTop,
     left: targetLeft
   };
diff --git a/packages/core/src/components/popover/popover.tsx b/packages/core/src/components/popover/popover.tsx
index f50ff5ad45..da91e57b00 100644
--- a/packages/core/src/components/popover/popover.tsx
+++ b/packages/core/src/components/popover/popover.tsx
@@ -72,14 +72,14 @@ export class Popover {
   @Prop() component: string;
   @Prop() data: any = {};
   @Prop() cssClass: string;
-  @Prop() enableBackdropDismiss: boolean = true;
+  @Prop() enableBackdropDismiss = true;
   @Prop() enterAnimation: AnimationBuilder;
   @Prop() leaveAnimation: AnimationBuilder;
   @Prop() ev: Event;
   @Prop() popoverId: string;
-  @Prop() showBackdrop: boolean = true;
-  @Prop() translucent: boolean = false;
-  @Prop() willAnimate: boolean = true;
+  @Prop() showBackdrop = true;
+  @Prop() translucent = false;
+  @Prop() willAnimate = true;
   @Prop({ mutable: true }) delegate: FrameworkDelegate;
 
   private animation: Animation;
diff --git a/packages/core/src/components/range/range.tsx b/packages/core/src/components/range/range.tsx
index aaebfe4287..5c47d9dbd2 100644
--- a/packages/core/src/components/range/range.tsx
+++ b/packages/core/src/components/range/range.tsx
@@ -16,18 +16,18 @@ export class Range implements BaseInputComponent {
 
   private styleTmr: any;
 
-  activated: boolean = false;
-  hasFocus: boolean = false;
+  activated = false;
+  hasFocus = false;
   startX: number;
 
   @Element() private el: HTMLElement;
 
   @State() barL: string;
   @State() barR: string;
-  @State() valA: number = 0;
-  @State() valB: number = 0;
-  @State() ratioA: number = 0;
-  @State() ratioB: number = 0;
+  @State() valA = 0;
+  @State() valB = 0;
+  @State() ratioA = 0;
+  @State() ratioB = 0;
   @State() ticks: any[] = [];
   @State() activeB: boolean;
   @State() rect: ClientRect;
@@ -74,7 +74,7 @@ export class Range implements BaseInputComponent {
    * @input {number} How long, in milliseconds, to wait to trigger the
    * `ionChange` event after each change in the range value. Default `0`.
    */
-  @Prop() debounce: number = 0;
+  @Prop() debounce = 0;
 
   @Watch('debounce')
   private debounceChange() {
@@ -87,39 +87,39 @@ export class Range implements BaseInputComponent {
   /*
    * @input {boolean} If true, the user cannot interact with the range. Default false.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   /**
    * @input {boolean} Show two knobs. Defaults to `false`.
    */
-  @Prop() dualKnobs: boolean = false;
+  @Prop() dualKnobs = false;
 
   /**
    * @input {number} Maximum integer value of the range. Defaults to `100`.
    */
-  @Prop() max: number = 100;
+  @Prop() max = 100;
 
   /**
    * @input {number} Minimum integer value of the range. Defaults to `0`.
    */
-  @Prop() min: number = 0;
+  @Prop() min = 0;
 
   /**
    * @input {boolean} If true, a pin with integer value is shown when the knob
    * is pressed. Defaults to `false`.
    */
-  @Prop() pin: boolean = false;
+  @Prop() pin = false;
 
   /**
    * @input {boolean} If true, the knob snaps to tick marks evenly spaced based
    * on the step property value. Defaults to `false`.
    */
-  @Prop() snaps: boolean = false;
+  @Prop() snaps = false;
 
   /**
    * @input {number} Specifies the value granularity. Defaults to `1`.
    */
-  @Prop() step: number = 1;
+  @Prop() step = 1;
 
   /**
    * @input {string} the value of the range.
@@ -203,7 +203,7 @@ export class Range implements BaseInputComponent {
   createTicks() {
     if (this.snaps) {
       for (let value = this.min; value <= this.max; value += this.step) {
-        let ratio = this.valueToRatio(value);
+        const ratio = this.valueToRatio(value);
         this.ticks.push({
           ratio,
           left: `${ratio * 100}%`
@@ -218,7 +218,7 @@ export class Range implements BaseInputComponent {
     const ratio = this.ratio;
     if (this.snaps && ticks) {
       if (this.dualKnobs) {
-        let upperRatio = this.ratioUpper();
+        const upperRatio = this.ratioUpper();
 
         ticks.forEach(t => {
           t.active = t.ratio >= ratio && t.ratio <= upperRatio;
@@ -256,7 +256,7 @@ export class Range implements BaseInputComponent {
     // figure out where the pointer is currently at
     // update the knob being interacted with
     let ratio = clamp(0, (current.x - rect.left) / rect.width, 1);
-    let val = this.ratioToValue(ratio);
+    const val = this.ratioToValue(ratio);
 
     if (this.snaps) {
       // snaps the ratio to the current value
diff --git a/packages/core/src/components/reorder-group/reorder-group.tsx b/packages/core/src/components/reorder-group/reorder-group.tsx
index 498fda529e..73f0bbcbbf 100644
--- a/packages/core/src/components/reorder-group/reorder-group.tsx
+++ b/packages/core/src/components/reorder-group/reorder-group.tsx
@@ -39,15 +39,15 @@ export class ReorderGroup {
   private containerTop: number;
   private containerBottom: number;
 
-  @State() _enabled: boolean = false;
-  @State() _iconVisible: boolean = false;
-  @State() _actived: boolean = false;
+  @State() _enabled = false;
+  @State() _iconVisible = false;
+  @State() _actived = false;
 
   @Element() private el: HTMLElement;
 
   @Prop({ context: 'dom' }) dom: DomController;
 
-  @Prop() enabled: boolean = false;
+  @Prop() enabled = false;
 
   /**
    * @input {string} Which side of the view the ion-reorder should be placed. Default `"end"`.
@@ -108,8 +108,8 @@ export class ReorderGroup {
     }
 
     let sum = 0;
-    for (var i = 0, ilen = children.length; i < ilen; i++) {
-      var child = children[i];
+    for (let i = 0, ilen = children.length; i < ilen; i++) {
+      const child = children[i];
       sum += child.offsetHeight;
       heights.push(sum);
       child.$ionIndex = i;
@@ -120,7 +120,7 @@ export class ReorderGroup {
     this.containerBottom = box.bottom;
 
     if (this.scrollEl) {
-      var scrollBox = this.scrollEl.getBoundingClientRect();
+      const scrollBox = this.scrollEl.getBoundingClientRect();
       this.scrollElInitial = this.scrollEl.scrollTop;
       this.scrollElTop = scrollBox.top + AUTO_SCROLL_MARGIN;
       this.scrollElBottom = scrollBox.bottom - AUTO_SCROLL_MARGIN;
@@ -155,7 +155,7 @@ export class ReorderGroup {
     const normalizedY = currentY - top;
     const toIndex = this.itemIndexForTop(normalizedY);
     if (toIndex !== undefined && (toIndex !== this.lastToIndex)) {
-      let fromIndex = indexForItem(selectedItem);
+      const fromIndex = indexForItem(selectedItem);
       this.lastToIndex = toIndex;
 
       hapticSelectionChanged();
@@ -224,9 +224,9 @@ export class ReorderGroup {
     const itemHeight = this.selectedItemHeight;
     const children = this.containerEl.children;
     const transform = CSS_PROP.transformProp;
-    for (var i = 0; i < children.length; i++) {
-      var style = (children[i] as any).style;
-      var value = '';
+    for (let i = 0; i < children.length; i++) {
+      const style = (children[i] as any).style;
+      let value = '';
       if (i > fromIndex && i <= toIndex) {
         value = `translateY(${-itemHeight}px)`;
       } else if (i < fromIndex && i >= toIndex) {
diff --git a/packages/core/src/components/route/test/router-utils.spec.ts b/packages/core/src/components/route/test/router-utils.spec.ts
index 82882828dc..762c961105 100644
--- a/packages/core/src/components/route/test/router-utils.spec.ts
+++ b/packages/core/src/components/route/test/router-utils.spec.ts
@@ -117,7 +117,7 @@ describe('matchRoute', () => {
       { id: 4, path: '' },
     ];
     const seg = new RouterSegments(['hola', 'manu', 'adam']);
-    let match = matchRoute(seg, routes);
+    const match = matchRoute(seg, routes);
     expect(match).toBeNull();
   });
 
@@ -171,7 +171,7 @@ describe('matchRoute', () => {
       { id: 3, path: 'adam/manu' },
     ];
     const seg = new RouterSegments(['adam', 'manu', 'hello', 'menu', 'hello']);
-    let match = matchRoute(seg, routes);
+    const match = matchRoute(seg, routes);
     expect(match.id).toEqual(1);
     expect(matchRoute(seg, routes)).toBeNull();
   });
diff --git a/packages/core/src/components/router-controller/router-controller.tsx b/packages/core/src/components/router-controller/router-controller.tsx
index acd0db5d19..cfa51e590a 100644
--- a/packages/core/src/components/router-controller/router-controller.tsx
+++ b/packages/core/src/components/router-controller/router-controller.tsx
@@ -10,7 +10,7 @@ export class RouterController {
 
   private busy = false;
   private enabled = false;
-  private basePrefix: string = '#';
+  private basePrefix = '#';
 
   @Prop({ context: 'config' }) config: Config;
   @Prop({ context: 'dom' }) dom: DomController;
@@ -88,7 +88,7 @@ export class RouterController {
   }
 
   private readNavState() {
-    let root = document.querySelector('ion-app') as HTMLElement;
+    const root = document.querySelector('ion-app') as HTMLElement;
     return readNavState(root);
   }
 
diff --git a/packages/core/src/components/router-controller/router-utils.ts b/packages/core/src/components/router-controller/router-utils.ts
index ff77ca3180..540b473cd3 100644
--- a/packages/core/src/components/router-controller/router-utils.ts
+++ b/packages/core/src/components/router-controller/router-utils.ts
@@ -80,7 +80,7 @@ export function readNavState(node: HTMLElement) {
 function mustMatchRoute(segments: RouterSegments, routes: RouterEntries) {
   const r = matchRoute(segments, routes);
   if (!r) {
-    throw 'no route found';
+    throw new Error('no route found');
   }
   return r;
 }
@@ -121,7 +121,7 @@ export function matchRoute(segments: RouterSegments, routes: RouterEntries): Rou
 
 export function generateURL(stack: NavState[]): string {
   const segments: string[] = [];
-  for (let state of stack) {
+  for (const state of stack) {
     segments.push(...parseURL(state.path));
   }
   const path = segments
diff --git a/packages/core/src/components/scroll/scroll.tsx b/packages/core/src/components/scroll/scroll.tsx
index bd1d10d638..f57df582db 100644
--- a/packages/core/src/components/scroll/scroll.tsx
+++ b/packages/core/src/components/scroll/scroll.tsx
@@ -17,7 +17,7 @@ export class Scroll {
   private tmr: any;
   private queued = false;
 
-  isScrolling: boolean = false;
+  isScrolling = false;
   detail: ScrollDetail = {};
 
   @Element() private el: HTMLElement;
@@ -26,13 +26,13 @@ export class Scroll {
   @Prop({ context: 'dom' }) dom: DomController;
   @Prop({ context: 'isServer' }) isServer: boolean;
 
-  @Prop() enabled: boolean = true;
-  @Prop() jsScroll: boolean = false;
+  @Prop() enabled = true;
+  @Prop() jsScroll = false;
 
   @Watch('jsScroll')
   jsScrollChanged(js: boolean) {
     if (js) {
-      throw 'jsScroll: TODO!';
+      throw new Error('jsScroll: TODO!');
     }
   }
 
@@ -136,7 +136,7 @@ export class Scroll {
 
       // where .5 would be 50% of time on a linear scale easedT gives a
       // fraction based on the easing method
-      let easedT = (--time) * time * time + 1;
+      const easedT = (--time) * time * time + 1;
 
       if (fromY !== y) {
         self.setTop((easedT * (y - fromY)) + fromY);
@@ -228,20 +228,20 @@ export class Scroll {
       detail.deltaY = (detail.scrollTop - detail.startY);
       detail.deltaX = (detail.scrollLeft - detail.startX);
 
-      var endPos = (positions.length - 1);
-      var startPos = endPos;
-      var timeRange = (detail.timeStamp - 100);
+      const endPos = (positions.length - 1);
+      let startPos = endPos;
+      const timeRange = (detail.timeStamp - 100);
 
       // move pointer to position measured 100ms ago
-      for (var i = endPos; i > 0 && positions[i] > timeRange; i -= 3) {
+      for (let i = endPos; i > 0 && positions[i] > timeRange; i -= 3) {
         startPos = i;
       }
 
       if (startPos !== endPos) {
         // compute relative movement between these two points
-        var deltaY = (positions[startPos - 2] - positions[endPos - 2]);
-        var deltaX = (positions[startPos - 1] - positions[endPos - 1]);
-        var factor = 1 / (positions[startPos] - positions[endPos]);
+        const deltaY = (positions[startPos - 2] - positions[endPos - 2]);
+        const deltaX = (positions[startPos - 1] - positions[endPos - 1]);
+        const factor = 1 / (positions[startPos] - positions[endPos]);
 
         // based on XXms compute the movement to apply for each render step
         detail.velocityY = deltaY * factor;
diff --git a/packages/core/src/components/searchbar/searchbar.tsx b/packages/core/src/components/searchbar/searchbar.tsx
index 20bbf8d49d..c8c20df971 100644
--- a/packages/core/src/components/searchbar/searchbar.tsx
+++ b/packages/core/src/components/searchbar/searchbar.tsx
@@ -13,15 +13,15 @@ import { debounce } from '../../utils/helpers';
   }
 })
 export class Searchbar {
-  private _isCancelVisible: boolean = false;
-  private _shouldBlur: boolean = true;
-  private _shouldAlignLeft: boolean = true;
+  private _isCancelVisible = false;
+  private _shouldBlur = true;
+  private _shouldAlignLeft = true;
 
   @Element() private el: HTMLElement;
 
-  @State() activated: boolean = false;
+  @State() activated = false;
 
-  @State() focused: boolean = false;
+  @State() focused = false;
 
 
   /**
@@ -66,27 +66,27 @@ export class Searchbar {
   /**
    * @input {boolean} If true, enable searchbar animation. Default `false`.
    */
-  @Prop({ mutable: true }) animated: boolean = false;
+  @Prop({ mutable: true }) animated = false;
 
   /**
    * @input {string} Set the input's autocomplete property. Values: `"on"`, `"off"`. Default `"off"`.
    */
-  @Prop({ mutable: true }) autocomplete: string = 'off';
+  @Prop({ mutable: true }) autocomplete = 'off';
 
   /**
    * @input {string} Set the input's autocorrect property. Values: `"on"`, `"off"`. Default `"off"`.
    */
-  @Prop({ mutable: true }) autocorrect: string = 'off';
+  @Prop({ mutable: true }) autocorrect = 'off';
 
   /**
    * @input {string} Set the the cancel button text. Default: `"Cancel"`.
    */
-  @Prop({ mutable: true }) cancelButtonText: string = 'Cancel';
+  @Prop({ mutable: true }) cancelButtonText = 'Cancel';
 
   /**
    * @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `250`.
    */
-  @Prop({ mutable: true }) debounce: number = 250;
+  @Prop({ mutable: true }) debounce = 250;
 
   @Watch('debounce')
   private debounceInput() {
@@ -99,22 +99,22 @@ export class Searchbar {
   /**
    * @input {string} Set the input's placeholder. Default `"Search"`.
    */
-  @Prop({ mutable: true }) placeholder: string = 'Search';
+  @Prop({ mutable: true }) placeholder = 'Search';
 
   /**
    * @input {boolean} If true, show the cancel button. Default `false`.
    */
-  @Prop({ mutable: true }) showCancelButton: boolean = false;
+  @Prop({ mutable: true }) showCancelButton = false;
 
   /**
    * @input {boolean} If true, enable spellcheck on the input. Default `false`.
    */
-  @Prop({ mutable: true }) spellcheck: boolean = false;
+  @Prop({ mutable: true }) spellcheck = false;
 
   /**
    * @input {string} Set the type of the input. Values: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, `"url"`. Default `"search"`.
    */
-  @Prop({ mutable: true }) type: string = 'search';
+  @Prop({ mutable: true }) type = 'search';
 
   /**
    * @input {string} the value of the searchbar.
@@ -136,7 +136,7 @@ export class Searchbar {
     // setTimeout() fixes https://github.com/ionic-team/ionic/issues/7527
     // wait for 4 frames
     setTimeout(() => {
-      let value = this.value;
+      const value = this.value;
       if (value !== undefined && value !== '') {
         this.value = '';
         this.ionInput.emit({event: ev});
@@ -184,7 +184,7 @@ export class Searchbar {
    * based on whether there is a value in the searchbar or not.
    */
   inputBlurred() {
-    const inputEle = this.el.querySelector('.searchbar-input') as HTMLElement;
+    const inputEle = this.el.querySelector('.searchbar-input');
 
     // _shouldBlur determines if it should blur
     // if we are clearing the input we still want to stay focused in the input
@@ -240,8 +240,8 @@ export class Searchbar {
    */
   positionPlaceholder() {
     const isRTL = document.dir === 'rtl';
-    const inputEle = this.el.querySelector('.searchbar-input') as HTMLElement;
-    const iconEle = this.el.querySelector('.searchbar-search-icon') as HTMLElement;
+    const inputEle = this.el.querySelector('.searchbar-input');
+    const iconEle = this.el.querySelector('.searchbar-search-icon');
 
     if (this._shouldAlignLeft) {
       inputEle.removeAttribute('style');
@@ -249,19 +249,19 @@ export class Searchbar {
 
     } else {
       // Create a dummy span to get the placeholder width
-      var tempSpan = document.createElement('span');
+      const tempSpan = document.createElement('span');
       tempSpan.innerHTML = this.placeholder;
       document.body.appendChild(tempSpan);
 
       // Get the width of the span then remove it
-      var textWidth = tempSpan.offsetWidth;
+      const textWidth = tempSpan.offsetWidth;
       document.body.removeChild(tempSpan);
 
       // Calculate the input padding
-      var inputLeft = 'calc(50% - ' + (textWidth / 2) + 'px)';
+      const inputLeft = 'calc(50% - ' + (textWidth / 2) + 'px)';
 
       // Calculate the icon margin
-      var iconLeft = 'calc(50% - ' + ((textWidth / 2) + 30) + 'px)';
+      const iconLeft = 'calc(50% - ' + ((textWidth / 2) + 30) + 'px)';
 
       // Set the input padding start and icon margin start
       if (isRTL) {
@@ -279,11 +279,11 @@ export class Searchbar {
    */
   positionCancelButton() {
     const isRTL = document.dir === 'rtl';
-    const cancelButton = this.el.querySelector('.searchbar-ios-cancel') as HTMLElement;
+    const cancelButton = this.el.querySelector('.searchbar-ios-cancel');
     const shouldShowCancel = this.focused;
 
     if (shouldShowCancel !== this._isCancelVisible) {
-      var cancelStyle = cancelButton.style;
+      const cancelStyle = cancelButton.style;
       this._isCancelVisible = shouldShowCancel;
       if (shouldShowCancel) {
         if (isRTL) {
@@ -292,7 +292,7 @@ export class Searchbar {
           cancelStyle.marginRight = '0';
         }
       } else {
-        var offset = cancelButton.offsetWidth;
+        const offset = cancelButton.offsetWidth;
         if (offset > 0) {
           if (isRTL) {
             cancelStyle.marginLeft = -offset + 'px';
diff --git a/packages/core/src/components/segment-button/segment-button.tsx b/packages/core/src/components/segment-button/segment-button.tsx
index 33db49a37d..b8ca36c1dd 100644
--- a/packages/core/src/components/segment-button/segment-button.tsx
+++ b/packages/core/src/components/segment-button/segment-button.tsx
@@ -1,4 +1,4 @@
-import { Component, Element, Event, EventEmitter, Prop, State } from '@stencil/core';
+import { Component, Element, Event, EventEmitter, Prop } from '@stencil/core';
 import { CssClassMap } from '../../index';
 import { createThemedClasses, getElementClassObject } from '../../utils/theme';
 
@@ -16,7 +16,7 @@ export class SegmentButton {
    */
   @Event() ionClick: EventEmitter<SegmentButtonEventDetail>;
 
-  @Prop({mutable: true}) activated: boolean = false;
+  @Prop({mutable: true}) activated = false;
 
   /**
    * The color to use for the text color.
@@ -33,12 +33,12 @@ export class SegmentButton {
   /**
    * If true, the segment button is selected. Defaults to `false`.
    */
-  @Prop({ mutable: true }) checked: boolean = false;
+  @Prop({ mutable: true }) checked = false;
 
   /*
    * If true, the user cannot interact with the segment button. Default false.
    */
-  @Prop({ mutable: true }) disabled: boolean = false;
+  @Prop({ mutable: true }) disabled = false;
 
   /**
    * The value of the segment button.
@@ -68,7 +68,7 @@ export class SegmentButton {
    * Get the classes for the segment button state
    */
   getElementClassList() {
-    let classList = [].concat(
+    const classList = [].concat(
       this.disabled ? 'segment-button-disabled' : [],
       this.activated ? 'segment-activated' : [],
     );
diff --git a/packages/core/src/components/segment/segment.tsx b/packages/core/src/components/segment/segment.tsx
index 09397cc545..e8389803b8 100644
--- a/packages/core/src/components/segment/segment.tsx
+++ b/packages/core/src/components/segment/segment.tsx
@@ -37,7 +37,7 @@ export class Segment {
   /*
    * If true, the user cannot interact with the segment. Default false.
    */
-  @Prop({ mutable: true }) disabled: boolean = false;
+  @Prop({ mutable: true }) disabled = false;
 
   /**
    * the value of the segment.
@@ -51,7 +51,8 @@ export class Segment {
 
   componentDidLoad() {
     this.buttons = this.el.querySelectorAll('ion-segment-button');
-    for (var i = 0; i < this.buttons.length; i++) {
+
+    for (let i = 0; i < this.buttons.length; i++) {
       const button = this.buttons[i];
 
       button.activated = (button.value === this.value);
@@ -76,7 +77,7 @@ export class Segment {
   }
 
   selectButton(val: string) {
-    for (var i = 0; i < this.buttons.length; i++) {
+    for (let i = 0; i < this.buttons.length; i++) {
       const button = this.buttons[i];
       button.activated = (button.value === val);
     }
diff --git a/packages/core/src/components/select/select.tsx b/packages/core/src/components/select/select.tsx
index a5c8697aec..759a50656f 100644
--- a/packages/core/src/components/select/select.tsx
+++ b/packages/core/src/components/select/select.tsx
@@ -304,7 +304,7 @@ export class Select {
   }
 
   openPopover(ev: UIEvent) {
-    let interfaceOptions = {...this.interfaceOptions};
+    const interfaceOptions = {...this.interfaceOptions};
 
     const popoverOpts: PopoverOptions = Object.assign(interfaceOptions, {
       component: 'ion-select-popover',
@@ -343,7 +343,7 @@ export class Select {
   }
 
   openActionSheet() {
-    let interfaceOptions = {...this.interfaceOptions};
+    const interfaceOptions = {...this.interfaceOptions};
 
     const actionSheetButtons: ActionSheetButton[] = this.childOpts.map(option => {
       return {
@@ -379,7 +379,7 @@ export class Select {
   }
 
   openAlert() {
-    let interfaceOptions = {...this.interfaceOptions};
+    const interfaceOptions = {...this.interfaceOptions};
 
     const label = this.getLabel();
     let labelText: string = null;
diff --git a/packages/core/src/components/skeleton-text/skeleton-text.tsx b/packages/core/src/components/skeleton-text/skeleton-text.tsx
index b86d9ffb21..7eb55812d8 100644
--- a/packages/core/src/components/skeleton-text/skeleton-text.tsx
+++ b/packages/core/src/components/skeleton-text/skeleton-text.tsx
@@ -6,7 +6,7 @@ import { Component, Prop } from '@stencil/core';
   styleUrl: 'skeleton-text.scss'
 })
 export class SkeletonText {
-  @Prop() width: string = '100%';
+  @Prop() width = '100%';
 
   render() {
     return <span style={{width: this.width}}>&nbsp;</span>;
diff --git a/packages/core/src/components/slides/slides.tsx b/packages/core/src/components/slides/slides.tsx
index 8ad039010a..6435082a4b 100644
--- a/packages/core/src/components/slides/slides.tsx
+++ b/packages/core/src/components/slides/slides.tsx
@@ -90,7 +90,7 @@ export class Slides {
 
   @Watch('options')
   updateSwiperOptions() {
-    let newOptions = this.normalizeOptions();
+    const newOptions = this.normalizeOptions();
     this.swiper.params = Object.assign({}, this.swiper.params, newOptions);
     this.update();
   }
@@ -98,7 +98,7 @@ export class Slides {
   /**
    * Show or hide the pager
    */
-  @Prop() pager: boolean = true;
+  @Prop() pager = true;
 
   render() {
     return (
@@ -141,7 +141,7 @@ export class Slides {
 
   normalizeOptions() {
       // Base options, can be changed
-      var swiperOptions = {
+      const swiperOptions = {
         effect: 'slide',
         autoplay: 0,
         direction: 'horizontal',
@@ -234,7 +234,7 @@ export class Slides {
 
       // Keep the event options separate, we dont want users
       // overwriting these
-      var eventOptions = {
+      const eventOptions = {
         onSlideChangeStart: this.ionSlideWillChange.emit,
         onSlideChangeEnd: this.ionSlideDidChange.emit,
         onSlideNextStart: this.ionSlideNextStart.emit,
diff --git a/packages/core/src/components/spinner/spinner.tsx b/packages/core/src/components/spinner/spinner.tsx
index af95501951..2e65fc372e 100644
--- a/packages/core/src/components/spinner/spinner.tsx
+++ b/packages/core/src/components/spinner/spinner.tsx
@@ -44,7 +44,7 @@ export class Spinner {
   /**
    * @input {boolean} If true, pause the animation.
    */
-  @Prop() paused: boolean = false;
+  @Prop() paused = false;
 
 
   private getName(): string {
diff --git a/packages/core/src/components/split-pane/split-pane.tsx b/packages/core/src/components/split-pane/split-pane.tsx
index ca92472760..4a572c3170 100644
--- a/packages/core/src/components/split-pane/split-pane.tsx
+++ b/packages/core/src/components/split-pane/split-pane.tsx
@@ -27,13 +27,13 @@ export class SplitPane {
   private rmL: any;
 
   @Element() private el: HTMLElement;
-  @State() private visible: boolean = false;
+  @State() private visible = false;
 
   /**
    * @input {boolean} If `false`, the split-pane is disabled, ie. the side pane will
    * never be displayed. Default `true`.
    */
-  @Prop() enabled: boolean = true;
+  @Prop() enabled = true;
 
   /**
    * @input {string | boolean} When the split-pane should be shown.
@@ -66,9 +66,9 @@ export class SplitPane {
     const children = this.el.children;
     const nu = this.el.childElementCount;
     let foundMain = false;
-    for (var i = 0; i < nu; i++) {
-      var child = children[i] as HTMLElement;
-      var isMain = child.hasAttribute('main');
+    for (let i = 0; i < nu; i++) {
+      let child = children[i] as HTMLElement;
+      let isMain = child.hasAttribute('main');
       if (isMain) {
         if (foundMain) {
           console.warn('split pane can not have more than one main node');
diff --git a/packages/core/src/components/tab/tab.tsx b/packages/core/src/components/tab/tab.tsx
index 4d8ca3664f..b171395be7 100644
--- a/packages/core/src/components/tab/tab.tsx
+++ b/packages/core/src/components/tab/tab.tsx
@@ -39,7 +39,7 @@ export class Tab {
   /**
    * @input {string} The badge color for the tab button.
    */
-  @Prop() badgeStyle: string = 'default';
+  @Prop() badgeStyle = 'default';
 
   /**
    * @input {boolean} If true, enable the tab. If false,
diff --git a/packages/core/src/components/tabbar/tabbar.tsx b/packages/core/src/components/tabbar/tabbar.tsx
index f0d30a3c6e..1d638fd9df 100644
--- a/packages/core/src/components/tabbar/tabbar.tsx
+++ b/packages/core/src/components/tabbar/tabbar.tsx
@@ -14,8 +14,8 @@ export class Tabbar {
 
   @Element() el: HTMLElement;
 
-  @State() canScrollLeft: boolean = false;
-  @State() canScrollRight: boolean = false;
+  @State() canScrollLeft = false;
+  @State() canScrollRight = false;
 
   @State() hidden = false;
 
@@ -33,9 +33,9 @@ export class Tabbar {
     this.highlight && this.updateHighlight();
   }
 
-  @Prop() layout: string = 'icon-top';
-  @Prop() highlight: boolean = false;
-  @Prop() translucent: boolean = false;
+  @Prop() layout = 'icon-top';
+  @Prop() highlight = false;
+  @Prop() translucent = false;
 
   @Listen('body:keyboardWillHide')
   protected onKeyboardWillHide() {
@@ -77,7 +77,7 @@ export class Tabbar {
       }
 
       if (!next && right > (tabsWidth + scrollLeft)) {
-        let amount = right - tabsWidth;
+        const amount = right - tabsWidth;
         next = {tab, amount};
       }
     });
@@ -189,7 +189,7 @@ export class Tabbar {
   updateHighlight() {
     this.dom.read(() => {
       const btn = this.getSelectedButton(),
-        ionTabbarHighlight: HTMLElement = this.highlight && this.el.querySelector('div.tabbar-highlight') as HTMLElement;
+        ionTabbarHighlight: HTMLElement = this.highlight && this.el.querySelector('div.tabbar-highlight');
 
       if (btn && ionTabbarHighlight) {
         ionTabbarHighlight.style.transform = `translate3d(${btn.offsetLeft}px,0,0) scaleX(${btn.offsetWidth})`;
diff --git a/packages/core/src/components/tabs/tabs.tsx b/packages/core/src/components/tabs/tabs.tsx
index fcbd53b157..161ee29236 100644
--- a/packages/core/src/components/tabs/tabs.tsx
+++ b/packages/core/src/components/tabs/tabs.tsx
@@ -10,7 +10,7 @@ import { Config } from '../../index';
   }
 })
 export class Tabs {
-  private ids: number = -1;
+  private ids = -1;
   private tabsId: number = (++tabIds);
 
   @Element() el: HTMLElement;
@@ -51,9 +51,9 @@ export class Tabs {
    * attribute needs to be set on the content.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
-  @Prop() scrollable: boolean = false;
+  @Prop() scrollable = false;
 
   /**
    * @output {any} Emitted when the tab changes.
@@ -91,7 +91,7 @@ export class Tabs {
     }
 
     // Reset rest of tabs
-    for (let tab of this.tabs) {
+    for (const tab of this.tabs) {
       if (selectedTab !== tab) {
         tab.selected = false;
       }
diff --git a/packages/core/src/components/textarea/textarea.tsx b/packages/core/src/components/textarea/textarea.tsx
index 1037181d91..cde3952e1f 100644
--- a/packages/core/src/components/textarea/textarea.tsx
+++ b/packages/core/src/components/textarea/textarea.tsx
@@ -52,17 +52,17 @@ export class Textarea implements TextareaComponent {
   /**
    * @input {string} Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Defaults to `"none"`.
    */
-  @Prop() autocapitalize: string = 'none';
+  @Prop() autocapitalize = 'none';
 
   /**
    * @input {string} Indicates whether the value of the control can be automatically completed by the browser. Defaults to `"off"`.
    */
-  @Prop() autocomplete: string = 'off';
+  @Prop() autocomplete = 'off';
 
   /**
    * @input {string} This Boolean attribute lets you specify that a form control should have input focus when the page loads. Defaults to `false`.
    */
-  @Prop() autofocus: boolean = false;
+  @Prop() autofocus = false;
 
   /**
    * @input {boolean} If true, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
@@ -72,7 +72,7 @@ export class Textarea implements TextareaComponent {
   /**
    * @input {number} Set the amount of time, in milliseconds, to wait to trigger the `ionInput` event after each keystroke. Default `0`.
    */
-  @Prop() debounce: number = 0;
+  @Prop() debounce = 0;
 
   @Watch('debounce')
   private debounceInput() {
@@ -85,7 +85,7 @@ export class Textarea implements TextareaComponent {
   /**
    * @input {boolean} If true, the user cannot interact with the textarea. Defaults to `false`.
    */
-  @Prop() disabled: boolean = false;
+  @Prop() disabled = false;
 
   @Watch('disabled')
   protected disabledChanged() {
@@ -115,17 +115,17 @@ export class Textarea implements TextareaComponent {
   /**
    * @input {boolean} If true, the user cannot modify the value. Defaults to `false`.
    */
-  @Prop() readonly: boolean = false;
+  @Prop() readonly = false;
 
   /**
    * @input {boolean} If true, the user must fill in a value before submitting a form.
    */
-  @Prop() required: boolean = false;
+  @Prop() required = false;
 
   /**
    * @input {string} If true, the element will have its spelling and grammar checked. Defaults to `false`.
    */
-  @Prop() spellcheck: boolean = false;
+  @Prop() spellcheck = false;
 
   /**
    * @input {number} The visible width of the text control, in average character widths. If it is specified, it must be a positive integer.
@@ -166,7 +166,7 @@ export class Textarea implements TextareaComponent {
   private emitStyle() {
     clearTimeout(this.styleTmr);
 
-    let styles = {
+    const styles = {
       'textarea': true,
       'input': true,
       'input-disabled': this.disabled,
diff --git a/packages/core/src/components/toast/animations/ios.enter.ts b/packages/core/src/components/toast/animations/ios.enter.ts
index 36550e7383..197542d6c4 100644
--- a/packages/core/src/components/toast/animations/ios.enter.ts
+++ b/packages/core/src/components/toast/animations/ios.enter.ts
@@ -7,7 +7,7 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
   const baseAnimation = new Animation();
 
   const wrapperAnimation = new Animation();
-  const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
+  const wrapperEle = baseElm.querySelector('.toast-wrapper');
   wrapperAnimation.addElement(wrapperEle);
 
   switch (position) {
@@ -15,7 +15,7 @@ export default function iosEnterAnimation(Animation: Animation, baseElm: HTMLEle
       wrapperAnimation.fromTo('translateY', '-100%', '10px');
       break;
     case 'middle':
-      let topPosition = Math.floor(
+      const topPosition = Math.floor(
         baseElm.clientHeight / 2 - wrapperEle.clientHeight / 2
       );
       wrapperEle.style.top = `${topPosition}px`;
diff --git a/packages/core/src/components/toast/animations/ios.leave.ts b/packages/core/src/components/toast/animations/ios.leave.ts
index 0bcba2ef18..fe8c49c6c6 100644
--- a/packages/core/src/components/toast/animations/ios.leave.ts
+++ b/packages/core/src/components/toast/animations/ios.leave.ts
@@ -7,7 +7,7 @@ export default function iosLeaveAnimation(Animation: Animation, baseElm: HTMLEle
   const baseAnimation = new Animation();
 
   const wrapperAnimation = new Animation();
-  const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
+  const wrapperEle = baseElm.querySelector('.toast-wrapper');
   wrapperAnimation.addElement(wrapperEle);
   switch (position) {
     case 'top':
diff --git a/packages/core/src/components/toast/animations/md.enter.ts b/packages/core/src/components/toast/animations/md.enter.ts
index 9ae825d98d..91cb8e6723 100644
--- a/packages/core/src/components/toast/animations/md.enter.ts
+++ b/packages/core/src/components/toast/animations/md.enter.ts
@@ -7,7 +7,7 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
   const baseAnimation = new Animation();
 
   const wrapperAnimation = new Animation();
-  const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
+  const wrapperEle = baseElm.querySelector('.toast-wrapper');
   wrapperAnimation.addElement(wrapperEle);
 
   switch (position) {
@@ -15,7 +15,7 @@ export default function mdEnterAnimation(Animation: Animation, baseElm: HTMLElem
       wrapperAnimation.fromTo('translateY', '-100%', '0%');
       break;
     case 'middle':
-      let topPosition = Math.floor(
+      const topPosition = Math.floor(
         baseElm.clientHeight / 2 - wrapperEle.clientHeight / 2
       );
       wrapperEle.style.top = `${topPosition}px`;
diff --git a/packages/core/src/components/toast/animations/md.leave.ts b/packages/core/src/components/toast/animations/md.leave.ts
index 4330c4d934..b47bae2a58 100644
--- a/packages/core/src/components/toast/animations/md.leave.ts
+++ b/packages/core/src/components/toast/animations/md.leave.ts
@@ -7,7 +7,7 @@ export default function mdLeaveAnimation(Animation: Animation, baseElm: HTMLElem
   const baseAnimation = new Animation();
 
   const wrapperAnimation = new Animation();
-  const wrapperEle = baseElm.querySelector('.toast-wrapper') as HTMLElement;
+  const wrapperEle = baseElm.querySelector('.toast-wrapper');
   wrapperAnimation.addElement(wrapperEle);
 
   switch (position) {
diff --git a/packages/core/src/components/toast/toast.tsx b/packages/core/src/components/toast/toast.tsx
index 78ad9f36e4..b9df7b0d00 100644
--- a/packages/core/src/components/toast/toast.tsx
+++ b/packages/core/src/components/toast/toast.tsx
@@ -69,9 +69,9 @@ export class Toast {
   @Prop() closeButtonText: string;
   @Prop() dismissOnPageChange: boolean;
   @Prop() position: string;
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
   @Prop() toastId: string;
-  @Prop() willAnimate: boolean = true;
+  @Prop() willAnimate = true;
 
   @Prop() enterAnimation: AnimationBuilder;
   @Prop() leaveAnimation: AnimationBuilder;
@@ -158,7 +158,7 @@ export class Toast {
   }
 
   wrapperClass(): CssClassMap {
-    let wrapperClass: string[] = !this.position
+    const wrapperClass: string[] = !this.position
       ? ['toast-wrapper', 'toast-bottom']
       : [`toast-wrapper`, `toast-${this.position}`];
     return wrapperClass.reduce((prevValue: any, cssClass: any) => {
diff --git a/packages/core/src/components/toggle/toggle.tsx b/packages/core/src/components/toggle/toggle.tsx
index 63519c65a9..9768380978 100644
--- a/packages/core/src/components/toggle/toggle.tsx
+++ b/packages/core/src/components/toggle/toggle.tsx
@@ -49,12 +49,12 @@ export class Toggle implements CheckboxInput {
   /**
    * @input {boolean} If true, the toggle is selected. Defaults to `false`.
    */
-  @Prop({ mutable: true }) checked: boolean = false;
+  @Prop({ mutable: true }) checked = false;
 
   /*
    * @input {boolean} If true, the user cannot interact with the toggle. Default false.
    */
-  @Prop({ mutable: true }) disabled: boolean = false;
+  @Prop({ mutable: true }) disabled = false;
 
   /**
    * @input {string} the value of the toggle.
diff --git a/packages/core/src/components/toolbar/toolbar.tsx b/packages/core/src/components/toolbar/toolbar.tsx
index 2255f5fbbe..16df39d9c2 100644
--- a/packages/core/src/components/toolbar/toolbar.tsx
+++ b/packages/core/src/components/toolbar/toolbar.tsx
@@ -38,11 +38,11 @@ export class Toolbar {
    * attribute needs to be set on the content.
    * Only affects `ios` mode. Defaults to `false`.
    */
-  @Prop() translucent: boolean = false;
+  @Prop() translucent = false;
 
   componentDidLoad() {
     const buttons = this.el.querySelectorAll('ion-button') as any;
-    for (var i = 0; i < buttons.length; i++) {
+    for (let i = 0; i < buttons.length; i++) {
       buttons[i].setAttribute('button-type', 'bar-button');
     }
   }
diff --git a/packages/core/src/global/config-controller.ts b/packages/core/src/global/config-controller.ts
index ef197bb283..c1bb5eee54 100644
--- a/packages/core/src/global/config-controller.ts
+++ b/packages/core/src/global/config-controller.ts
@@ -7,7 +7,7 @@ export function createConfigController(configObj: any, platforms: PlatformConfig
 
   function get(key: string, fallback?: any): any {
 
-    let queryValue = queryParam(window.location.href, `ionic${key}`);
+    const queryValue = queryParam(window.location.href, `ionic${key}`);
     if (isDef(queryValue)) {
       return configObj[key] = (queryValue === 'true' ? true : queryValue === 'false' ? false : queryValue);
     }
diff --git a/packages/core/src/global/platform-configs.ts b/packages/core/src/global/platform-configs.ts
index d9bd371502..59185716fc 100644
--- a/packages/core/src/global/platform-configs.ts
+++ b/packages/core/src/global/platform-configs.ts
@@ -67,9 +67,9 @@ export function isPlatformMatch(url: string, userAgent: string, platformName: st
   if (userAgent) {
     userAgent = userAgent.toLowerCase();
 
-    for (var i = 0; i < userAgentAtLeastHas.length; i++) {
+    for (let i = 0; i < userAgentAtLeastHas.length; i++) {
       if (userAgent.indexOf(userAgentAtLeastHas[i]) > -1) {
-        for (var j = 0; j < userAgentMustNotHave.length; j++) {
+        for (let j = 0; j < userAgentMustNotHave.length; j++) {
           if (userAgent.indexOf(userAgentMustNotHave[j]) > -1) {
             return false;
           }
@@ -85,8 +85,8 @@ export function isPlatformMatch(url: string, userAgent: string, platformName: st
 
 export function queryParam(url: string, key: string) {
   key = key.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
-  var regex = new RegExp('[\\?&]' + key + '=([^&#]*)');
-  var results = regex.exec(url);
+  let regex = new RegExp('[\\?&]' + key + '=([^&#]*)');
+  let results = regex.exec(url);
   return results ? decodeURIComponent(results[1].replace(/\+/g, ' ')) : null;
 }
 
diff --git a/packages/core/src/global/test/config-controller.spec.ts b/packages/core/src/global/test/config-controller.spec.ts
index 939c9e2a55..ed43cb4963 100644
--- a/packages/core/src/global/test/config-controller.spec.ts
+++ b/packages/core/src/global/test/config-controller.spec.ts
@@ -2,7 +2,7 @@ import { createConfigController } from '../config-controller';
 
 describe('Config', () => {
   it('should get a value from the config', () => {
-    let config = createConfigController({ name: 'Doc Brown' }, null);
+    const config = createConfigController({ name: 'Doc Brown' }, null);
     expect(config.get('name')).toEqual('Doc Brown');
   });
 });
diff --git a/packages/core/src/global/test/query-param.spec.ts b/packages/core/src/global/test/query-param.spec.ts
index f199444b90..5f2459e184 100644
--- a/packages/core/src/global/test/query-param.spec.ts
+++ b/packages/core/src/global/test/query-param.spec.ts
@@ -2,18 +2,18 @@ import { queryParam } from '../platform-configs';
 
 describe('QueryParam', () => {
   it('should read the url for a queryParam', () => {
-    let qp = queryParam('?boolean=false', 'boolean');
+    const qp = queryParam('?boolean=false', 'boolean');
     expect(qp).toBeDefined();
     expect(qp).toEqual('false');
   });
 
   it('should get the value of  queryParam', () => {
-    let qp = queryParam('?keyValue=b', 'keyValue');
+    const qp = queryParam('?keyValue=b', 'keyValue');
     expect(qp).toEqual('b');
   });
 
   it('should show nullfor a queryParam this is not passed', () => {
-    let qp = queryParam('', 'ionicanimate');
+    const qp = queryParam('', 'ionicanimate');
     expect(qp).toBeNull();
   });
 });
diff --git a/packages/core/src/utils/dom-framework-delegate.ts b/packages/core/src/utils/dom-framework-delegate.ts
index b9e54c06d9..653f81027d 100644
--- a/packages/core/src/utils/dom-framework-delegate.ts
+++ b/packages/core/src/utils/dom-framework-delegate.ts
@@ -5,7 +5,7 @@ export class DomFrameworkDelegate implements FrameworkDelegate {
 
   attachViewToDom(parentElement: HTMLElement, tagOrElement: string | HTMLElement, propsOrDataObj: any = {}, classesToAdd: string[] = []): Promise<FrameworkMountingData> {
     return new Promise((resolve) => {
-      const usersElement = (isString(tagOrElement) ? document.createElement(tagOrElement) : tagOrElement) as HTMLElement;
+      const usersElement = (isString(tagOrElement) ? document.createElement(tagOrElement) : tagOrElement);
       Object.assign(usersElement, propsOrDataObj);
 
       if (classesToAdd.length) {
diff --git a/packages/core/src/utils/helpers.ts b/packages/core/src/utils/helpers.ts
index 80f57160ee..bfdf851cf1 100644
--- a/packages/core/src/utils/helpers.ts
+++ b/packages/core/src/utils/helpers.ts
@@ -1,4 +1,4 @@
-import { Animation, DomController, StencilElement } from '../index';
+import { Animation, StencilElement } from '../index';
 
 export function clamp(min: number, n: number, max: number) {
   return Math.max(min, Math.min(n, max));
@@ -59,7 +59,7 @@ export function pointerCoordX(ev: any): number {
   // get X coordinates for either a mouse click
   // or a touch depending on the given event
   if (ev) {
-    var changedTouches = ev.changedTouches;
+    let changedTouches = ev.changedTouches;
     if (changedTouches && changedTouches.length > 0) {
       return changedTouches[0].clientX;
     }
@@ -76,9 +76,9 @@ export function updateDetail(ev: any, detail: any) {
   let x = 0;
   let y = 0;
   if (ev) {
-    var changedTouches = ev.changedTouches;
+    let changedTouches = ev.changedTouches;
     if (changedTouches && changedTouches.length > 0) {
-      var touch = changedTouches[0];
+      let touch = changedTouches[0];
       x = touch.clientX;
       y = touch.clientY;
     } else if (ev.pageX !== undefined) {
@@ -94,7 +94,7 @@ export function pointerCoordY(ev: any): number {
   // get Y coordinates for either a mouse click
   // or a touch depending on the given event
   if (ev) {
-    var changedTouches = ev.changedTouches;
+    let changedTouches = ev.changedTouches;
     if (changedTouches && changedTouches.length > 0) {
       return changedTouches[0].clientY;
     }
@@ -154,7 +154,7 @@ export function applyStyles(elm: HTMLElement, styles: {[styleProp: string]: stri
   const styleProps = Object.keys(styles);
 
   if (elm) {
-    for (var i = 0; i < styleProps.length; i++) {
+    for (let i = 0; i < styleProps.length; i++) {
       (elm.style as any)[styleProps[i]] = styles[styleProps[i]];
     }
   }
@@ -179,7 +179,7 @@ export function checkEdgeSide(posX: number, isRightSide: boolean, maxEdgeStart:
  * @param isRTL whether the application dir is rtl
  * @param defaultRight whether the default side is right
  */
-export function isRightSide(side: Side, defaultRight: boolean = false): boolean {
+export function isRightSide(side: Side, defaultRight = false): boolean {
   const isRTL = document.dir === 'rtl';
   switch (side) {
     case 'right': return true;
@@ -288,7 +288,7 @@ export function domControllerAsync(domControllerFunction: Function, callback?: F
   });
 }
 
-export function debounce(func: Function, wait: number = 250) {
+export function debounce(func: Function, wait = 250) {
   let timer: number;
   return (...args: any[]): void => {
     clearTimeout(timer);
diff --git a/packages/core/src/utils/theme.ts b/packages/core/src/utils/theme.ts
index 3acf2bd13c..9b953232ad 100644
--- a/packages/core/src/utils/theme.ts
+++ b/packages/core/src/utils/theme.ts
@@ -4,7 +4,7 @@ import { CssClassMap } from '@stencil/core';
  * Create the mode and color classes for the component based on the classes passed in
  */
 export function createThemedClasses(mode: string, color: string, classes: string): CssClassMap {
-  let classObj: CssClassMap = {};
+  const classObj: CssClassMap = {};
 
   return classes.split(' ')
     .reduce((classObj: CssClassMap, classString: string): CssClassMap => {
@@ -27,9 +27,9 @@ export function createThemedClasses(mode: string, color: string, classes: string
  * Get the classes from a class list and return them as an object
  */
 export function getElementClassObject(classList: DOMTokenList | string[]): CssClassMap {
-  let classObj: CssClassMap = {};
+  const classObj: CssClassMap = {};
 
-  for (var i = 0; i < classList.length; i++) {
+  for (let i = 0; i < classList.length; i++) {
     classObj[classList[i]] = true;
   }