How to run and debug the custom visuals through visual studio code for power bi

Question

Hi,&nbsp;Developed the custom visuals in power bi using visual studio code with d3.js and dom javascripts. But am not able to debug the code line by line and see the data flow in it. Done the code changes in 'visual.ts' file. Did configuration changes in 'tsconfig.json' &amp; 'launch.json' but not able to debug the code. &nbsp;I have tried with extensions in visual studio code but not able to debug.If there are any other possibilities or ways to debug the code let me know.I have mentioned the ways i have tried changes in 'tsconfig.json' &amp; 'launch.json'&nbsp; provided the structure below for reference.launch.json{&nbsp; &nbsp; "version": "0.2.0",&nbsp; &nbsp; "configurations": [&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "type": "node",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "preLaunchTask": "tsc: build - tsconfig.json", // ADD&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "request": "launch",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "name": "Launch Program",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "skipFiles": [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "&amp;LeftAngleBracket;node_internals&amp;RightAngleBracket;/**"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "program": "${workspaceFolder}/visual.ts",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "outFiles": [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "${workspaceFolder}/lib/**/*.js" // CHANGE "${workspaceFolder}/**/*.js"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ]&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; ]}tsconfig.json{&nbsp; &nbsp; "compilerOptions": {&nbsp; &nbsp; &nbsp; &nbsp; "allowJs": false,&nbsp; &nbsp; &nbsp; &nbsp; "emitDecoratorMetadata": true,&nbsp; &nbsp; &nbsp; &nbsp; "experimentalDecorators": true,&nbsp; &nbsp; &nbsp; &nbsp; "target": "ES2020",&nbsp; &nbsp; &nbsp; &nbsp; "sourceMap": true,&nbsp; &nbsp; &nbsp; &nbsp; "outDir": "out",&nbsp; &nbsp; &nbsp; &nbsp; "moduleResolution": "node",&nbsp; &nbsp; &nbsp; &nbsp; "declaration": true,&nbsp; &nbsp; &nbsp; &nbsp; "lib": [&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "ES2020",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "dom"&nbsp; &nbsp; &nbsp; &nbsp; ]&nbsp; &nbsp; },&nbsp; &nbsp; "files": [&nbsp; &nbsp; &nbsp; &nbsp; "./src/visual.ts"&nbsp; &nbsp; ]} &nbsp;It would be helpful to know the ways of debugging the code

anonymous · Accepted Answer

Hi&nbsp; Anonymous&nbsp;,
This is the related document, you can view this content:
How to debug Power BI custom visuals - Power BI | Microsoft Learn
Solved: Re: How to Debug while developing Custom Visuals - Microsoft Power BI Community
Develop custom visuals in Power BI - Power BI | Microsoft Learn
&nbsp;
Best Regards,
Liu Yang
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

Forum Discussion

How to run and debug the custom visuals through visual studio code for power bi

2 Replies

Related content

Custom Visual

Custom Matrix Visual

custom visual development

LLM Chatbot custom visual

Power BI Custom Visuals