feat(nextjs): update to Next.js 13.2.4

docs/generated/packages/react/generators/library.json

@@ -185,6 +185,13 @@
         "default": false,
         "x-priority": "internal"
       },
+      "includeDeepImports": {
+        "description": "Add a deep-import entry to tsconfig.",
+        "type": "boolean",
+        "hidden": true,
+        "default": false,
+        "x-priority": "internal"
+      },
       "minimal": {
         "description": "Create a React library with a minimal setup, no separate test files.",
         "type": "boolean",

packages/js/src/utils/typescript/ts-config.ts

@@ -59,6 +59,9 @@ export function updateRootTsConfig(
     importPath?: string;
     projectRoot: string;
     js?: boolean;
+    // For Next.js RSC users need to use deep-imports as a workaround for mixed RSC + 'use client' libraries.
+    // See: https://github.com/nrwl/nx/issues/15830
+    includeDeepImports?: boolean;
   }
 ) {
   if (!options.importPath) {
@@ -85,6 +88,12 @@ export function updateRootTsConfig(
       ),
     ];
 
+    if (options.includeDeepImports) {
+      c.paths[`${options.importPath}/*`] = [
+        joinPathFragments(options.projectRoot, './*'),
+      ];
+    }
+
     return json;
   });
 }

packages/next/migrations.json

@@ -301,6 +301,23 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "15.9.3": {
+      "version": "15.9.3-beta.0",
+      "packages": {
+        "next": {
+          "version": "13.2.4",
+          "alwaysAddToPackageJson": false
+        },
+        "eslint-config-next": {
+          "version": "13.2.4",
+          "alwaysAddToPackageJson": false
+        },
+        "sass": {
+          "version": "1.60.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/next/plugins/with-nx.ts

@@ -224,6 +224,13 @@ export function getNextConfig(
   const userWebpack = nextConfig.webpack || ((x) => x);
   const { nx, ...validNextConfig } = nextConfig;
   return {
+    // Need to skip type checks for now when app layout is enabled until Next.js releases a fix.
+    // The PR is merged but unreleased.
+    // PR: https://github.com/vercel/next.js/pull/47534
+    typescript: {
+      ignoreBuildErrors: !!validNextConfig?.experimental?.appDir,
+      ...(validNextConfig.typescript ?? {}),
+    },
     eslint: {
       ignoreDuringBuilds: true,
       ...(validNextConfig.eslint ?? {}),

packages/next/src/generators/library/library.spec.ts

@@ -4,9 +4,11 @@ import { createTreeWithEmptyWorkspace } from '@nrwl/devkit/testing';
 import { Linter } from '@nrwl/linter';
 import libraryGenerator from './library';
 import { Schema } from './schema';
+
 // need to mock cypress otherwise it'll use the nx installed version from package.json
 //  which is v9 while we are testing for the new v10 version
 jest.mock('@nrwl/cypress/src/utils/cypress-version');
+
 describe('next library', () => {
   let mockedInstalledCypressVersion: jest.Mock<
     ReturnType<typeof installedCypressVersion>
@@ -133,4 +135,25 @@ describe('next library', () => {
         .jsxImportSource
     ).toEqual('@emotion/react');
   });
+
+  it('should add deep import paths in tsconfig', async () => {
+    const appTree = createTreeWithEmptyWorkspace();
+
+    await libraryGenerator(appTree, {
+      name: 'myLib',
+      linter: Linter.EsLint,
+      skipFormat: false,
+      skipTsConfig: false,
+      unitTestRunner: 'jest',
+      style: 'css',
+      component: true,
+    });
+
+    expect(
+      readJson(appTree, 'tsconfig.base.json').compilerOptions.paths
+    ).toMatchObject({
+      '@proj/my-lib': ['my-lib/src/index.ts'],
+      '@proj/my-lib/*': ['my-lib/*'],
+    });
+  });
 });

packages/next/src/generators/library/library.ts

@@ -33,6 +33,9 @@ export async function libraryGenerator(host: Tree, options: Schema) {
     ...options,
     compiler: 'swc',
     skipFormat: true,
+    // Always include deep import paths so users can mix server and client react components in the same library.
+    // See: https://github.com/nrwl/nx/issues/15830
+    includeDeepImports: true,
   });
   tasks.push(libTask);
 

packages/next/src/utils/versions.ts

@@ -1,8 +1,8 @@
 export const nxVersion = require('../../package.json').version;
 
-export const nextVersion = '13.1.1';
-export const eslintConfigNextVersion = '13.1.1';
-export const sassVersion = '1.55.0';
+export const nextVersion = '13.2.4';
+export const eslintConfigNextVersion = '13.2.4';
+export const sassVersion = '1.60.0';
 export const lessLoader = '11.1.0';
 export const stylusLoader = '7.1.0';
 export const emotionServerVersion = '11.10.0';

packages/react/src/generators/library/schema.d.ts

@@ -11,6 +11,7 @@ export interface Schema {
   globalCss?: boolean;
   importPath?: string;
   inSourceTests?: boolean;
+  includeDeepImports?: boolean;
   js?: boolean;
   linter: Linter;
   name: string;

packages/react/src/generators/library/schema.json

@@ -188,6 +188,13 @@
       "default": false,
       "x-priority": "internal"
     },
+    "includeDeepImports": {
+      "description": "Add a deep-import entry to tsconfig.",
+      "type": "boolean",
+      "hidden": true,
+      "default": false,
+      "x-priority": "internal"
+    },
     "minimal": {
       "description": "Create a React library with a minimal setup, no separate test files.",
       "type": "boolean",