search

zoom / videosdk-ui-toolkit-web

The Zoom Video SDK UI toolkit is a prebuilt video chat user interface powered by the Zoom Video SDK.
https://www.npmjs.com/package/@zoom/videosdk-ui-toolkit
Other
8 stars 6 forks source link

Module parsing error on '@zoom/videosdk-ui-toolkit/dist/videosdk-ui-toolkit.css' using angular 15 #2

Closed berkeozdemir2016400246 closed 8 months ago

berkeozdemir2016400246 commented 8 months ago

Issue Title: Module parsing error on '@zoom/videosdk-ui-toolkit/dist/videosdk-ui-toolkit.css' using angular 15 Description: As title says, whenever I import videosdk-ui-toolkit.css to my component I get the following error ./node_modules/@zoom/videosdk-ui-toolkit/dist/videosdk-ui-toolkit.css?ngGlobalStyle:1:0 - Error: Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders

.mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{position:absolute;border-radius:50%;pointer-events:none;transition:opacity,transform 0ms cubic-bezier(0,0,.2,1);transform:scale3d(0,0,0)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0 // rest of the file

Steps to Reproduce: Follow the steps on https://developers.zoom.us/docs/video-sdk/web/ui-toolkit/ on a fresh install.

Expected Behavior: For it to work out of the box.

Actual Behavior: Module parsing error.

Additional Information: https://github.com/berkeozdemir2016400246/zoomkit-example Here is a repo minimally producing the issue

Operating System: MacOs v12.5.1 Browser/Environment (if applicable): - Screenshots or error messages (if applicable):

Ticorrian-Heard commented 8 months ago

Hi! Since you already included the style in your angular.json file, can you removed line 3 in app.component.ts and try again?

berkeozdemir2016400246 commented 8 months ago

Hi! Thanks for the quick answer. Doing that and adding CUSTOM_ELEMENTS_SCHEMA to app module schemas worked for this issue. Now I can see the element with it's styles. Demo repo has been updated.