Hacker0x01
Package path ./dist/react-datepicker.css is not exported from package
Hi @maiconfluency ,
I couldn't able to reproduce the mentioned issue. I tried installing the recent version (v 8.1.0) of the package and it's working fine for me. Can you try uninstalling and reinstalling the package.
Have the same with Next v12
The problem is that it does not recognize wildcard in react-datepicker's package.json exports field.
My guess is that Next is old, and probably either Webpack itself is also old or Webpack's default configuration has that issue.
For now, I've solved by copying react-datepicker.css to my project and importing locally.
Have the same with Next v12 The problem is that it does not recognize wildcard in react-datepicker's
package.jsonexportsfield. My guess is that Next is old, and probably either Webpack itself is also old or Webpack's default configuration has that issue.For now, I've solved by copying
react-datepicker.cssto my project and importing locally.
i have the same problem but with next v11. Now I am using react-datepicker v5. It is not possible to build with v7.
Same problem with Yarn 4.x
Issue might be that Yarn PnP does not yet support wildcards properly in module exports? Or might have to do with webpack css-loader.
{
"exports": {
".": { /* main entry */ },
"./dist/*.css": "./dist/*.css",
"./src/stylesheets/*.scss": "./src/stylesheets/*.scss"
}
}
I think for this to work on Yarn PnP, they would need to provide explicit exports.
ex.
{
"exports": {
"./dist/react-datepicker.css": "./dist/react-datepicker.css",
"./dist/react-datepicker.min.css": "./dist/react-datepicker.min.css",
"./dist/react-datepicker.module.css": "./dist/react-datepicker.module.css"
}
}
I'm having the same problem after updating Storybook. I'm using npm. More details at: https://github.com/Hacker0x01/react-datepicker/issues/5835
This seems to have been introduced with 8.0.0 with the addition of the exports property in package.json. I'm using [email protected] (via craco/[email protected]) and have tried in the current and previous 4 Node.js LTS releases. Others on this thread mention using Next.js 12, which is locked to [email protected] (found through much digging) at the last release (Next.js v12.3.7). So the cultprit here is webpack 5 which introduced stricter enforcement of exports but was not without problems.
In Webpack 5.94 there was some major correction to its export processing:
As of version 5.94.0, webpack's behavior has been updated to align with Node's behavior. It now selects the first valid path without attempting further resolutions and throws an error if the path cannot be resolved. (source)
So us using Next.js 12 or CRACO/react-scripts are a bit SOL as we are locked to explicit Webpack versions.
Workarounds:
- If you're capable of updating Webpack (Next.js 12 and CRACO/react-scripts users are not), upgrade to anything Webpack >=5.94.0 will use the latest resolves which have been written in parity with Node.js' path resolution.
- Rollback to [email protected]
- I've got a fork and branch with a patched
package.jsonand included a built./distwhich should mimic the 8.9.0 distributionnpm install -S github:robtayl0r/react-datepicker#fix/5437-broken-css-imports-dist- (source)
Opening a PR with the change as well.
