Graphql-request using typescript webpack config set up

I have a rest api written in typeScript and one of my downstream API is in Graphql. I am using graphql-request to consume the downstream graphql api.

Version in package.json

"graphql": "^16.6.0",
"graphql-request": "^6.1.0",

and my code is

import { GraphQLClient, gql } from 'graphql-request'


export const getUser = async (authToken: AuthToken) => {

    const endpoint = `${process.env.Url}`;
    const query: string = gql`
         query {
            getUserInfo(Id: "5fc2ca90") 
            {
                name
                phone
            }
        }`;

    const client = new GraphQLClient(endpoint, { headers: { authorization: `Bearer ${authToken.value}` } });
    client.request(query).then((data) => { console.log(data) });

I am seeing build error in my terminal

ERROR in ./node_modules/graphql-request/build/cjs/index.js 108:57
Module parse failed: Unexpected token (108:57)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|             variables,
|             operationName,
>             jsonSerializer: fetchOptions.jsonSerializer ?? defaultJsonSerializer_js_1.defaultJsonSerializer,
|         });
|     }

Webpack.config

const path = require('path');

module.exports = {
    entry: {
        MyLambda: 'LambdaPath',
       ,
    target: 'node',
    output: {
        path: path.resolve(__dirname, 'terraform', 'dist'),
        filename: '[name].js',
        libraryTarget: 'commonjs2'
    },
    mode:'production',
    resolve: {
        extensions: ['.tsx', '.ts', '.js', '.json']
    },
    module: {
        rules: [
            {
                test: /.tsx?$/,
                use: ['ts-loader'],
                exclude: /node_modules/
            }
        ]
    },
    externals: [/^aws-sdk/]
};