feat(nextjs): Standalone projects now default to src

nrwl · Jan 15, 2024 · 6b79866 · 6b79866
1 parent d344b56
commit 6b79866
Show file tree

Hide file tree

Showing 27 changed files with 162 additions and 55 deletions.
diff --git a/docs/generated/cli/create-nx-workspace.md b/docs/generated/cli/create-nx-workspace.md
@@ -119,6 +119,12 @@ Type: `boolean`
 
 Enable the App Router for Next.js
 
+### nextSrcDir
+
+Type: `boolean`
+
+Generate a 'src/' directory for Next.js
+
 ### nxCloud
 
 Type: `boolean`

diff --git a/docs/generated/packages/next/generators/application.json b/docs/generated/packages/next/generators/application.json
@@ -124,6 +124,12 @@
         "description": "Enable the App Router for this project.",
         "x-prompt": "Would you like to use the App Router (recommended)?"
       },
+      "src": {
+        "type": "boolean",
+        "default": true,
+        "description": "Generate a `src` directory for the project.",
+        "x-prompt": "Would you like to use `src/` directory?"
+      },
       "rootProject": {
         "description": "Create an application at the root of the workspace.",
         "type": "boolean",

diff --git a/docs/generated/packages/nx/documents/create-nx-workspace.md b/docs/generated/packages/nx/documents/create-nx-workspace.md
@@ -119,6 +119,12 @@ Type: `boolean`
 
 Enable the App Router for Next.js
 
+### nextSrcDir
+
+Type: `boolean`
+
+Generate a 'src/' directory for Next.js
+
 ### nxCloud
 
 Type: `boolean`

diff --git a/docs/generated/packages/workspace/generators/new.json b/docs/generated/packages/workspace/generators/new.json
@@ -65,6 +65,11 @@
         "type": "boolean",
         "default": true
       },
+      "nextSrcDir": {
+        "description": "Generate a `src` directory for this project.",
+        "type": "boolean",
+        "default": true
+      },
       "e2eTestRunner": {
         "description": "The tool to use for running e2e tests.",
         "type": "string",

diff --git a/docs/generated/packages/workspace/generators/preset.json b/docs/generated/packages/workspace/generators/preset.json
@@ -82,6 +82,11 @@
         "type": "boolean",
         "default": true
       },
+      "nextSrcDir": {
+        "description": "Generate a `src` directory for this project.",
+        "type": "boolean",
+        "default": true
+      },
       "e2eTestRunner": {
         "description": "The tool to use for running e2e tests.",
         "type": "string",

diff --git a/e2e/next-core/src/next-pcv3.test.ts b/e2e/next-core/src/next-pcv3.test.ts
@@ -34,7 +34,7 @@ describe('@nx/next/plugin', () => {
     });
   });
 
