ERROR in node_modules/api-ai-javascript/declarations.d.ts(9,5)

[odineshrao]

I am trying to use dialogflow in my angular 6 application. but got an error:

ERROR in node_modules/api-ai-javascript/declarations.d.ts(9,5): error TS2687: All declarations of 'speechSynthesis' must have identical modifiers. node_modules/api-ai-javascript/declarations.d.ts(9,5): error TS2717: Subsequent property declarations must have the same type. Property 'speechSynthesis' must be of type 'SpeechSynthesis', but here has type 'any'. node_modules/api-ai-javascript/ts/Request/TTSRequest.ts(18,37): error TS2339: Property 'AudioContext' does not exist on type 'Window'. node_modules/api-ai-javascript/ts/Request/TTSRequest.ts(18,53): error TS2304: Cannot find name 'webkitAudioContext'. node_modules/api-ai-javascript/ts/Stream/Processors.ts(7,16): error TS2339: Property 'AudioContext' does not exist on type 'Window'. node_modules/api-ai-javascript/ts/Stream/Processors.ts(7,38): error TS2339: Property 'AudioContext' does not exist on type 'Window'. node_modules/api-ai-javascript/ts/Stream/Processors.ts(7,54): error TS2304: Cannot find name 'webkitAudioContext'. node_modules/api-ai-javascript/ts/Stream/StreamClient.ts(60,20): error TS2339: Property 'AudioContext' does not exist on type 'Window'. node_modules/api-ai-javascript/ts/Stream/StreamClient.ts(60,42): error TS2339: Property 'AudioContext' does not exist on type 'Window'. node_modules/api-ai-javascript/ts/Stream/StreamClient.ts(60,58): error TS2304: Cannot find name 'webkitAudioContext'. node_modules/api-ai-javascript/ts/Stream/StreamClient.ts(62,53): error TS2339: Property 'webkitGetUserMedia' does not exist on type 'Navigator'. node_modules/api-ai-javascript/ts/Stream/StreamClient.ts(62,85): error TS2339: Property 'mozGetUserMedia' does not exist on type 'Navigator'. node_modules/api-ai-javascript/ts/XhrRequest.ts(105,19): error TS2304: Cannot find name 'ActiveXObject'. node_modules/api-ai-javascript/ts/XhrRequest.ts(106,19): error TS2304: Cannot find name 'ActiveXObject'. node_modules/api-ai-javascript/ts/XhrRequest.ts(107,19): error TS2304: Cannot find name 'ActiveXObject'. any solution?

[hashanmalawana]

Same error here

[xmlking]

with typescript 3.1.2 and angular 7.0.0, error:

ERROR in node_modules/api-ai-javascript/declarations.d.ts(39,5): error TS2687: All declarations of 'stream' must have identical modifiers.

[tinesoft]

Hi,

I had a similar issue with angular v7.0.0.rc.1 and current [email protected].

I've found out its due to conflicting type definitions for MediaStreamAudioDestinationNode#stream, between the custom version in (api-ai-javascript/declarations.d.ts) and the standard in lib.dom.d.ts (from dom types in your tsconfig.json)

