Cannot find type definition file for 'request': ERROR in node_modules/@looker/sdk-rtl/lib/oauthSession.d.ts:1:23 - error TS2688

user_7433421 0
Viewed 349

I am trying to integrate Looker Embedded Client SDK with angular so installed @looker/SDK and configured setting as per guideline provided on official npm page for @looker/sdk to access APIs.

But when I tried to access a few methods and classes the angular application started failing. The look
Error:

ERROR in node_modules/@looker/sdk-rtl/lib/oauthSession.d.ts:1:23 - error TS2688: Cannot find type definition file for 'request'.

1 /// <reference types="request" />

And the configuration:

// package.json 

{ 
   //package.json
   
 "dependencies": {
    "@angular/core": "~10.2.3",
    "@looker/sdk": "^7.20.3",
    // few other libs
  },
  "devDependencies": {
   // few other libs  
  "@angular/cli": "~10.2.0",
     "typescript": "~4.0.5"
  },
 
//tsconfig.json
"compilerOptions": {
  // few other settings
  "module": "es2020",
  "target": "es5",
   "lib": [
    "es2020",
    "dom"
  ],
 

/ /And in component file:

import { LookerNodeSDK } from '@looker/sdk/lib/node'

@Component({
  selector: 'rs-reports',
  templateUrl: './reports.component.html',
  providers: [ReportsService]
})
export class ReportsComponent implements OnInit {

  constructor() {
  }
  ngOnInit() {
    this.getLookerConfig()
      .then(response => {
        console.log(response, 'Success')
      }).catch(error => {
      console.log(error, 'Error')
    });
  }

  async getLookerConfig() {
    // create a Node SDK object for API 3.1
    const sdk = LookerNodeSDK.init31();
    // retrieve your user account to verify correct credentials
    const me = await sdk.ok(sdk.me(
      "id, first_name, last_name, display_name, email, personal_space_id, home_space_id, group_ids, role_ids"))
    console.log({me})
    // make any other calls to the Looker SDK
    const dashboards = await sdk.ok(
      sdk.search_dashboards({title: 'My SDK dashboard'})
    )
    if (dashboards.length === 0) {
      console.log('Dashboard not found')
    }


    await sdk.authSession.logout()
    if (!sdk.authSession.isAuthenticated()) {
      console.log('Logout successful')
    }
  }
looker angular typescript
1 Answers

I'm not well versed in Angular, but I think that error is a red herring. You're trying to use the Node version of the Looker SDK (LookerNodeSDK) in an angular app, which probably isn't going to work too well. The NodeSDK is for use in Node.js backends, and we ship a LookerBrowserSDK for use in frontend apps.

This is, unfortunately, not super well documented (I'm going to try and improve that) but I bet you'll have more success if you try the browserSDK.

import { Looker31SDK, LookerBrowserSDK } from '@looker/sdk/lib/browser'

Like I said, I don't really know Angular, but here's some Javascript that ought to work better if you place it in ngOnInit. The browserSDK and nodeSDK implement the same methods, so everything should still work as documented. The only important difference to note is that the initialization of the SDK is different, you can't pass a settings.ini file or anything. You can create a custom config reader and pass it to that, if you don't want to use Oauth. Check it out:

import { Looker31SDK, LookerBrowserSDK } from '@looker/sdk/lib/browser'
import { ApiSettings, IApiSettings, IApiSection } from '@looker/sdk-rtl'

/**
 * @class CustomConfigReader
 *
 * A custom configuration reader that overrides the readConfig() method
 * in NodeSettings to allow fetching client_id and client_secret
 * from anywhere.
 */
class CustomConfigReader extends ApiSettings {
  constructor(settings: IApiSettings) {
    super(settings)
  }

  /**
   * @returns an IApiSection object containing client_id and client_secret
   */
  readConfig(): IApiSection {
    return {
      client_id: 'clientId',
      client_secret: 'clientSecret',
    }
  }
}

;(async () => {
  const sdk = LookerBrowserSDK.init31(
    new CustomConfigReader({
      base_url: 'https://<your-looker-server>:19999 or https://your.cloud.looker.com',
    } as IApiSettings)
  )

  const me = await sdk.ok(
    sdk.me(
      'id, first_name, last_name, display_name, email, personal_space_id, home_space_id, group_ids, role_ids'
    )
  )
  console.log({ me })
})()

and then implement your function. The browserSDK and nodeSDK implement the same methods, so everything should still work as documented.

user_106209070
Related