Module parse failed: Unexpected token (typescript 4.9 satisfies)

[jamiejakov]

Hi folks,

seems like react-refresh is failing to parse typescript's 4.9 new feature satisfies

Compiled with problems:

ERROR in ./src/app/pages/admin/pageRoutes.tsx 131:2

Module parse failed: Unexpected token (131:2)
File was processed with these loaders:
 * ./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|     permissions: [Permissions.REDEEM_ITEMS]
|   }
> } satisfies Record<RouteNames, RouteData>);
| export var RouteLink = function RouteLink(props) {
|   var name = props.name,

Versions I'm running:

Plugin	Version
@babel/core	^7.20.12
babel-loader	^9.1.2
typescript	^4.9.4
webpack	^5.75.0
@pmmmwh/react-refresh-webpack-plugin	^0.5.10

[jetpacmonkey]

What's required to get this fixed, is it just a dependency bump for something in this plugin itself? Trying to figure out if I'd be able to submit a patch for it.

[pmmmwh]

I believe this is a Babel problem, not on our side?

[jetpacmonkey]

@babel/core fixed it in 7.20.0, and babel-loader did in 9.0.0, but I'm still seeing errors from this plugin with those other libraries updated. I do see a dev dependency on an older version of babel for this library, maybe that's getting bundled in somewhere?

[pmmmwh]

This is a Babel problem - I've tested on the example repos with the satisfies keyword and it doesn't seem to break anymore.