next.config.js

// incase you want your custom nextjs modules to be imported as absolute paths

require('dotenv').config()
const path = require('path');

module.exports ={
    env:{
        MY_STEP:process.env.MY_STEP
    },
    serverRuntimeConfig: {
        // Will only be available on the server side
        MY_SECRET: process.env.MY_SECRET
      },
      publicRuntimeConfig: {
        // Will be available on both server and client
        API_ENDPOINT: '/myapi/version/1',
      },
    // enable absolute path (eg: container/Home instead of ../container/Home)
      webpack(config) {
      config.resolve.modules.push(path.resolve('./'))
      
      return config
      }
}

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
     
     
    "baseUrl": ".",
    "paths": {
      "*": [
        "*"
      ]
    }
   
   
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ]
}