fix: breaking update v2.11.1

[glpecile]

Current Behavior

Project doesn't compile.

Expected Behavior

To compile correctly.

Steps to Reproduce

1. Compile with version 2.11.1
2. Boom

Other Information

Trace:

./node_modules/react-player/es6/ReactPlayer.jsx
--
19:45:31.464 | Module parse failed: Unexpected token (140:8)
19:45:31.464 | 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
19:45:31.464 | \|       const { light, playIcon, previewTabIndex, oEmbedUrl } = this.props
19:45:31.464 | \|       return (
19:45:31.464 | >         <Preview
19:45:31.464 | \|           url={url}
19:45:31.464 | \|           light={light}
19:45:31.464 |  
19:45:31.464 | Import trace for requested module:
19:45:31.464 | ./node_modules/react-player/es6/ReactPlayer.jsx
19:45:31.464 | ./node_modules/react-player/es6/index.js
19:45:31.464 | ./components/chats/FloatingVideoPlayer.tsx
19:45:31.465 | ./components/chats/DisplayFloatingVideoPlayer.tsx
19:45:31.465 |  
19:45:31.465 | ./node_modules/react-player/es6/players/DailyMotion.jsx
19:45:31.465 | Module parse failed: Unexpected token (116:6)
19:45:31.465 | 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
19:45:31.465 | \|     }
19:45:31.465 | \|     return (
19:45:31.465 | >       <div style={style}>
19:45:31.465 | \|         <div ref={this.ref} />
19:45:31.465 | \|       </div>
19:45:31.465 |  
19:45:31.466 | Import trace for requested module:
19:45:31.466 | ./node_modules/react-player/es6/players/DailyMotion.jsx
19:45:31.466 | ./node_modules/react-player/es6/players/index.js
19:45:31.466 | ./node_modules/react-player/es6/index.js
19:45:31.466 | ./components/chats/FloatingVideoPlayer.tsx
19:45:31.466 | ./components/chats/DisplayFloatingVideoPlayer.tsx
19:45:31.466 |  
19:45:31.466 | ./node_modules/react-player/es6/players/Facebook.jsx
19:45:31.466 | Module parse failed: Unexpected token (109:6)
19:45:31.466 | 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
19:45:31.467 | \|     }
19:45:31.467 | \|     return (
19:45:31.467 | >       <div
19:45:31.467 | \|         style={style}
19:45:31.467 | \|         id={this.playerID}

[ralcant]

Same error here

[tandrasi]

same

[Lornz-]

Same here

[jordanhudgens]

Same for me, the app wouldn't compile, but the error was related to not being able to find a DailyMotion dependency

[minhvuong37]

same here
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
|
| export default class Kaltura extends Component {

static displayName = 'Kaltura'
| static canPlay = canPlay.kaltura
| callPlayer = callPlayer

[ralcant]

I know this isn't ideal but I just rolled it back in package.json from ^2.11.0 to 2.11.0 and it works

[jordanhudgens]

@ralcant that's what I did as well to get it working

[maolaoban]

same

[muhammedogz]

Stream Chat React using this Library, So I can't lower the version.
It seems they are using the latest version.

[peterpangpeter]

same here,
found a workaround using resolutions in yarn.
This may help if some other library of yours is using this library, in other words this is the dependency of a dependency.
https://classic.yarnpkg.com/lang/en/docs/selective-version-resolutions/

[muhammedogz]

If you have a dependency that relias on this dependency, you can solve this with npm overrides.
https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides

Thanks @peterpangpeter for sharing the yarn solution.

[manojsingh7]

same issue, i am facing.

[ku997]

same with ^2.10.1. it happens after i up my webpack to 5

[matanol]

same issue for me :(

[danblacklist]

+1, facing the same issue:

Failed to compile.

./node_modules/react-player/es6/players/Kaltura.jsx 10:21
Module parse failed: Unexpected token (10:21)
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 
| 
| export default class Kaltura extends Component {
>   static displayName = 'Kaltura'
|   static canPlay = canPlay.kaltura
|   callPlayer = callPlayernpm ERR! code ELIFECYCLE
npm ERR! errno 1`

[sheikx1221]

2.11.0 works fine

[developergunny]

2.11.0 works!!!!

[masudhossain]

Not working for us either. Was thinking it was us...

[Lalit-Joshi]

Not working for us either. Was thinking it was us...

Yes, I understand, I too faced difficulties for over two hours, believing that the error was on our end.

[AkshayKrJha]

I am also facing this issue with v2.9.0 (few days back, it was fine).

Replacing ^2.9.0 with 2.9.0 in package.json worked.

[eatyourgreens]

Same problem here. The new unbundled JSX distribution breaks our Webpack 5 builds.
#1537

[xbeakmanx]

Same problem.

[JandenMa]

Same problem here

+1, facing the same issue:

Failed to compile.

./node_modules/react-player/es6/players/Kaltura.jsx 10:21
Module parse failed: Unexpected token (10:21)
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 
| 
| export default class Kaltura extends Component {
>   static displayName = 'Kaltura'
|   static canPlay = canPlay.kaltura
|   callPlayer = callPlayernpm ERR! code ELIFECYCLE
npm ERR! errno 1`

[JandenMa]

I added a resolution to solve it:

"resolutions": {
    "react-player": "2.11.0"
}

[rushi-nonstopio]

@cookpete please look into this issue urgently for all of us

[eatyourgreens]

If you’re building a NextJS app (we are) you might need to add react-player to transpilePackages in order to transpile the new JSX distribution to JS.
https://nextjs.org/blog/next-13-1#built-in-module-transpilation-stable

[cookpete]

Looks like I should have tested this suggestion more thoroughly. Apologies all. I’ll remove "module": "es6/index.js" from package.json and publish v2.11.2. People using vite etc can still import from react-player/es6 for the time being.

@wallw-teal any suggestions?