How to use

Give the build the page boundary the bundler cannot infer.

next-slug-splitter works when a broad Next.js route can identify the route-specific code one page needs. This page gives the short path; the full reference stays in GitHub next to the implementation.

What you provide

A broad dynamic or catch-all Next.js route
A build-time way to know what one page needs
A route target config that gives the splitter that boundary

Install

Add the splitter beside Next.js. The repository README remains the source of truth for supported versions.

pnpm add next-slug-splitter next

Wrap the Next config

import { withSlugSplitter } from 'next-slug-splitter/next';
import { routeHandlersConfig } from './route-handlers-config';

export default withSlugSplitter(nextConfig, {
  routeHandlersConfig
});

Describe route targets

Point the config at the broad route, the content source, and the processor that knows which page keys map to which imports.

export const routeHandlersConfig = {
  routerKind: 'app',
  targets: [
    createAppCatchAllRouteHandlersPreset({
      routeSegment: 'docs',
      contentDir: 'content/pages',
      routeContract: relativeModule('app/docs/[...slug]/route-contract'),
      handlerBinding
    })
  ]
};

Build and verify

Run the normal Next build. Then use the benchmark to confirm that light routes no longer carry heavier route chunks.

pnpm next build

Reference

Details live in GitHub.

The README contains the full setup guide, router-specific examples, operation modes, and configuration reference. The website stays short so it does not drift from the code.