Error: Cannot find module '@babel/preset-react'
khandakershahi opened this issue · comments
Hi I got this error. I stated to follow the project yesterday. It was working fine but today when I start the project - it shows this error. I after searching in the net I got this solution on another project that I need to change the text in .babelrc.
sanity-io/sanity#3320 (comment)
So what went wrong I can't figure out.
commerce@0.1.0 dev
> next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info - Loaded env from /data/node/ecommerce/ecommerce/.env
info - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
info - Using external babel configuration from /data/node/ecommerce/ecommerce/.babelrc
error - ./node_modules/next/dist/client/dev/amp-dev.js
Error: Cannot find module '@babel/preset-react
Require stack:
- /data/node/ecommerce/ecommerce/node_modules/next/dist/compiled/babel/bundle.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/compiled/babel/code-frame.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/build/webpack/plugins/wellknown-errors-plugin/parseScss.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/build/webpack/plugins/wellknown-errors-plugin/webpackModuleError.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/build/webpack/plugins/wellknown-errors-plugin/index.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/build/webpack-config.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/server/dev/hot-reloader.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/server/dev/next-dev-server.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/server/next.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/server/lib/start-server.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/cli/next-dev.js
- /data/node/ecommerce/ecommerce/node_modules/next/dist/bin/next
at loadPreset.next (<anonymous>)
at createDescriptor.next (<anonymous>)
package.json
{
"name": "ecommerce",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@babel/core": "^7.17.9",
"@sanity/client": "^3.2.0",
"@sanity/image-url": "^1.0.1",
"@stripe/stripe-js": "^1.25.0",
"canvas-confetti": "^1.5.1",
"next": "12.1.0",
"next-sanity-image": "^3.2.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-hot-toast": "^2.2.0",
"react-icons": "^4.3.1",
"stripe": "^8.209.0"
}
}
.babelrc
{
"presets": ["@babel/preset-react"]
}
.eslintrc.json
{
"extends": [ "next/babel", "next/core-web-vitals"]
}
I also got the same error in sanity package. How can I resolve it?
@vaneela I changed code in .babelrc
From
{
"presets": ["@babel/preset-react"]
}
To
{
"presets": ["next/babel"]
}
actually I got this error
error - ./lib/client.js:2:0
Module not found: Can't resolve '@sanity'
1 | import sanityClient from '@sanity/cli';
2 | import imageUrlBuilder from '@sanity';
3 |
4 | export const client = sanityClient({
5 | projectID: 'ajqd8ggi',
Import trace for requested module:
./pages/index.js
i installed babel manually with npm @babel/preset-react