RC.0: how do you use the Chrome Debugger with the Rollup bundler?

@rajpatangay unfortunately it didn’t worked :frowning: if you don’t mind, could you show me your tsconfig.json file? maybe I’m miss something else

@PhilippRath thx for the strange behavior tips, but doesn’t work for me neither

Here you go -

{
“compilerOptions”: {
“allowSyntheticDefaultImports”: true,
“declaration”: true,
“emitDecoratorMetadata”: true,
“experimentalDecorators”: true,
“sourceMap”: true,
“lib”: [
“dom”,
“es2015”
],
“module”: “es2015”,
“moduleResolution”: “node”,
“target”: “es5”
},
“exclude”: [
“node_modules”
],
“compileOnSave”: false,
“atom”: {
“rewriteTsconfig”: false
}
}

Hi, I tried with "sourceMap": true, and with "sourceMaps": true, but the issues still remains.

thx @rajpatangay … unfortunately I have no differences and therefor still not able to debug properly :frowning:

Same problem here… any solution?

not that I know :frowning:

After the command npm install @inoic/app-scripts@latest --save-dev I’m able to see all *.ts file in chrome. Debug works, but I noticed that if I put the breakpoint in function call it doesn’t work. Instead if I put breakpoint in the function called (in any simple instruction) it works. See example:

A. breakpoint in 3 doesn’t work
B. breakpoint in 6 (or 7, or 8) it’s ok.
C. breakpoint in 9 doesn’t work.

1. f1(){
2. ...
3. this.f2();
4.}

5. f2(){
6. let i =1;
7. i++
8. i = 1+2;
9. this.f3();
10. i++;
11. }

f3(){
...
let j =1;
}
1 Like

Debugging is almost working, but stepping through often sends me into chunks of transpiled javascript rather than the actual typescript. Almost working though and can see variable values most of the time. It’s like the source maps are there but not quite correct. Using app-scripts 0.0.30.

Also experiencing this behaviour, definitely feels like a source map issue. Random breakpoints are skipped, some work.

Since I’m not alone facing the problem, I opened an issue in the github’s project. Maybe/probably not a bug but who knows…

1 Like

@everyone, please make sure you update to the latest @ionic/app-scripts in the next day or so.

We have been pushing out updates fast and furiously.

npm install @ionic/app-scripts@latest

Thanks,
Dan

Hooray, you’re the best! Thx a lot.

Seems to be now fixed and working for me, I’m able to debug in providers and pages (installed version 0.0.32)

1 Like

in package.json add
"build": "ionic-app-scripts build --dev --debug"
after… you can run using by example:
ionic run android

1 Like

Ok I confirm this is working in Chrome in main.js file. 2 Questions:

1.) Is it possible to show call stack in Chrome?
2.) Anybody managed to do this with TypeScript?

http://imgur.com/aShNEP5

Yes. Its possible to see Call Stack in Chrome.(I have chrome debugger running with “Dev Tools Theme: Zero Dark Matrix” chrome extension running.)

Also I am able to see Call Stack when debugging typescript code See Image -image

1 Like

Agree, I was able to do this with plain Chrome as well, just click on src folder. Now the interesting part will be if JetBrains will chime in and enable this feature in their JetBrains Inspector. I think I will open a request with them.