@codedesignai/nextjs-live-edit-plugin 1.0.4 → 1.0.5

package/index.js

@@ -2,8 +2,11 @@ const path = require('path');
 
 /**
  * Next.js config wrapper that enables the live edit plugin.
- * Configures both Turbopack (turbopack.rules) and webpack loaders
- * so the source mapper works regardless of which bundler is active.
+ * Uses Turbopack's built-in webpack loader support via turbopack.rules.
+ *
+ * NOTE: Only Turbopack is supported. Adding a `webpack` key to the config
+ * causes hydration mismatches in Next.js 16 because the loader would only
+ * run on client-side builds, while server-rendered HTML has no data attributes.
  *
  * Usage in next.config.js (CommonJS):
  *
@@ -26,7 +29,6 @@ const path = require('path');
  */
 function withLiveEdit(nextConfig = {}, pluginOptions = {}) {
   const sourceDirs = pluginOptions.sourceDirs || ['app', 'components', 'src'];
-  const projectRoot = pluginOptions.projectRoot || process.cwd();
 
   // Only add source mapping in development mode
   if (process.env.NODE_ENV === 'production') {
@@ -34,67 +36,32 @@ function withLiveEdit(nextConfig = {}, pluginOptions = {}) {
   }
 
   const loaderPath = path.resolve(__dirname, 'source-mapper-loader.js');
-  const loaderOptions = {
-    sourceDirs,
-    projectRoot,
+  const loaderConfig = {
+    loader: loaderPath,
+    options: {
+      sourceDirs,
+      projectRoot: process.cwd(),
+    },
   };
 
-  // Preserve the user's existing webpack function if they have one
-  const existingWebpack = nextConfig.webpack;
-
   // Merge with existing turbopack config
   const existingTurbopack = nextConfig.turbopack || {};
   const existingRules = existingTurbopack.rules || {};
 
-  const turbopackLoaderConfig = {
-    loader: loaderPath,
-    options: loaderOptions,
-  };
-
   return {
     ...nextConfig,
-
-    // ── Turbopack (next dev --turbopack) ──────────────────────────────
     turbopack: {
       ...existingTurbopack,
       rules: {
         ...existingRules,
         '*.jsx': {
-          loaders: [turbopackLoaderConfig],
+          loaders: [loaderConfig],
         },
         '*.tsx': {
-          loaders: [turbopackLoaderConfig],
+          loaders: [loaderConfig],
         },
       },
     },
-
-    // ── Webpack (next dev without --turbopack) ───────────────────────
-    webpack: (config, webpackOptions) => {
-      // Only add to client-side builds (server components don't render in browser)
-      if (!webpackOptions.isServer) {
-        // Resolve source directories to absolute paths for the webpack include filter
-        const includePaths = sourceDirs.map(dir => path.resolve(projectRoot, dir));
-
-        config.module.rules.push({
-          test: /\.(jsx|tsx)$/,
-          include: includePaths,
-          enforce: 'pre',
-          use: [
-            {
-              loader: loaderPath,
-              options: loaderOptions,
-            },
-          ],
-        });
-      }
-
-      // Chain with the user's existing webpack config if present
-      if (typeof existingWebpack === 'function') {
-        return existingWebpack(config, webpackOptions);
-      }
-
-      return config;
-    },
   };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codedesignai/nextjs-live-edit-plugin",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Next.js plugin for live editing React components with AST-powered source mapping",
   "main": "index.js",
   "exports": {