Why is a local var not available in an Angular2 Component from the Chrome debugger? <p>I just wasted a few hours on this, but I want to understand why.</p> <p>I was importing Lodash into my angular2 project and it was not available in my component when I inspected from a breakpoint in the Chrome debugger. But then I used it in a <code>console.log('lodash version:', _.VERSION);</code> statement, and magically it was there (all along?). And now it is visible in the Chrome debugger.</p> <p>What is happening behind the scenes here?</p> <pre><code>import { Component } from '@angular/core'; import { ionicBootstrap, Platform } from 'ionic-angular'; import { StatusBar } from 'ionic-native'; import { HomePage } from './pages/home/home'; import * as _ from "lodash"; console.log('0. lodash version:', _.VERSION); /* * _ is available here in the Chrome debugger */ @Component({ template: '&lt;ion-nav [root]="rootPage"&gt;&lt;/ion-nav&gt;' }) export class MyApp { rootPage: any = HomePage; constructor(platform: Platform) { /* * _ is NOT available here in Chrome debugger unless I uncomment line below * VM1073:1 Uncaught ReferenceError: _ is not defined(…) */ // console.log('1. lodash version:', _.VERSION); platform.ready().then(() =&gt; { // Okay, so the platform is ready and our plugins are available. // Here you can do any higher level native things you might need. StatusBar.styleDefault(); }); } } ionicBootstrap(MyApp); </code></pre>