Custom Next pages directory

README.md

Custom Next pages directory

Next.js has a limited set of possible pages-directories, either pages or src/pages. This is not going to change in the future, as mentioned here.

In some cases it is necessary or helpful to have a custom pages-directory.

These two snippets make it possible:

patch-custom-next-pages-dir.js

Monkey-patches findPagesDir inside of next to check for the custom pages-directory at RELATIVE_CUSTOM_PAGES_PATH.

package.json

Provides a custom next command which automatically requires the patch-custom-next-pages-dir.js-file before calling the Next.js-CLI.

package.json

{
  "scripts": {
    "next": "node -r ./patch-custom-next-pages-dir.js ./node_modules/next/dist/bin/next",
    "dev": "npm run next",
    "build": "npm run next build",
    "start": "npm run next start"
  }
}

patch-custom-next-pages-dir.js

const { join } = require('path');
const findPagesDir = require('next/dist/lib/find-pages-dir');

const RELATIVE_CUSTOM_PAGES_PATH = 'src/client/pages';

function isPatched() {
  return !!findPagesDir.__isPatched;
}

function patchCustomNextPagesDir() {
  const originalFindPagesDir = findPagesDir.findPagesDir;
  findPagesDir.findPagesDir = function (dir) {
    try {
      return originalFindPagesDir(dir);
    } catch (e) {
      const pagesDir = join(dir, RELATIVE_CUSTOM_PAGES_PATH);
      if (findPagesDir.existsSync(pagesDir)) {
        return pagesDir;
      }
      throw e;
    }
  };
  findPagesDir.__isPatched = true;
}

if (!isPatched()) {
  patchCustomNextPagesDir();
}