-  afterAll(() => cleanupProject());
+  // afterAll(() => cleanupProject());
 
   it('nx.json should contain plugin configuration', () => {
     const nxJson = readJson('nx.json');

diff --git a/e2e/next-core/src/next-structure.test.ts b/e2e/next-core/src/next-structure.test.ts
@@ -100,11 +100,11 @@ describe('Next.js Apps Libs', () => {
               `
     );
 
-    const mainPath = `packages/${appName}/pages/index.tsx`;
+    const mainPath = `packages/${appName}/src/pages/index.tsx`;
     const content = readFile(mainPath);
 
     updateFile(
-      `packages/${appName}/pages/api/hello.ts`,
+      `packages/${appName}/src/pages/api/hello.ts`,
       `
               import { jsLibAsync } from '@${proj}/${jsLib}';
     

diff --git a/e2e/next-core/src/next.test.ts b/e2e/next-core/src/next.test.ts
@@ -42,7 +42,7 @@ describe('Next.js Applications', () => {
 
     // check files are generated without the layout directory ("apps/") and
     // using the project name as the directory when no directory is provided
-    checkFilesExist(`${appName}/app/page.tsx`);
+    checkFilesExist(`${appName}/src/app/page.tsx`);
     // check build works
     expect(runCLI(`build ${appName}`)).toContain(
       `Successfully ran target build for project ${appName}`
@@ -179,7 +179,7 @@ describe('Next.js Applications', () => {
       `generate @nx/next:app ${appName} --no-interactive --js --appDir=false`
     );
 
-    checkFilesExist(`apps/${appName}/pages/index.js`);
+    checkFilesExist(`apps/${appName}/src/pages/index.js`);
 
     await checkApp(appName, {
       checkUnitTest: true,
@@ -195,7 +195,7 @@ describe('Next.js Applications', () => {
       `generate @nx/next:lib ${libName} --no-interactive --style=none --js`
     );
 
-    const mainPath = `apps/${appName}/pages/index.js`;
+    const mainPath = `apps/${appName}/src/pages/index.js`;
     updateFile(
       mainPath,
       `import '@${proj}/${libName}';\n` + readFile(mainPath)

diff --git a/e2e/next-extensions/src/next-component-tests.test.ts b/e2e/next-extensions/src/next-component-tests.test.ts
@@ -152,7 +152,7 @@ function addTailwindToApp(appName: string) {
   );
   updateFile(`apps/${appName}/cypress/support/component.ts`, (content) => {
     return `${content}
-import '../../pages/styles.css'`;
+import '../../src/pages/styles.css'`;
   });
 
   updateFile(`apps/${appName}/components/button.cy.tsx`, (content) => {

diff --git a/e2e/next-extensions/src/next-styles.test.ts b/e2e/next-extensions/src/next-styles.test.ts
@@ -22,7 +22,7 @@ describe('Next.js Styles', () => {
     const lessApp = uniq('app');
 
     runCLI(
-      `generate @nx/next:app ${lessApp} --no-interactive --style=less --appDir=false`
+      `generate @nx/next:app ${lessApp} --no-interactive --style=less --appDir=false --src=false`
     );
 
     await checkApp(lessApp, {

diff --git a/e2e/utils/create-project-utils.ts b/e2e/utils/create-project-utils.ts
@@ -229,6 +229,7 @@ export function runCreateWorkspace(
     standaloneApi,
     docker,
     nextAppDir,
+    nextSrcDir,
     e2eTestRunner,
     ssr,
     framework,
@@ -247,6 +248,7 @@ export function runCreateWorkspace(
     routing?: boolean;
     docker?: boolean;
     nextAppDir?: boolean;
+    nextSrcDir?: boolean;
     e2eTestRunner?: 'cypress' | 'playwright' | 'jest' | 'detox' | 'none';
     ssr?: boolean;
     framework?: string;
@@ -275,6 +277,10 @@ export function runCreateWorkspace(
     command += ` --nextAppDir=${nextAppDir}`;
   }
 
+  if (nextSrcDir !== undefined) {
+    command += ` --nextSrcDir=${nextSrcDir}`;
+  }
+
   if (docker !== undefined) {
     command += ` --docker=${docker}`;
   }

diff --git a/e2e/workspace-create/src/create-nx-workspace.test.ts b/e2e/workspace-create/src/create-nx-workspace.test.ts
@@ -227,7 +227,7 @@ describe('create-nx-workspace', () => {
       e2eTestRunner: 'none',
     });
 
-    checkFilesExist(`apps/${appName}/pages/index.tsx`);
+    checkFilesExist(`apps/${appName}/src/pages/index.tsx`);
 
     expectNoAngularDevkit();
     expectCodeIsFormatted();
@@ -240,12 +240,13 @@ describe('create-nx-workspace', () => {
       preset: 'nextjs-standalone',
       style: 'css',
       nextAppDir: true,
+      nextSrcDir: true,
       appName,
       packageManager,
       e2eTestRunner: 'none',
     });
 
-    checkFilesExist('app/page.tsx');
+    checkFilesExist('src/app/page.tsx');
 
     expectNoAngularDevkit();
     expectCodeIsFormatted();
@@ -258,12 +259,13 @@ describe('create-nx-workspace', () => {
       preset: 'nextjs-standalone',
       style: 'css',
       nextAppDir: false,
+      nextSrcDir: true,
       appName,
       packageManager,
       e2eTestRunner: 'none',
     });
 
-    checkFilesExist('pages/index.tsx');
+    checkFilesExist('src/pages/index.tsx');
 
     expectNoAngularDevkit();
     expectCodeIsFormatted();

diff --git a/packages/create-nx-workspace/bin/create-nx-workspace.ts b/packages/create-nx-workspace/bin/create-nx-workspace.ts
@@ -49,6 +49,7 @@ interface ReactArguments extends BaseArguments {
   style: string;
   bundler: 'webpack' | 'vite' | 'rspack';
   nextAppDir: boolean;
+  nextSrcDir: boolean;
   e2eTestRunner: 'none' | 'cypress' | 'playwright';
 }
 
@@ -164,6 +165,10 @@ export const commandsObject: yargs.Argv<Arguments> = yargs
             describe: chalk.dim`Enable the App Router for Next.js`,
             type: 'boolean',
           })
+          .option('nextSrcDir', {
+            describe: chalk.dim`Generate a 'src/' directory for Next.js`,
+            type: 'boolean',
+          })
           .option('e2eTestRunner', {
             describe: chalk.dim`Test runner to use for end to end (E2E) tests.`,
             choices: ['cypress', 'playwright', 'none'],
@@ -512,6 +517,7 @@ async function determineReactOptions(
   let bundler: undefined | 'webpack' | 'vite' | 'rspack' = undefined;
   let e2eTestRunner: undefined | 'none' | 'cypress' | 'playwright' = undefined;
   let nextAppDir = false;
+  let nextSrcDir = false;
 
   if (parsedArgs.preset && parsedArgs.preset !== Preset.React) {
     preset = parsedArgs.preset;
@@ -563,6 +569,7 @@ async function determineReactOptions(
     e2eTestRunner = await determineE2eTestRunner(parsedArgs);
   } else if (preset === Preset.NextJs || preset === Preset.NextJsStandalone) {
     nextAppDir = await determineNextAppDir(parsedArgs);
+    nextSrcDir = await determineNextSrcDir(parsedArgs);
     e2eTestRunner = await determineE2eTestRunner(parsedArgs);
   }
 
@@ -614,7 +621,15 @@ async function determineReactOptions(
     style = reply.style;
   }
 
-  return { preset, style, appName, bundler, nextAppDir, e2eTestRunner };
+  return {
+    preset,
+    style,
+    appName,
+    bundler,
+    nextAppDir,
+    nextSrcDir,
+    e2eTestRunner,
+  };
 }
 
 async function determineVueOptions(
@@ -1066,6 +1081,29 @@ async function determineNextAppDir(
   return reply.nextAppDir === 'Yes';
 }
 
+async function determineNextSrcDir(
+  parsedArgs: yargs.Arguments<ReactArguments>
+): Promise<boolean> {
+  if (parsedArgs.nextSrcDir !== undefined) return parsedArgs.nextSrcDir;
+  const reply = await enquirer.prompt<{ nextSrcDir: 'Yes' | 'No' }>([
+    {
+      name: 'nextSrcDir',
+      message: 'Would you like to use the src/ directory?',
+      type: 'autocomplete',
+      choices: [
+        {
+          name: 'Yes',
+        },
+        {
+          name: 'No',
+        },
+      ],
+      initial: 'Yes' as any,
+    },
+  ]);
+  return reply.nextSrcDir === 'Yes';
+}
+
 async function determineVueFramework(
   parsedArgs: yargs.Arguments<VueArguments>
 ): Promise<'none' | 'nuxt'> {