Creating new CustomVisual

[vraja_12]

Hi all, 

So I am trying to get my hands dirty with PowerBI custom visuals and have been following these 2 tutorials: 

1) https://docs.microsoft.com/en-us/power-bi/developer/custom-visual-develop-tutorial

2) https://www.youtube.com/watch?v=HRMLdaB3ogs

I have followed the tutorials to the dot and downloaded both node.js and visual studio code. My node.js version is v10.16.3 and npm version is 6.9.0. 

When I create a new pbiviz project, both tutorials show that I am supposed to see 

1) ".api" as an option above the ".vscode" 

2) "externalJS" in pbiviz.json should contain "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.js"

3) There should be a "powerbi-visuals-utils-dataviewutils" folder under node_modules

However when I followed the instructions, I got none of the above. Here is what my view looks like: 

It seems like my "powerbi-visuals-utils-dataviewutils" was not packaged properly but I am unsure of how to go about debugging this. Thanks!

[dm-p]

Hi @vraja_12,

The documentation linked is for the older versions of the custom visuals SDK and will not work or result in the same outcomes for the latest version (3.x). There is no updated tutorial for the latest version in documentation form, so the video you linked is probably the most up-to-date asset from MS. Makes it a bit harder for people to learn 😞

If you want the tutorial to work as-is, you'll need to make sure the SDK is "downgraded" to work with the version in the tutorial. In this section, modify step 2 from:

npm i -g powerbi-visuals-tools

to:

npm i -g powerbi-visuals-tools@2.5

You should then be able to continue the tutorial as normal.

In v3 of the SDK, the .api folder is replaced with seeing powerbi-visuals-api in your node_modules folder, so if you see that in your folder, then this bit is actually okay.

Regards,

Daniel

[vraja_12]

Hi Daniel, 

Thank you for the explanation! I'll try your recommendation and report back on how it works for me. 

Regards,

Vaishali