Missing Semicolon Error in node js webpack - node.js

Question

I am getting semicolon error in one of my json files while building my project using webpack, my json files are formated and still giving me this error. I am using these
"#babel/cli": "^7.6.2",
"#babel/core": "^7.5.5",
"#babel/preset-env": "^7.20.2",
"babel-core": "^6.26.3",
"babel-eslint": "^10.1.0",
"babel-loader": "^9.1.0",
"eslint": "^7.0.0",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-loader": "^4.0.2",
"eslint-plugin-import": "^2.18.2",
"nodemon": "^2.0.20",
"nodemon-webpack-plugin": "^4.3.1",
"terser-webpack-plugin": "5.3.6",
"webpack": "^5.75.0",
"webpack-cli": "^5.0.1",
"webpack-node-externals": "^3.0.0"
here is the error:
ERROR in ./src/express/routes/channels/libs/etsy/etsy.config.json
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: C:\src\express\routes\channels\libs\etsy\etsy.config.json: Missing semicolon. (2:7)
1 | {
> 2 | "env": "development",
| ^
3 | "shopId": "FabricAndSewing",
4 | "key": "65hgx4sow7ih76bb9sir78f7",
5 | "secret": "8eoy84mw8u",
at instantiate (C:\Excersys\FASAPI3\node_modules\#babel\parser\lib\index.js:67:32)
at constructor (C:\Excersys\FASAPI3\node_modules\#babel\parser\lib\index.js:364:12)
webpackConfig.js
import * as path from "path";
import Dotenv from "dotenv-webpack";
import nodeExternals from "webpack-node-externals";
import NodemonPlugin from "nodemon-webpack-plugin";
const __dirname = path.resolve(path.dirname(""));
const config = (env, argv) => ({
entry: {
server: "./src/index.js",
},
output: {
path: path.join(__dirname, "dist"),
publicPath: "/",
filename: "[name].js",
},
mode: argv.mode,
target: "node",
node: {
__dirname: false,
__filename: false,
},
externals: [nodeExternals()],
module: {
rules: [
{
test: /\.m?js/,
resolve: {
fullySpecified: false,
},
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["#babel/preset-env"],
},
},
},
],
parser: {
javascript: {
// ...
commonjsMagicComments: true,
},
},
},
plugins: [new NodemonPlugin(), new Dotenv()],
resolve: {
extensions: [".js", ".json", ".wasm"],
},
});
export default config;
.eslintrc.js
module.exports = {
env: {
browser: true,
node: true,
es2022: true,
},
// extends: ['airbnb-base'],
// globals: {
// Atomics: 'readonly',
// SharedArrayBuffer: 'readonly'
// },
parserOptions: {
ecmaVersion: "latest",
sourceType: "module",
ecmaFeatures: {
jsx: true,
},
},
rules: {
semi: "off",
},
};
I tried different webpack and eslint configs but nothing worked