[Bug][v6]: StaticRouter can't import as documented

[duhdugg]

What version of React Router are you using?

6.0.2

Steps to Reproduce

npx create-react-app test-app
cd test-app
yarn add [email protected]

// src/App.js
import { StaticRouter } from 'react-router-dom/server'

yarn build

Expected Behavior

StaticRouter should import without error, as documented here: https://reactrouter.com/docs/en/v6/upgrading/v5#get-staticrouter-from-react-router-domserver

Actual Behavior

Error:

Failed to compile.

./node_modules/react-router-dom/server.mjs
Can't import the named export 'Action' from non EcmaScript module (only default export is available)

[timdorr]

The file definitely exists, but your tooling is pulling in the mjs version instead of the js version. The history library it's importing from doesn't have those as exports because they are just types.

I'll see if we can fix this on our end. In the meantime, you might try switching to importing from react-router-dom/server.js, if that will override where it imports from.

[timdorr]

Found a fix for you: formatjs/formatjs#1395 (comment)

I double-checked and we do actually export Action, as it's an enum and has real value in non-TS code. The problem here is really more on the build tooling side. We can see about exporting mjs files in history, but there's nothing we've done strictly "wrong" here.

[paul-mesnilgrente]

That's the same issue I had on: #8221

[duhdugg]

Importing from react-router-dom/server.js (explicit .js extension) as suggested fixed it for me back when I originally had this problem.

I just checked again by dropping the .js from the import in my project, and I'm not having the same problem as before. I try to keep the dependencies in my project updated as much as possible, so I'm using [email protected] right now. yarn list also shows [email protected], although I admit I am unfamiliar with how that package is related (just saw it was mentioned in #8221).

[eerapheal]

Importing from react-router-dom/server.js (explicit .js extension) as suggested fixed it for me back when I originally had this problem.

I just checked again by dropping the .js from the import in my project, and I'm not having the same problem as before. I try to keep the dependencies in my project updated as much as possible, so I'm using [email protected] right now. yarn list also shows [email protected], although I admit I am unfamiliar with how that package is related (just saw it was mentioned in #8221).

Thanks, This fixed it for me