Error Couldn’t find a `pages` directory. Please create one under the project root”

Previously my project setup was

public
.next
src
   pages
   components
   assets
next.config.js

This was working fine but I changed the structure to following

public
src
   client
    next.config.js
    jsconfig.json
    pages
    components
    assets
   server
    index.js

now this one is not working. I am getting error Couldn't find apagesdirectory. Please create one under the project root

Here is my updated next.config.js

const withPlugins = require("next-compose-plugins");
const optimizedImages = require("next-optimized-images");
const withPWA = require("next-pwa");

module.exports = withPlugins(
    [optimizedImages],
    [
      withPWA({
        pwa: {
          dest: "public",
        },
      }),
    ],
    {
      distDir: '../../dist/client',
    }
);

for absolute import(import Button from ‘components/Button’)

jsconfig.json

{
    "compilerOptions": {
      "baseUrl": "client/"
    }
  }

package.json

"scripts": {
    "dev:client": "nextjs src/client",
    "dev:server": "node src/server --out-dir dist/server --source-maps --watch",
    "dev": "dotenv -e .env.development yarn dev:client & yarn dev:server",
    "build": "yarn build:client && yarn build:server",
    "build:client": "dotenv -e .env.production next build src/client",
    "build:server": "node src/server --out-dir dist/server --source-maps",
    "build:staging": "yarn build:staging:client && yarn build:server",
    "build:staging:client": "dotenv -e .env.staging next build src/client",
    "start": "next start",
  },

.babelrc

{

    "plugins": [
      [
        "styled-components",
        {
          "ssr": true,
          "displayName": true,
          "preprocess": false
        }
      ]
    ],
    "presets": [
      "next/babel"
    ]
  }

Answer

As per the official NextJs documentation pages folder can be moved inside the src folder. But Config files like next.config.js and tsconfig.json should be inside the root directory, moving them to src won’t work. Same goes for the public directory.

Move your next.config.js file to root folder.

Reference: https://nextjs.org/docs/advanced-features/src-directory