cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
mrogunlana Frequent Visitor
Frequent Visitor

Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

HI All,

 

I get the following exception when running pbiviz on a new visual

c:\Projects\visuals\powerbi\test2>pbiviz start
info Building visual...
error TYPESCRIPT /visualPlugin.ts : (8,103) Property 'visual' does not exist on type 'typeof extensibility'.

 

used this, just to clarify the steps to produce these exceptions:

  1. pbiviz new {name}
  2. cd {dir to folder}
  3. added latest (e.g. 2.2.2) powerbi-visuals-api into dependencies of project by executing command npm install --save powerbi-visuals-api.
  4. added latest (e.g. 5.7.0) d3 into dependencies of project by executing command npm install --save d3.
  5. added latest (e.g. 5.0.1) d3 types into dependencies of project by executing command npm install --save @types/d3.
  6. ran npm install for good measure
  7. removed all modules definitions from each file of source code (e.g. from ./src/visual.ts and ./src/settings.ts
    module powerbi.extensibility.visual {...}
    (see "Changes inside of the visuals sources" here: https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/migrating-to-powerbi-visuals-tools-3-0...)
  8. added these imports to ./src/visual.ts for interfaces and classes
    import powerbi from "powerbi-visuals-api";
    import IViewport = powerbi.IViewport;
    import IVisualHost = powerbi.extensibility.visual.IVisualHost;
    import DataViewMetadataColumn = powerbi.DataViewMetadataColumn;
    import DataViewMetadata = powerbi.DataViewMetadata;
    import PrimitiveValue = powerbi.PrimitiveValue;
    import VisualObjectInstance = powerbi.VisualObjectInstance;
    import EnumerateVisualObjectInstancesOptions = powerbi.EnumerateVisualObjectInstancesOptions;
    import DataViewObjectPropertyIdentifier = powerbi.DataViewObjectPropertyIdentifier;
    import DataView = powerbi.DataView;
    import ValueTypeDescriptor = powerbi.ValueTypeDescriptor;
    import Fill = powerbi.Fill;
    import VisualConstructorOptions = powerbi.extensibility.visual.VisualConstructorOptions;
    import VisualUpdateOptions = powerbi.extensibility.visual.VisualUpdateOptions;
    import DataViewPropertyValue = powerbi.DataViewPropertyValue;
    import SortDirection = powerbi.SortDirection;
    import IVisual = powerbi.extensibility.visual.IVisual;
    import VisualObjectInstanceEnumeration = powerbi.VisualObjectInstanceEnumeration;
  9. added these imports to ./src/settings.ts
    import { dataViewObjectsParser } from "powerbi-visuals-utils-dataviewutils";
    import DataViewObjectsParser = dataViewObjectsParser.DataViewObjectsParser;
  10. removed settings specific functions
    private static parseSettings(dataView: DataView): VisualSettings {
                return VisualSettings.parse(dataView) as VisualSettings;
            }
    
            /** 
             * This function gets called for each of the objects defined in the capabilities files and allows you to select which of the 
             * objects and properties you want to expose to the users in the property pane.
             * 
             */
            public enumerateObjectInstances(options: EnumerateVisualObjectInstancesOptions): VisualObjectInstance[] | VisualObjectInstanceEnumerationObject {
                return VisualSettings.enumerateObjectInstances(this.settings || VisualSettings.getDefault(), options);
            }
  11. updated tsconfig to:
    {
      "compilerOptions": {
        "allowJs": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "ES6",
        "module": "amd",
        "sourceMap": true,
        "outDir": "./.tmp/build/",
        "moduleResolution": "node"
      },
      "files": [
        ".api/v2.2.0/PowerBI-visuals.d.ts",
        "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.d.ts",
        "node_modules/powerbi-visuals-api/index.d.ts",
        "src/settings.ts",
        "src/visual.ts"
      ]
    }
  12. updated pbiviz.json to: 
    {
      "visual": {
        "name": "test2",
        "displayName": "test2",
        "guid": "test22E2F85DEE16141ED87144301F2DFC4C8",
        "visualClassName": "Visual",
        "version": "1.0.0",
        "description": "",
        "supportUrl": "",
        "gitHubUrl": ""
      },
      "apiVersion": "2.2.0",
      "author": {
        "name": "",
        "email": ""
      },
      "assets": {
        "icon": "assets/icon.png"
      },
      "externalJS": [
        "node_modules/powerbi-visuals-utils-dataviewutils/lib/index.js",
        "node_modules/powerbi-visuals-api/index.js",
        "node_modules/d3/d3.min.js"
      ],
      "style": "style/visual.less",
      "capabilities": "capabilities.json",
      "dependencies": "dependencies.json",
      "stringResources": []
    }
  13. pbiviz start
  14. Exception is shown

 

For the full source code to this example, goto: https://github.com/mrogunlana/powerbi-2.2.0-example

 

Thank you for your help in advance!

1 ACCEPTED SOLUTION

Accepted Solutions
mrogunlana Frequent Visitor
Frequent Visitor

Re: Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

Ok, I answered my own question: for all those risk takers out there willing to take a deep dive into powerbi-visuals-tools 3.0, but have an older version installed pay close attention to this article: https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/migrating-to-powerbi-visuals-tools-3-0... with special emphasis on the section titled: "How to install powerbi-visuals-tools@beta"

 

What this article fails to mention is that if you have an existing version of the tools installed globally on npm, instead of simply running the command:

 

 

npm install powerbi-visuals-tools@beta

 

 

You must update your global instance as well with: 

 

 

npm install powerbi-visuals-tools@beta -g

 

Make sure you includ the global flag "-g" to update your local toolset. Then, create a new visual like so:

pbiviz new {name}

and run it with the following command: 

 

npm run start

 

and you will see the new webpack runner in the command window.

 

**note: I had to update my security certificate as well with:

 

pbiviz --install-cert

follow the prompts after you run this command and you should be good to go. Hopefully this helps someone Smiley Happy

 

 

 

 

 

 

 

View solution in original post

1 REPLY 1
mrogunlana Frequent Visitor
Frequent Visitor

Re: Custom Visual Setup Exceptions (pbi-visuals-api 2.2.2, pbi-visuals-utils-dataviewutils 1.5.0)

Ok, I answered my own question: for all those risk takers out there willing to take a deep dive into powerbi-visuals-tools 3.0, but have an older version installed pay close attention to this article: https://microsoft.github.io/PowerBI-visuals/docs/how-to-guide/migrating-to-powerbi-visuals-tools-3-0... with special emphasis on the section titled: "How to install powerbi-visuals-tools@beta"

 

What this article fails to mention is that if you have an existing version of the tools installed globally on npm, instead of simply running the command:

 

 

npm install powerbi-visuals-tools@beta

 

 

You must update your global instance as well with: 

 

 

npm install powerbi-visuals-tools@beta -g

 

Make sure you includ the global flag "-g" to update your local toolset. Then, create a new visual like so:

pbiviz new {name}

and run it with the following command: 

 

npm run start

 

and you will see the new webpack runner in the command window.

 

**note: I had to update my security certificate as well with:

 

pbiviz --install-cert

follow the prompts after you run this command and you should be good to go. Hopefully this helps someone Smiley Happy

 

 

 

 

 

 

 

View solution in original post

Helpful resources

Announcements
Can You Solve These Challenge

Challenge: Can You Solve These?

Find out how to participate in the first Power BI 'Can You Solve These?' challenge.

Community News & Announcements

Community News & Announcements

Get your latest community news and announcements.

Virtual Launch Event

Microsoft Business Applications October Virtual Launch Event

Join us for an in-depth look at the new innovations across Dynamics 365 and the Microsoft Power Platform.

Community Kudopalooza

Win Power BI Swag with Community Kudopalooza!

Each week, complete activities and be qualified in the drawing for cool Power BI Swag.

Top Kudoed Authors
Users Online
Currently online: 42 members 891 guests
Please welcome our newest community members: