Getting module not build error due to sass-loader - reactjs

Question

I am getting the below error while running the command npm run dev. But the same code is working fine in my colleague system. I am not getting what went wrong.
When I am adding one global.scss file in App.js then only I am getting the below error otherwise component level scss file working fine.
ERROR in ./src/client/styles/global.scss (./node_modules/css-loader/dist/cjs.js??ref--5-1!./node_modules/sass-loader/dist/cjs.js!./src/client/styles/global.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after "��": expected "{", was ""
on line 1 of C:\Users\Azad\Repos\travelBookingCloud-FE\src\client\styles\global.scss
>> ��
^
# ./src/client/styles/global.scss 2:26-153 43:4-64:5 46:18-145
# ./src/client/client.js
i ｢wdm｣: Failed to compile.
webpack.config.js
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const Dotenv = require('dotenv-webpack');
const miniCssPlugin = new MiniCssExtractPlugin({
filename: "[name].css",
chunkFilename: "[id].css"
});
const htmlPlugin = new HtmlWebpackPlugin({
filename: "index.html",
template: path.join(__dirname, "src", "index.html")
});
const uglifyJsPlugin = new UglifyJsPlugin({
sourceMap: true,
test: /\.min\.js$/i,
});
const dotEnv=new Dotenv();
module.exports = (env, argv)=> {
const isDevelopment = argv.mode === 'development';
return {
optimization: {
nodeEnv: argv.mode
},
entry: path.join(__dirname, "src/client", "client.js"),
output: {
path: path.join(__dirname, "build"),
filename: "bundle.js",
publicPath: '/'
},
mode: argv.mode,
devtool: isDevelopment
? '#eval-source-map'
: 'source-map',
devServer: {
stats: {
children: false,
maxModules: 0
},
port: 3000,
historyApiFallback: true
},
node: {
fs: "empty"
},
resolve: {
modules: ['src/scripts', 'node_modules'],
extensions: ['.jsx', '.js'],
unsafeCache: true,
alias: {
Config: path.resolve(__dirname, 'src/config'),
Components: path.resolve(__dirname, 'src/client/components'),
Constants: path.resolve(__dirname, 'src/client/constants'),
Helpers: path.resolve(__dirname, 'src/client/helpers'),
Views: path.resolve(__dirname, 'src/client/views'),
Widgets: path.resolve(__dirname, 'src/client/widgets'),
App: path.resolve(__dirname, 'src')
}
},
module: {
rules: [
{
test: /.(js|jsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /\.(sa|sc|c)ss$/,
use: [
isDevelopment
? "style-loader"
: MiniCssExtractPlugin.loader,
{
loader: "css-loader",
options: {
importLoaders: 1
}
},
"sass-loader"
]
},
{
test: /\.(png|jpg|jp(e)g|gif|svg)$/i,
use: [
{
loader: "url-loader",
options: {
limit: 8192
}
}
]
},
{
test: /\.(ttf|eot|svg|jpg|jp(e)g|png|woff(2)?)(\?[a-z0-9=&.]+)?$/,
use: [
{
loader: "file-loader",
options: {
name: "[path][name]-[hash:8].[ext]"
}
}
]
}
]
},
plugins: [
uglifyJsPlugin,htmlPlugin,miniCssPlugin,dotEnv
]
};
};
package.json
{
"name": "travelbookingcloud-fe",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack --mode development",
"dev": "webpack-dev-server --mode development --hot --open",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#babel/core": "^7.10.4",
"#babel/plugin-proposal-class-properties": "^7.10.4",
"#babel/preset-env": "^7.10.4",
"#babel/preset-react": "^7.10.4",
"#date-io/date-fns": "^2.6.2",
"#material-ui/core": "^4.11.0",
"#material-ui/icons": "^4.9.1",
"#material-ui/lab": "^4.0.0-alpha.56",
"#material-ui/pickers": "^3.2.10",
"#material-ui/utils": "^4.10.2",
"axios": "^0.19.2",
"babel-loader": "^8.1.0",
"copy-webpack-plugin": "^6.0.3",
"css-loader": "^3.6.0",
"dotenv": "^8.2.0",
"dotenv-webpack": "^1.8.0",
"file-loader": "^6.0.0",
"html-webpack-plugin": "^4.3.0",
"mini-css-extract-plugin": "^0.9.0",
"moment": "^2.27.0",
"node-sass": "^4.14.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-router-dom": "^5.2.0",
"sass-loader": "^8.0.2",
"style-loader": "^1.2.1",
"uglifyjs-webpack-plugin": "^2.2.0",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
},
"dependencies": {
"react-redux": "^7.2.0",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0"
}
}