# Debugging typescript in chrome? **URL:** \ **Category:** ionic-v3\ **Created:** [February 14, 2016, 2:05pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692 "2016-02-14T14:05:30Z")\ **Posts on this page:** 17\ **Page:** 1
**Author:** ![sebastianovide](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/sebastianovide/32/97090_2.png) [@sebastianovide](https://forum.ionicframework.com/u/sebastianovide)\ **Post date:** [February 14, 2016, 2:05pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/1 "2016-02-14T14:05:30Z")
Hi, I’m coming from the angular 1.x / plain JS and experimenting with Ionic 2 (Angular 2 / typescript). I’m used to set break points or adding the `debugger` keyword and see my code in chrome. I’m trying to do the same with ionic 2 after running the command `ionic serve` but without success. I see the map files being created but in chrome I see only the `app.bundle.js`. Any idea ? thanks ---
**Author:** ![icarus\_31](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/icarus_31/32/94713_2.png) [@icarus\_31](https://forum.ionicframework.com/u/icarus_31)\ **Post date:** [February 14, 2016, 2:16pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/2 "2016-02-14T14:16:29Z")
I personally, use the app.bundle.js to debug. Your typescript code is there, but not it is in “raw” Javascript. It is not that bad though. I put “sourceMap”: true in my tsconfig file, but it does not seem to do anything. For sure, if someone answer your request that would be nice. ---
**Author:** ![sebastianovide](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/sebastianovide/32/97090_2.png) [@sebastianovide](https://forum.ionicframework.com/u/sebastianovide)\ **Post date:** [February 14, 2016, 3:25pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/3 "2016-02-14T15:25:26Z")
here is the trick: after putting “sourceMap”: true in your tsconfig add `devtool: 'source-map',` to webpack.config.js ``` module.exports = { devtool: 'source-map', ``` ---
**Author:** ![icarus\_31](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/icarus_31/32/94713_2.png) [@icarus\_31](https://forum.ionicframework.com/u/icarus_31)\ **Post date:** [February 14, 2016, 5:58pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/4 "2016-02-14T17:58:14Z")
kudos to you! Thanks ---
**Author:** ![lehresman](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/lehresman/32/73184_2.png) [@lehresman](https://forum.ionicframework.com/u/lehresman)\ **Post date:** [February 15, 2016, 2:28am UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/5 "2016-02-15T02:28:38Z")
Works great, thanks for the tip! ---
**Author:** ![Tommertom](https://avatars.discourse-cdn.com/v4/letter/t/ed8c4c/32.png) [@Tommertom](https://forum.ionicframework.com/u/Tommertom)\ **Post date:** [February 20, 2016, 8:40pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/6 "2016-02-20T20:40:40Z")
Sebastian, you made my day!!! This should be part of a FAQ or in the typescript default starter files! ---
**Author:** ![malyaristvan](https://avatars.discourse-cdn.com/v4/letter/m/ba8739/32.png) [@malyaristvan](https://forum.ionicframework.com/u/malyaristvan)\ **Post date:** [February 29, 2016, 8:10pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/7 "2016-02-29T20:10:20Z")
Hy, i tried your suggestion but when i try to debug an app on an android device with chrome dev tools and i hit save on the edited app.bundle.js the app closes, any idea why? Thanks in advance. ---
**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\ **Post date:** [February 29, 2016, 8:31pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/8 "2016-02-29T20:31:46Z")
Thats asking too much for chrome dev tools, when inspecting device its aimed to see the code in the device, not modifying it, i think it’s not a good idea to do that, after all the js code in device is supposed to be transpiled down to ES5, and the debug showing in Typescript are due to SourceMaps, it’s not actual code. ---
**Author:** ![malyaristvan](https://avatars.discourse-cdn.com/v4/letter/m/ba8739/32.png) [@malyaristvan](https://forum.ionicframework.com/u/malyaristvan)\ **Post date:** [February 29, 2016, 8:38pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/9 "2016-02-29T20:38:08Z")
I was asking because in ionic one i could do that, i mean save it in dev tools just until the session, of course it wasnt permanent after i closed the app that edit code disappeared, no problem with that, but know i cant do that in ionic2 when i hit save in the dev tools the app restarts so my session is gone so the code is gone ---
**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\ **Post date:** [February 29, 2016, 8:54pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/10 "2016-02-29T20:54:15Z")
As i said, ionic 2 code is at least transpiled to ES5, so if you suddenly change the code to ES6 equivalent it will not be able to understand it and it will crash, or at least is what i think it should be happening, is what i expect to happen. ---
**Author:** ![stirumala](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/stirumala/32/102281_2.png) [@stirumala](https://forum.ionicframework.com/u/stirumala)\ **Post date:** [March 8, 2016, 6:23pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/11 "2016-03-08T18:23:37Z")
Follow steps from 1 and 2 and restart your app with ionic serve **1) enable it in your webpack config** [https://github.com/mhartington/Devnexus2016/blob/master/webpack.config.js#L16](https://github.com/mhartington/Devnexus2016/blob/master/webpack.config.js#L16) \*\* 2) In your tsconfig\*\* [https://github.com/mhartington/Devnexus2016/blob/master/tsconfig.json#L9](https://github.com/mhartington/Devnexus2016/blob/master/tsconfig.json#L9) [https://github.com/mhartington/Devnexus2016/blob/master/tsconfig.json#L10](https://github.com/mhartington/Devnexus2016/blob/master/tsconfig.json#L10) **3) restart the server** After restart you should able debug typescripts files using chrome developer tools under **source\> (webpack)building folder** ---
**Author:** ![CanKattw](https://avatars.discourse-cdn.com/v4/letter/c/58f4c7/32.png) [@CanKattw](https://forum.ionicframework.com/u/CanKattw)\ **Post date:** [June 29, 2016, 11:39am UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/12 "2016-06-29T11:39:12Z")
you are even able to debug from your IDE and not via Chrome. For IntelliJ or WebStorm see [http://blog.thecodecampus.de/setup-ionic-2-typescript-debugging-intellijwebstormjetbrains-ide/](http://blog.thecodecampus.de/setup-ionic-2-typescript-debugging-intellijwebstormjetbrains-ide/) ---
**Author:** ![LouisR](https://avatars.discourse-cdn.com/v4/letter/l/9de053/32.png) [@LouisR](https://forum.ionicframework.com/u/LouisR)\ **Post date:** [March 27, 2017, 10:51am UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/13 "2017-03-27T10:51:38Z")
I am using ionic 2.2.0, is webpack the default bundler ? I think @mhartington said that they did not put a default bundler in ionic to leave possibilities open. ---
**Author:** ![mburger81](https://avatars.discourse-cdn.com/v4/letter/m/bc8723/32.png) [@mburger81](https://forum.ionicframework.com/u/mburger81)\ **Post date:** [June 28, 2017, 8:05am UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/14 "2017-06-28T08:05:45Z")
On ionic3 this solution is not working anymore. Can someone help find out the new solution?? We need to debug ionic-angular lib in our app, how can we do this? ---
**Author:** ![stirumala](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/stirumala/32/102281_2.png) [@stirumala](https://forum.ionicframework.com/u/stirumala)\ **Post date:** [June 30, 2017, 6:47pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/16 "2017-06-30T18:47:20Z")
you don’t need this any more in ionic3 it prebuild you can see sources:localhost:8100 ---
**Author:** ![ionicdeve123](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ionicdeve123/32/113460_2.png) [@ionicdeve123](https://forum.ionicframework.com/u/ionicdeve123)\ **Post date:** [August 25, 2017, 12:26pm UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/17 "2017-08-25T12:26:45Z")
I tried your suggetion its not working in my app ☹ ---
**Author:** ![chandelkushal](https://avatars.discourse-cdn.com/v4/letter/c/e56c9b/32.png) [@chandelkushal](https://forum.ionicframework.com/u/chandelkushal)\ **Post date:** [September 15, 2017, 5:17am UTC](https://forum.ionicframework.com/t/debugging-typescript-in-chrome/43692/18 "2017-09-15T05:17:34Z")
this is not working when it is connect to real device not abel to see TS file.