@djangocfg/nextjs 2.1.33 → 2.1.35

package/README.md

@@ -17,6 +17,7 @@
 
 ## Features
 
+- **Dev Server with Browser Auto-Open** - Cross-platform CLI that works with Turbopack and webpack
 - **Zero-Config PWA** - Progressive Web App out of the box (service worker, offline support, manifest)
 - **Base Next.js Config** - Universal, reusable Next.js configuration factory for monorepos
 - **AI Documentation** - Search DjangoCFG docs via MCP server and CLI
@@ -39,6 +40,27 @@ yarn add @djangocfg/nextjs
 
 ## Quick Start
 
+### Next.js Dev Server with Auto Browser Open
+
+Start Next.js dev server with automatic browser opening (works with both Turbopack and webpack):
+
+```bash
+# In package.json
+{
+  "scripts": {
+    "dev": "nextjs-dev -p 3000",           // Turbopack + auto browser open
+    "dev:webpack": "nextjs-dev --webpack"  // webpack + auto browser open
+  }
+}
+```
+
+**Features:**
+- ✅ Cross-platform (macOS, Windows, Linux)
+- ✅ Works with Turbopack (Next.js 16 default)
+- ✅ Works with webpack mode
+- ✅ Waits for server to be ready before opening
+- ✅ Zero configuration
+
 ### AI Documentation Search
 
 Search DjangoCFG documentation from the terminal:

package/bin/dev-with-browser.js

@@ -0,0 +1,114 @@
+#!/usr/bin/env node
+/**
+ * Next.js Dev Server with Auto Browser Opening
+ *
+ * Cross-platform solution that works with both Turbopack and webpack
+ * Opens browser automatically when server is ready
+ *
+ * Usage:
+ *   "dev": "dev-with-browser"
+ *   "dev": "dev-with-browser --port 3000"
+ *   "dev": "dev-with-browser --webpack"
+ */
+
+const { spawn } = require('child_process');
+const { exec } = require('child_process');
+const consola = require('consola');
+
+// Parse arguments
+const args = process.argv.slice(2);
+
+// Extract port
+let PORT = process.env.PORT || '3000';
+const portIndex = args.findIndex(arg => arg === '-p' || arg === '--port');
+if (portIndex !== -1 && args[portIndex + 1]) {
+  PORT = args[portIndex + 1];
+}
+
+// Build next dev command
+const nextArgs = ['dev', '-p', PORT];
+
+// Check if --webpack flag is present
+const hasWebpackFlag = args.includes('--webpack');
+
+// Add --turbopack by default (unless --webpack is specified)
+// This silences the "webpack config with no turbopack config" warning
+if (!hasWebpackFlag) {
+  nextArgs.push('--turbopack');
+}
+
+// Pass through other flags, excluding port arguments
+args.forEach((arg, i) => {
+  const isPreviousPort = i > 0 && (args[i - 1] === '-p' || args[i - 1] === '--port');
+  const isPortFlag = arg === '-p' || arg === '--port';
+
+  if (!isPortFlag && !isPreviousPort) {
+    nextArgs.push(arg);
+  }
+});
+
+const URL = `http://localhost:${PORT}`;
+
+consola.info(`Starting Next.js dev server on port ${PORT}...`);
+
+// Start Next.js dev server
+const devServer = spawn('next', nextArgs, {
+  stdio: 'inherit',
+  shell: true,
+});
+
+// Wait for server to be ready, then open browser
+let serverReady = false;
+let attempts = 0;
+const maxAttempts = 60; // 30 seconds max
+
+const checkInterval = setInterval(async () => {
+  if (serverReady || attempts >= maxAttempts) {
+    if (attempts >= maxAttempts) {
+      consola.warn('Server took too long to start, skipping browser open');
+    }
+    clearInterval(checkInterval);
+    return;
+  }
+
+  attempts++;
+
+  try {
+    const response = await fetch(URL);
+    if (response.ok) {
+      serverReady = true;
+      clearInterval(checkInterval);
+
+      consola.success(`Server ready! Opening browser at ${URL}`);
+
+      // Open browser (cross-platform)
+      const command = process.platform === 'darwin'
+        ? 'open'
+        : process.platform === 'win32'
+        ? 'start'
+        : 'xdg-open';
+
+      exec(`${command} ${URL}`, (error) => {
+        if (error) {
+          consola.warn(`Failed to open browser: ${error.message}`);
+          consola.info(`Please open manually: ${URL}`);
+        }
+      });
+    }
+  } catch (err) {
+    // Server not ready yet, continue checking
+  }
+}, 500);
+
+// Cleanup on exit
+process.on('SIGINT', () => {
+  clearInterval(checkInterval);
+  devServer.kill();
+  process.exit();
+});
+
+process.on('SIGTERM', () => {
+  clearInterval(checkInterval);
+  devServer.kill();
+  process.exit();
+});

package/dist/config/index.d.mts

@@ -338,7 +338,11 @@ interface BaseNextConfigOptions {
     transpilePackages?: string[];
     /** Additional optimize package imports (merged with defaults) */
     optimizePackageImports?: string[];
-    /** Automatically open browser in dev mode (default: false) */
+    /**
+     * Automatically open browser in dev mode (default: false)
+     * NOTE: Only works with webpack mode in Next.js 16+ (Turbopack doesn't support webpack plugins)
+     * For Turbopack compatibility, use a custom dev script instead of this option
+     */
     openBrowser?: boolean;
     /** Check for @djangocfg/* package updates on startup (default: true) */
     checkUpdates?: boolean;

package/dist/config/index.mjs

@@ -14,7 +14,7 @@ var require_package = __commonJS({
   "package.json"(exports, module) {
     module.exports = {
       name: "@djangocfg/nextjs",
-      version: "2.1.33",
+      version: "2.1.35",
       description: "Next.js server utilities: sitemap, health, OG images, contact forms, navigation, config",
       keywords: [
         "nextjs",
@@ -97,11 +97,13 @@ var require_package = __commonJS({
       files: [
         "dist",
         "src",
+        "bin",
         "README.md",
         "LICENSE"
       ],
       bin: {
-        "djangocfg-docs": "./dist/ai/cli.mjs"
+        "djangocfg-docs": "./dist/ai/cli.mjs",
+        "nextjs-dev": "./bin/dev-with-browser.js"
       },
       scripts: {
         build: "tsup",
@@ -1452,9 +1454,6 @@ function createBaseNextConfig(options = {}) {
   const baseConfig = {
     reactStrictMode: true,
     trailingSlash: true,
-    // Turbopack config (empty to silence Next.js 16 warning about webpack config)
-    // Webpack config is still used for dev startup plugin and compression
-    turbopack: {},
     // Static export configuration
     ...isStaticBuild && {
       output: "export",
@@ -1531,6 +1530,9 @@ function createBaseNextConfig(options = {}) {
       ...options.experimental
     },
     // Webpack configuration
+    // NOTE: Next.js 16 uses Turbopack by default in dev mode, which doesn't support webpack plugins.
+    // DevStartupPlugin only runs in webpack mode (next dev --webpack).
+    // For Turbopack compatibility, consider using a custom dev script for browser auto-open.
     webpack: (config, webpackOptions) => {
       const { isServer, dev } = webpackOptions;
       if (dev && !isServer) {