One workaround is to avoid importing the library via its index.ts (which has /// <reference path="declarations.d.ts"/>), but instead use the es6 version directly by bypassing the resolution of the "api-ai-javascript" module.

So in your code:

import { ApiAiClient } from 'api-ai-javascript/es6/ApiAiClient'

in your tsconfig.json (only relevant parts):

{
  "compileOnSave": false,
  "compilerOptions": {
    ...
    "baseUrl": "./",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"],
    "paths": {
      "api-ai-javascript/*": ["node_modules/api-ai-javascript/es6/*"] //bypass the index.ts
    }
  }
}

The proper solution i think, would be the project's tsconfig.json to add dom type directly and remove declarations of types already in lib.dom.d.ts.

I can test that and submit a PR if you agree with this solution, @dialogflow

[abhinavbhandari]

@xmlking Hey I have the same error, did you figure out a solution?

[tinesoft]

@abhinavbhandari did you try out my solution?

[xmlking]

I patched it using "@xmlking/api-ai-javascript": "^2.0.0-beta.22", until this lib is fixed. Working sample at https://github.com/xmlking/ngx-starter-kit

[ravikumarbggit]

Hi, This package(api-ai-javascript) seems to be legacy V1 SDK. Anyone point me to documentaion on using V2 Library please? I couldn't find Javascript platform in https://dialogflow.com/docs/sdks I tried to follow steps mentioned in Nodejs section in my Angular 6 client but it didn't work

[ravikumarbggit]

btw, @tinesoft workaround worked for me. Thanks!

[abhinavbhandari]

@tinesoft Hey yes I did, it didn't work but I will revisit it later and possibly ask a question later!

[JoelKThomas]

Hi,

I had a similar issue with angular v7.0.0.rc.1 and current [email protected].

I've found out its due to conflicting type definitions for MediaStreamAudioDestinationNode#stream, between the custom version in (api-ai-javascript/declarations.d.ts) and the standard in lib.dom.d.ts (from dom types in your tsconfig.json)

One workaround is to avoid importing the library via its index.ts (which has /// <reference path="declarations.d.ts"/>), but instead use the es6 version directly by bypassing the resolution of the "api-ai-javascript" module.

So in your code:

import { ApiAiClient } from 'api-ai-javascript/es6/ApiAiClient'

in your tsconfig.json (only relevant parts):

{
  "compileOnSave": false,
  "compilerOptions": {
    ...
    "baseUrl": "./",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"],
    "paths": {
      "api-ai-javascript/*": ["node_modules/api-ai-javascript/es6/*"] //bypass the index.ts
    }
  }
}

The proper solution i think, would be the project's tsconfig.json to add dom type directly and remove declarations of types already in lib.dom.d.ts.

I can test that and submit a PR if you agree with this solution, @dialogflow

I am facing the same issue still its raising the same issue.I tried it.

All declarations of 'stream' must have identical modifiers api-ai-javascript - Dialogflow

[mayurijethwa31]

I declared stream as readonly in declarations.d.ts which worked for me.

[PoojaChoudhury]

i used import { ApiAiClient } from 'api-ai-javascript/es6/ApiAiClient' instead of import { ApiAiClient} from 'api-ai-javascript'; and it worked ..

[Suhabavan]

Hi,

Anyone please help me !!!!!!

I'm getting an error Could not find a declaration file for module 'api-ai-javascript/es6/ApiAiClient'. 'e:/AngularUI/chatbot/node_modules/api-ai-javascript/es6/ApiAiClient.js' implicitly has an 'any' type. Try npm install @types/api-ai-javascript if it exists or add a new declaration (.d.ts) file containing declare module 'api-ai-javascript/es6/ApiAiClient';ts(7016)

tsconfig.json

{ "compileOnSave": false, "compilerOptions": { "baseUrl": "./", "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, "module": "esnext", "moduleResolution": "node", "importHelpers": true, "target": "es2015", "lib": [ "es2018", "dom" ] }, "angularCompilerOptions": { "fullTemplateTypeCheck": true, "strictInjectionParameters": true } }

chat.service.ts

import { Injectable } from '@angular/core'; import {environment} from '../../environments/environment'; import { ApiAiClient } from 'api-ai-javascript/es6/ApiAiClient'; //Here only i'm getting error

@Injectable({ providedIn: 'root' }) export class ChatService {

readonly token = environment.dialogflow.angularBot; readonly client = new ApiAiClient({accessToken:this.token});

constructor() { }

talk(){ this.client.textRequest('Who are you!').then(res=>console.log(res)); } }

NOTE: If you know how to solve this issue contact me (+91 8681841713) I'm also available in WhatsApp My email id: [email protected]

Thanks in Advance Suhabavan.

[sairam111170]

Had same issue with Angular 11.1.1 and Typescript 4.1.3..I tried every method above ,but still error continues.

[SihleMbonani]

Hi,

Anyone please help me !!!!!!

I'm getting an error Could not find a declaration file for module 'api-ai-javascript/es6/ApiAiClient'. 'e:/AngularUI/chatbot/node_modules/api-ai-javascript/es6/ApiAiClient.js' implicitly has an 'any' type. Try npm install @types/api-ai-javascript if it exists or add a new declaration (.d.ts) file containing declare module 'api-ai-javascript/es6/ApiAiClient';ts(7016)

tsconfig.json

{ "compileOnSave": false, "compilerOptions": { "baseUrl": "./", "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, "module": "esnext", "moduleResolution": "node", "importHelpers": true, "target": "es2015", "lib": [ "es2018", "dom" ] }, "angularCompilerOptions": { "fullTemplateTypeCheck": true, "strictInjectionParameters": true } }

chat.service.ts

import { Injectable } from '@angular/core'; import {environment} from '../../environments/environment'; import { ApiAiClient } from 'api-ai-javascript/es6/ApiAiClient'; //Here only i'm getting error

@Injectable({ providedIn: 'root' }) export class ChatService {

readonly token = environment.dialogflow.angularBot; readonly client = new ApiAiClient({accessToken:this.token});

constructor() { }

talk(){ this.client.textRequest('Who are you!').then(res=>console.log(res)); } }

NOTE: If you know how to solve this issue contact me (+91 8681841713) I'm also available in WhatsApp My email id: [email protected]

Thanks in Advance Suhabavan.

Hey did you manage to get help?