environment for Next.js issue

next.config.js

const fs = require(`fs`)
const withCSS = require(`@zeit/next-css`)
const blogPostsFolder = `./_content/posts`
const withMdxFm = require(`next-mdx-frontmatter`)

const getPathsForPosts = () => {
  return fs
    .readdirSync(blogPostsFolder)
    .map((blogName) => {
      const trimmedName = blogName.substring(0, blogName.length - 3)
      return {
        [`/${trimmedName}`]: {
          page: `/posts/post`,
          query: {
            slug: trimmedName,
          },
        },
      }
    })
    .reduce((acc, curr) => {
      return { ...acc, ...curr }
    }, {})
}

module.exports = withCSS(
  withMdxFm({
    extension: /\.md$/,
  })({
    pageExtensions: [`md`, `tsx`, `ts`, `jsx`, `js`],
    target: `serverless`,
    experimental: {
      reactMode: `concurrent`,  // !! this fixes the issue !!
    },
    webpack: (originalConfiguration, { isServer }) => {
      const configuration = originalConfiguration
      if (!isServer) {
        configuration.node = {
          fs: `empty`,
        }
      }
      configuration.mode = `development`
      configuration.cache = false
      configuration.stats = `verbose`

      return configuration
    },
    async exportPathMap(defaultPathMap) {
      return {
        ...defaultPathMap,
        ...getPathsForPosts(),
      }
    },
  })
)

package.json

{
  "name": "npx",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "build": "next build",
    "start": "next start",
    "dev": "NODE_OPTIONS='--inspect' next dev",
    "export": "npm run build && next export"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "dependencies": {
    "@babel/plugin-transform-runtime": "^7.11.0",
    "@babel/runtime": "^7.11.2",
    "@mdx-js/loader": "^1.6.16",
    "@mdx-js/runtime": "^1.6.16",
    "@next/bundle-analyzer": "^9.5.2",
    "@next/mdx": "^9.5.2",
    "@tailwindcss/typography": "^0.2.0",
    "@tailwindcss/ui": "^0.5.0",
    "@zeit/next-css": "^1.0.1",
    "axios": "^0.19.2",
    "babel-loader": "^8.1.0",
    "next": "9.5.2",
    "next-mdx-frontmatter": "0.0.3",
    "next-seo": "4.7.3",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "stringify-object": "^3.3.0",
    "styled-components": "^5.1.1",
    "tailwindcss": "^1.6.2",
    "twin.macro": "^1.7.0"
  },
  "devDependencies": {
    "@babel/preset-env": "^7.11.0",
    "@babel/preset-react": "^7.10.4",
    "@types/node": "^14.0.27",
    "@types/react": "^16.9.46",
    "@types/webpack-env": "^1.15.2",
    "@typescript-eslint/eslint-plugin": "^3.9.0",
    "@typescript-eslint/parser": "^3.9.0",
    "eslint": "^7.7.0",
    "eslint-config-blvd": "^1.0.2",
    "eslint-config-node": "^4.1.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-prettier": "^3.1.4",
    "eslint-plugin-react-hooks": "^4.0.8",
    "prettier": "^2.0.5",
    "stylelint": "13.6.1",
    "twin.macro": "^1.7.0",
    "typescript": "^3.9.7",
    "typescript-plugin-tw-template": "^2.0.1"
  },
  "babelMacros": {
    "twin": {
      "config": "tailwind.config.js",
      "preset": "styled-components",
      "debugProp": true,
      "debugPlugins": false,
      "debug": false
    }
  }
}

tsconfig.json

{
  "compilerOptions": {
    "target": "ES2020",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve"
  },
  //"plugins": [{ "name": "typescript-plugin-tw-template" }],
  "include": ["**/*.ts", "**/*.tsx"],
  "exclude": []
}