3 Replies Latest reply on Oct 22, 2018 11:18 AM by Aashis Khanal

    Error : Cannot find name 'tableau'  in Angular2 with Typescript

    kishore utukuru



      I am integrating table reports in to my Angular2 CLI application, while compiling application I am getting error as  "Cannot find name 'tableau'.  Here are more details on this


      Tableau version: 10.0.2

      Tableau JavaScript Version: tableau-2.1.2.min.js

      Programming Language: Typescript and Angular2


      Here are the steps which I did for Tableau reports integration

      Step:1 - Included table JavaScript API in .angular-cli.json

                   "scripts": ["../src/assets/libs/tableau-2.1.2.min.js"] // Path is correct

      Step:2 - loading table reports in to one of my Angular2 class

               Typescript Class Code:    

                export class DashboardComponent implements OnInit {




                            initViz() {

                                   var containerDiv = document.getElementById("vizContainer"),

                                   url = "https://tableau-snd.company.net/#/site/POC/views/JobDetails/JobStatusDashboard?:iid=1",

                                  options = {hideTabs: true,

                                                   onFirstInteractive: function () {

                                                        console.log("Run this code when the viz has finished loading.");




                    var viz = new tableau.Viz(containerDiv, url, options);




      Note: some times this error will not shows and load with out errors not sure why? I am assuming this new tableau object is creating before loading tableau-2.1.2.min.js or Typescript/Angular CLI not able to recognize tableau object.


      Please let me know how to fix this issue. If you can provide an example will be a great.



        • 1. Re: Error : Cannot find name 'tableau'  in Angular2 with Typescript
          kishore utukuru

          Found the solution for this issue, Here is the solution

          Add the below code in to

          1. In app.component.js import Tableau js file

                   Ex: import '../assets/libs/tableau-2.1.2.min.js';


          2. In Dashboard.component.js  create a tableau variable

               Ex: declare var tableau: any;


          the above solution fixed my issue.



          • 2. Re: Error : Cannot find name 'tableau'  in Angular2 with Typescript
            Chandra Shetty

            Hi Kishore,

            Do you have to provide the api path in both .angular-cli.json & app.component.ts or only in app.compoent.ts?


            Imports in app.component.ts seems to look for the api under "src\app" folder irrespective of where the library is stored and what path you provide in the [scripts].


            I can get this working only by providing in index.html & no other place and nor do I have to import ONLY if I provide the path to Tableau server..  But if I try to reference to local path, I get error.  I want to refer to the local copy, Since my intention is to use dev version tableau extension library which is not in server.




            • 3. Re: Error : Cannot find name 'tableau'  in Angular2 with Typescript
              Aashis Khanal

              I may be too late here but I am trying this api for angular 6.

              Including the tableau.js in html works one time but breaks again other time. I tried it including in angular.json still the similar problem. At one point it fails compiling with error "Couldn't find tableau".


              It seems to be working now by including it in angular.json as well as app.component.js



              "scripts": [





              import 'assets/libs/tableau-2.1.2.min.js';


              "import tableau from tableau-api" (after - ng i tableau-api) did not work for me.