SDK not working with Ionic 5 / Angular framework

[varun-yp]

Describe the bug matrix-js-sdk is not working with Ionic 5 or Angular framework.

To Reproduce

1. Install ionic and select angular as javascript framework

   npm install -g @ionic/cli
   ionic start

2. Navigate into the project and install matrix-js-sdk and its typings

   yarn add matrix-js-sdk
   npm install @types/matrix-js-sdk -D

3. Modify tsconfig.json to add following path and exclude details

   // tsconfig.json
   {
   "compilerOptions": {
   "paths": {
   "matrix-js-sdk": [
     "node_modules/@types/matrix-js-sdk/index.d.ts"
   ],
   }
   }
   "exclude": ["node_modules/matrix-js-sdk/lib/*.d.ts"]
   }

4. Modify app.components.ts to import and use the sdk.

   import * as sdk from 'matrix-js-sdk';
   ...
   export class AppComponent {
   constructor() {
   const client = sdk.createClient('https://matrix.org');
   }
   }

   Expected behavior Expected the client to be created and started, but got webpack module error (screenshot attached), informing createClient is not a function. The same does not work on standalone angular framework as well.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser: Chrome
• Version: 95.0.4638.54

Additional context Any help on its usage or workaround for Ionic 5 / Angular framework will be helpful.

Same is posted on the original matrix-js-sdk... hoping to get a response, either there or here. https://github.com/matrix-org/matrix-js-sdk/issues/1995

[Jack-Works]

Hi, but sorry this package is not @types/matrix-js-sdk. This repo is another community maintained type definition that requires a special way to install (you can see the README for this repo).

@huan is the maintainer of @types/matrix-js-sdk, can you help?

[Jack-Works]

And I suggest you to console.log(sdk) to see what JS value it exactly contains. It seems like it's a bundler problem, not a type of definition problem.

[varun-yp]

And I suggest you to console.log(sdk) to see what JS value it exactly contains. It seems like it's a bundler problem, not a type of definition problem.

yes, I believe it is a bundler problem as well. Just trying to figure how to resolve it.

[huan]

Thanks for mentioning me.

I have only used the SDK in node, however, I live angular and ionic, so I'd like to have a look at it if there's any minimum reproducible open source repo.