withWCR Configuration Wrapper

withWCR is a Next.js configuration wrapper that sets up WordPress connection, generates API redirects, and configures environment variables.

// next.config.mjs
import { withWCR } from '@axistaylor/nextpress/withWCR';

const nextConfig = {
  // Your existing Next.js config
};

export default withWCR(nextConfig, {
  wpDomain: 'your-wordpress.com',
  wpProtocol: 'https',
  frontendDomain: 'localhost:3000',
  frontendProtocol: 'http',
});

export default withWCR(nextConfig, {
  wpDomain: 'wordpress.example.com',
  wpProtocol: 'https',
  // Optional: Override if WordPress is in a subdirectory
  wpHomeUrl: 'https://wordpress.example.com',
  wpSiteUrl: 'https://wordpress.example.com/wp', // Bedrock setup
  frontendDomain: 'app.example.com',
  frontendProtocol: 'https',
});

The third argument to withWCR configures frontend behavior:

By default, the NEXTPRESS_WP_INSTANCES environment variable is only available server-side to prevent leaking backend URLs to the client bundle. Set instancesReadableOnClient: true if you need to call getWPInstance(), getAllWPInstances(), or getInstanceSlugs() from client components or 'use client' modules:

export default withWCR(nextConfig, wpConfig, {
  frontendDomain: 'localhost:3000',
  frontendProtocol: 'http',
  instancesReadableOnClient: true,
});

Security note: Enabling this exposes your WordPress domain, protocol, and URLs in the client bundle. Only enable it if your WordPress backend is publicly accessible and you need client-side access to the instance configuration.

For connecting to multiple WordPress backends:

export default withWCR(nextConfig, {
  instances: {
    default: {
      wpDomain: 'main.example.com',
      wpProtocol: 'https',
    },
    blog: {
      wpDomain: 'blog.example.com',
      wpProtocol: 'https',
    },
    shop: {
      wpDomain: 'shop.example.com',
      wpProtocol: 'https',
      wpSiteUrl: 'https://shop.example.com/wp',
    },
  },
  frontendDomain: 'app.example.com',
  frontendProtocol: 'https',
});

See Multi-WordPress Setup for complete documentation.

Automatically creates Next.js redirects for WordPress API routes:

// Generated redirects (simplified)
{
  source: '/?wc-ajax=:action',
  destination: '/atx/default/wc?wc-ajax=:action',
},
{
  source: '/?wp-ajax=:action',
  destination: '/atx/default/wp?wp-ajax=:action',
},
{
  source: '/wp-json/:path*',
  destination: '/atx/default/wp-json/:path*',
}

Injects WordPress configuration into environment variables:

// Available in your app
process.env.NEXT_PUBLIC_FRONTEND_URL // Frontend URL
process.env.wcr_instances // JSON string of instance configs (Edge runtime)

During build, writes a config file for Node.js runtime access:

.nextpress/config.json

Your existing Next.js configuration is preserved:

const nextConfig = {
  images: {
    domains: ['example.com'],
  },
  async redirects() {
    return [
      { source: '/old', destination: '/new', permanent: true },
    ];
  },
};

// withWCR merges your redirects with WordPress redirects
export default withWCR(nextConfig, { /* ... */ });

{
  wpDomain: 'example.com',
  wpProtocol: 'https',
  // Defaults:
  // wpHomeUrl: 'https://example.com'
  // wpSiteUrl: 'https://example.com'
}

For WordPress installed in a subdirectory (common with Bedrock):

{
  wpDomain: 'example.com',
  wpProtocol: 'https',
  wpHomeUrl: 'https://example.com',
  wpSiteUrl: 'https://example.com/wp', // WordPress core in /wp
}

{
  wpDomain: 'cms.example.com',
  wpProtocol: 'https',
}

import { withWCR } from '@axistaylor/nextpress/withWCR';
import type { NextConfig } from 'next';

const nextConfig: NextConfig = {};

export default withWCR(nextConfig, {
  wpDomain: 'example.com',
  wpProtocol: 'https',
  frontendDomain: 'localhost:3000',
  frontendProtocol: 'http',
});

• proxyByWCR - Middleware proxy setup
• Multi-WordPress Setup - Multiple backends
• Getting Started - Initial setup