docs: added a fix for QueryClient error in medusa-react upgrade guide (#3089)
This commit is contained in:
@@ -52,3 +52,36 @@ import { QueryClient } from "@tanstack/react-query"
|
||||
// this remains the same
|
||||
const queryClient = new QueryClient()
|
||||
```
|
||||
|
||||
### Fix No QueryClient set Errors
|
||||
|
||||
If you're using a Next.js storefront, you might face the following error after this update when you run your storefront:
|
||||
|
||||
```bash
|
||||
No QueryClient set
|
||||
```
|
||||
|
||||
This is due to an issue related to Tanstack Query shipping `esm` modules in its latest versions and how Next.js uses Webpack.
|
||||
|
||||
Although in future versions of `medusa-react` this issue will be fixed, you can add the following into `next.config.js` to fix this error:
|
||||
|
||||
```js
|
||||
const path = require("path")
|
||||
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
// ... other configs
|
||||
webpack: (config, options) => {
|
||||
if (options.isServer) {
|
||||
config.externals = ["@tanstack/react-query", ...config.externals]
|
||||
}
|
||||
const reactQuery = path.resolve(
|
||||
require.resolve("@tanstack/react-query")
|
||||
)
|
||||
config.resolve.alias["@tanstack/react-query"] = reactQuery
|
||||
return config
|
||||
},
|
||||
}
|
||||
|
||||
module.exports = nextConfig
|
||||
```
|
||||
|
||||
Reference in New Issue
Block a user