can't use/build it in an angular app

[qwertzui11]

Hi!

I'm not able to use the client-sdk in a simple angular app.

reproduce

npm install -g @angular/cli
ng init my-app
cd my-app
npm install livekit-client --save

edit src/main.ts by adding

import {
  Room
} from 'livekit-client';

to the imports. then run

ng build

error

on my linux this results in the following build error

✔ Browser application bundle generation complete.

Error: node_modules/livekit-client/dist/logger.d.ts:11:30 - error TS2503: Cannot find namespace 'log'.

11 declare const livekitLogger: log.Logger;
                                ~~~


Error: node_modules/livekit-client/dist/proto/livekit_models.d.ts:1:8 - error TS1192: Module '"projects/livekit/angular-issue/issue/node_modules/protobufjs/minimal"' has no default export.

1 import _m0 from "protobufjs/minimal";
         ~~~


Error: node_modules/livekit-client/dist/proto/livekit_rtc.d.ts:1:8 - error TS1192: Module '"projects/livekit/angular-issue/issue/node_modules/protobufjs/minimal"' has no default export.

1 import _m0 from "protobufjs/minimal";
         ~~~

Versions

OS: linux

ng --version:

Angular CLI: 13.2.6
Node: 16.14.0
Package Manager: npm 8.3.1
OS: linux x64

Angular: 13.2.6
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1302.6
@angular-devkit/build-angular   13.2.6
@angular-devkit/core            13.2.6
@angular-devkit/schematics      13.2.6
@schematics/angular             13.2.6
rxjs                            7.5.5
typescript                      4.5.5

potential fixes

replace import _m0 from "protobufjs/minimal"; with import * as _m0 from "protobufjs/minimal"; in the files proto/livekit_rtc.d.ts and livekit_models.d.ts

replace import log from 'loglevel'; with import * as log from 'loglevel'; in the file logger.d.ts

Thanks

Thanks for your time and effort 😃

[qwertzui11]

another potential fix is a workaround:

add "allowSyntheticDefaultImports": true to your tsconfig.json.

However, feels a bit ugly 😆

[davidzhao]

@qwertzui11 thanks for the suggestions. if you are up for it, it's be great if you can open a PR for the logger change.

For proto/ files, this is a bit more complex. we'd have to submit a PR for ts-proto, which we use to generate files in that directory.