Duplicate “graphql” modules cannot be used at the same time since different versions may have different capabilities and behaviour

`Currently i am facing the problem during the migration of the Apollo server from version 2 to version 4 We are downloading and implementing changes in lot of packages mainly when it comes to the Graphql package i have downloaded all the components and installed in my machine but some packages says that duplicate graphql modules are present and so the compilation error occurs The data from one version used in the function from another produce confusing and spurious results.

[serverless-offline] Error: Cannot use GraphQLObjectType "Query" from another module or realm. [serverless-offline] Ensure that there is only one instance of "graphql" in the node_modules [serverless-offline] directory. If different versions of "graphql" are the dependencies of other [serverless-offline] relied on modules, use "resolutions" to ensure only one version is installed.`

And I have installed these Packages in below setup…and tried Resolutions Packages still getting same errors of Duplicate graphql…enter image description here “

"dev": "concurrently "npm:serverless-offline" "npm:generate-types"
"concurrently": "^6.0.2",
"graphql": "16.8.0",
"graphql-constraint-directive": "^2.3.0",
"graphql-disable-introspection": "^1.2.0",
"graphql-scalars": "^1.22.2",
"graphql-tag": "^2.12.6",
"graphql-type-json": "^0.3.2",
"serverless": "^3.33.0",
"serverless-iam-roles-per-function": "^3.2.0",
"serverless-offline": "^6.9.0",
"serverless-offline-scheduler": "^0.5.0",
"serverless-plugin-browserify": "^1.1.3",
"serverless-plugin-datadog": "^2.31.0",
"serverless-plugin-typescript": "^1.1.9",
"serverless-pseudo-parameters": "^2.6.0",
"serverless-tscpaths": "0.0.5",
"ts-jest": "^26.5.3",
"ts-node": "^10.7.0",
"ts-node-register": "^1.0.0",
"tsconfig-paths": "^3.9.0",
"typescript": "^4.7.0"
"resolutions": { "graphql": "16.8.0" },

In Apollo server Migration in below middleware setup but getting errors of duplicate graphql version and we have used graphql scalars resolvers, is this below setup enough, how do i solve this below setup initialize resolvers is that fine? any alternative method to connect graphql resolvers used in middleware…

Can You please Explain in a Simple Manner the Apollo migration Process version2 to version 4 Middle Ware Setup…(version3 deprecated)
import { makeExecutableSchema } from ‘@graphql-tools/schema’
import initializeTypeDefs from ‘../helpers/initializeTypeDefs’
import initializeResolvers from ‘../helpers/initializeResolvers’
Inside Path {

import { IResolvers } from '@graphql-tools/utils'
import { GraphQLJSON, GraphQLDate, GraphQLDateTime, 
 GraphQLLocalDate } from 'graphql-scalars'
 import GraphQLJSON from 'graphql-type-json'
 import { GraphQLScalarType } from 'graphql';
 import 'app' from '@gqlResolvers/app'
 }
app.use('/v1', v1Api) const httpServer = http.createServer(app)

app.use(async (_, res, next) => 
{ const typeDefs = await initializeTypeDefs() 
const resolvers = initializeResolvers() 
const apolloConfig = { schema: addMocksToSchema({ 
    schema: await makeExecutableSchema({ typeDefs, resolvers }), }),
context: ({ res }) => { console.log(res, res) return { user: 
res.locals?.user ?? null, } },}

const apolloServer = new ApolloServer<MyContext>
({ ...apolloConfig,
plugins: [ApolloServerPluginDrainHttpServer({ 
httpServer })], 
introspection: process.env.stage === 'production' || 
process.env.stage === 'staging', }) 
await apolloServer.start() app.use( '/graphql', 
cors<cors.CorsRequest>(), json(),
expressMiddleware(apolloServer, 
{ context: async ({ req }) => ({ token: req.headers.token }) }) ) 
res.on('finish', async () => 
{ await Model.knex().destroy() })
console.log(🚀 Server ready at https://localhost:3000/graphql) 
return next()`