Getting error no such file or directory, open '/{workdirectory}/node_modules/amazon-chime-sdk-js/src/websocketadapter/WebSocketReadyState.ts'

What happened and what did you expect to happen?

Hello, I try to install amazon-chime-sdk-component-library-react by below command.

yarn add amazon-chime-sdk-component-library-react amazon-chime-sdk-js styled-components styled-system

and write MeetingProvider component like this.

`import * as React from ‘react’; import { createRoot } from ‘react-dom/client’; import CssBaseline from ‘@mui/material/CssBaseline’; import { ThemeProvider } from ‘@mui/material/styles’; import App from ‘./App’; import theme from ‘./theme’; import { MeetingProvider, lightTheme, } from ‘amazon-chime-sdk-component-library-react’;

const rootElement = document.getElementById(‘root’); const root = createRoot(rootElement!);

root.render( <ThemeProvider theme={theme}> <MeetingProvider> <CssBaseline /> <App /> </MeetingProvider> </ThemeProvider>, ); `

But I’m getting some errors like below.

WARNING in ./node_modules/amazon-chime-sdk-js/build/websocketadapter/WebSocketReadyState.js Module Warning (from ./node_modules/source-map-loader/dist/cjs.js): Failed to parse source map from '/{workdirectory}/node_modules/amazon-chime-sdk-js/src/websocketadapter/WebSocketReadyState.ts' file: Error: ENOENT: no such file or directory, open ''/{workdirectory}/node_modules/amazon-chime-sdk-js/src/websocketadapter/WebSocketReadyState.ts' I checked node_modules/amazon-chime-sdk-js. I couldn’t find any src directory. How to resolve this issue?

Have you reviewed our existing documentation?

• Amazon Chime SDK for JavaScript GitHub issues
• Amazon Chime SDK React Components Library GitHub issues
• Storybook documentation
• README page
• How-to documentation
• React SDK meeting demo

Reproduction steps

yarn add amazon-chime-sdk-component-library-react amazon-chime-sdk-js styled-components styled-system

and write MeetingProvider component like this.

`import * as React from ‘react’; import { createRoot } from ‘react-dom/client’; import CssBaseline from ‘@mui/material/CssBaseline’; import { ThemeProvider } from ‘@mui/material/styles’; import App from ‘./App’; import theme from ‘./theme’; import { MeetingProvider, lightTheme, } from ‘amazon-chime-sdk-component-library-react’;

const rootElement = document.getElementById(‘root’); const root = createRoot(rootElement!);

root.render( <ThemeProvider theme={theme}> <MeetingProvider> <CssBaseline /> <App /> </MeetingProvider> </ThemeProvider>, ); `

Amazon Chime SDK React Components Library version

3.2.0

What browsers are you seeing the problem on?

chrome

Browser version

Version 102.0.5005.115 (Official Build) (x86_64)

Device Information

MacOS Monterey version 12.4

Meeting and Attendee ID Information.

No response

Browser console logs

WARNING in ./node_modules/amazon-chime-sdk-js/build/websocketadapter/WebSocketReadyState.js Module Warning (from ./node_modules/source-map-loader/dist/cjs.js): Failed to parse source map from '/{workdirectory}/node_modules/amazon-chime-sdk-js/src/websocketadapter/WebSocketReadyState.ts' file: Error: ENOENT: no such file or directory, open ''/{workdirectory}/node_modules/amazon-chime-sdk-js/src/websocketadapter/WebSocketReadyState.ts'

Add any other context about the problem here.

No response

[MasahiroHanawa]

@michhyun1 I just add GENERATE_SOURCEMAP=false on .env. It could remove all warning. Thank you!

Question - how is this blocking you? It’s just a warning, right? Is your application failing to build? I got these warning only when I try to do same things on clean create-react-app.

Ah, sorry. I make a mistake how to make create-react-app. I just made create-react-app below command.

npx create-react-app my-app --template typescript

and set up above code

Then, it’s getting below error.

Should I set something param in MeetingProvider?

`Issues checking in progress… ERROR in src/index.tsx:16:4 TS2559: Type ‘{ children: Element; }’ has no properties in common with type ‘IntrinsicAttributes & Props’. 14 | 15 | root.render(

16 | <MeetingProvider> | ^^^^^^^^^^^^^^^ 17 | <BackApp /> 18 | </MeetingProvider>, 19 | );`

[Bannini]

We are suffering from the same issue. Unable to remove the line GENERATE_SOURCEMAP=false else our builds fail. Using latest Chime and component library libs.