Cannot build/run DevServer cause of babel-loader

At before, there was no issue with build & run dev server.
But it doesn’t work from some point.

Cannot build / run Webpack-Dev-Server with this exception.

ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module './ast-types/generated'
Require stack:
- {myProject}/node_modules/@babel/types/lib/index.js
- {myProject}/node_modules/@babel/core/lib/transformation/file/file.js
- {myProject}/node_modules/@babel/core/lib/index.js
- {myProject}/node_modules/babel-loader/lib/index.js
- {myProject}/node_modules/loader-runner/lib/loadLoader.js
- {myProject}/node_modules/loader-runner/lib/LoaderRunner.js
- {myProject}/node_modules/webpack/lib/NormalModuleFactory.js
- {myProject}/node_modules/webpack/lib/Compiler.js
- {myProject}/node_modules/webpack/lib/webpack.js
- {myProject}/node_modules/webpack/lib/index.js
- {myProject}/node_modules/webpack-cli/lib/webpack-cli.js
- {myProject}/node_modules/webpack-cli/lib/bootstrap.js
- {myProject}/node_modules/webpack-cli/bin/cli.js
- {myProject}/node_modules/webpack/bin/webpack.js
 babel-loader@8 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babel-core'), you should install 'babel-loader@7'.
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:999:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> ({myProject}/node_modules/@babel/types/lib/index.js:629:19)
    at Module._compile (node:internal/modules/cjs/loader:1097:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:999:19)

webpack 5.66.0 compiled with 1 error in 454 ms

package.json :

{
  "type": "module",
  "scripts": {
    "dev": "NODE_ENV=development webpack serve",
    "build": "NODE_ENV=build webpack --mode production",
    "start": "NODE_ENV=start node ./server/server.cjs"
  },
  "dependencies": {
    "@rails/webpacker": "^5.4.3",
    "css-loader": "^6.5.1",
    "express": "^4.17.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-svg": "^14.1.6",
    "style-loader": "^3.3.1"
  },
  "devDependencies": {
    "@babel/core": "^7.16.7",
    "@babel/preset-env": "^7.16.8",
    "@babel/preset-react": "^7.16.5",
    "@webpack-cli/info": "^1.4.1",
    "@webpack-cli/serve": "^1.6.1",
    "babel-loader": "^8.2.3",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^5.5.0",
    "webpack": "^5.66.0",
    "webpack-cli": "^4.9.1",
    "webpack-dev-server": "^4.7.1"
  }
}

webpack.config.js is like:

import path from 'path';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import { fileURLToPath } from 'url';
import webpack from 'webpack';

const __dirname = path.dirname(fileURLToPath(import.meta.url));

export default {
  entry: path.join(__dirname, "src", "index.js"),
  output: {
    path:path.resolve(__dirname, "dist"),
  },
  module: {
    rules: [
      {
        test: /.(js|jsx)$/,
        exclude: /node_modules/,
        use:  ["babel-loader"]
      },
      {
        test: /.(png|svg|jpg)$/,
        use: ["file-loader"]
      },
      {
        test: /(.css)$/,
        use: ["style-loader", "css-loader"],
      },
    ]
  },
  resolve:{
    extensions : [".js"],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: path.join(__dirname, "src", "index.html"),
    }),
    new webpack.EnvironmentPlugin({
      NODE_ENV: 'development'
    }),
  ],
}

(NO ‘.babelrc’)

I thought auto update option(version with ^) makes issue that roll back modules to before version, but it makes same issue.

I found this exception during few days, but i cannot found real reason of this issue.

what’s the wrong with this config?