Wolox / react-chat-widget

Awesome chat widget for your React App
MIT License
1.47k stars 457 forks source link

ComponentToRender error #320

Closed huynhdev24 closed 1 year ago

huynhdev24 commented 1 year ago

yarn run v1.22.19 $ webpack serve --config webpack.config.dev.js i 「wds」: Project is running at http://0.0.0.0:3000/ i 「wds」: webpack output is served from / i 「wds」: Content not from webpack is served from C:\reactapi\react-chat-widget\dist × 「wdm」: asset main.js 6.23 MiB [emitted] [big] (name: main) asset vendor.js 3.3 MiB [emitted] [big] (name: vendor) asset index.html 464 bytes [emitted] runtime modules 54 KiB 24 modules modules by path ./node_modules/ 2.45 MiB javascript modules 1.84 MiB 226 modules json modules 625 KiB 2 modules modules by path ./src/ 150 KiB 55 modules asset modules 17.5 KiB ./assets/clear-button.svg 1.15 KiB [built] [code generated] ./assets/launcher_button.svg 6.41 KiB [built] [code generated] ./assets/close.svg 1.08 KiB [built] [code generated]

ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\Messages\index.tsx ./src/components/Widget/components/Conversation/components/Messages/index.tsx 39:14-31 [tsl] ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\Messages\index.tsx(39,15) TS2786: 'ComponentToRender' cannot be used as a JSX component. Its element type 'Element | Component<any, any, any> | null' is not a valid JSX element. @ ./src/components/Widget/components/Conversation/index.tsx 22:33-65 @ ./src/components/Widget/layout.tsx 16:37-73 @ ./src/components/Widget/index.tsx 15:31-50 @ ./src/index.tsx 13:31-61 @ ./index.js 2:0-36 4:0-257 @ ./dev/App.tsx 21:14-33 22:10-23 @ ./dev/main.tsx 44:28-44

ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\Messages\index.tsx ./src/components/Widget/components/Conversation/components/Messages/index.tsx 41:12-29 [tsl] ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\Messages\index.tsx(41,13) TS2786: 'ComponentToRender' cannot be used as a JSX component. Its element type 'Element | Component<any, any, any> | null' is not a valid JSX element. @ ./src/components/Widget/components/Conversation/index.tsx 22:33-65 @ ./src/components/Widget/layout.tsx 16:37-73 @ ./src/components/Widget/index.tsx 15:31-50 @ ./src/index.tsx 13:31-61 @ ./index.js 2:0-36 4:0-257 @ ./dev/App.tsx 21:14-33 22:10-23 @ ./dev/main.tsx 44:28-44

ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\QuickButtons\index.tsx ./src/components/Widget/components/Conversation/components/QuickButtons/index.tsx 18:7-24 [tsl] ERROR in C:\reactapi\react-chat-widget\src\components\Widget\components\Conversation\components\QuickButtons\index.tsx(18,8) TS2786: 'ComponentToRender' cannot be used as a JSX component. Its element type 'Element | Component<any, any, any> | null' is not a valid JSX element. @ ./src/components/Widget/components/Conversation/index.tsx 24:37-73 @ ./src/components/Widget/layout.tsx 16:37-73 @ ./src/components/Widget/index.tsx 15:31-50 @ ./src/index.tsx 13:31-61 @ ./index.js 2:0-36 4:0-257 @ ./dev/App.tsx 21:14-33 22:10-23 @ ./dev/main.tsx 44:28-44

ERROR in C:\reactapi\react-chat-widget\dev\App.tsx ./dev/App.tsx 41:7-13 [tsl] ERROR in C:\reactapi\react-chat-widget\dev\App.tsx(41,8) TS2786: 'Widget' cannot be used as a JSX component. Its element type 'Element | Component<any, any, any> | null' is not a valid JSX element. Type 'Component<any, any, any>' is not assignable to type 'Element | ElementClass | null'. Type 'Component<any, any, any>' is not assignable to type 'ElementClass'. The types returned by 'render()' are incompatible between these types. Type 'React.ReactNode' is not assignable to type 'import("C:\reactapi\react-chat-widget\node_modules\@types\react-redux\node_modules\@types\react\index").ReactNode'. Type '{}' is not assignable to type 'ReactNode'. @ ./dev/main.tsx 44:28-44

4 errors have detailed information that is not shown. Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.

webpack 5.75.0 compiled with 4 errors in 41613 ms i 「wdm」: Failed to compile.

huynhdev24 commented 1 year ago

fixed

tyn1998 commented 1 year ago

Hi @huynhdev24, could you please share how you solved the problem?

my case:

image
tyn1998 commented 1 year ago

fixed by https://stackoverflow.com/a/71828113/10369621