feat(nuxt): added nuxt to create-nx-workspace

nrwl · Nov 6, 2023 · 951852f · 951852f
1 parent 33ca596
commit 951852f
Show file tree

Hide file tree

Showing 21 changed files with 340 additions and 28,050 deletions.
diff --git a/e2e/nuxt/src/nuxt.test.ts b/e2e/nuxt/src/nuxt.test.ts
@@ -32,7 +32,7 @@ describe('Nuxt Plugin', () => {
 
   it('should build storybook for app', () => {
     runCLI(
-      `generate @nx/vue:storybook-configuration ${app} --generateStories --no-interactive`
+      `generate @nx/nuxt:storybook-configuration ${app} --generateStories --no-interactive`
     );
     runCLI(`run ${app}:build-storybook --verbose`);
     checkFilesExist(`dist/storybook/${app}/index.html`);

diff --git a/package.json b/package.json
@@ -64,8 +64,6 @@
     "@ngrx/router-store": "~16.0.0",
     "@ngrx/store": "~16.0.0",
     "@nguniversal/builders": "~16.2.0",
-    "@nuxt/kit": "^3.7.4",
-    "@nuxt/schema": "^3.7.4",
     "@nx/angular": "17.0.0-rc.2",
     "@nx/cypress": "17.0.0-rc.2",
     "@nx/devkit": "17.0.0-rc.2",
@@ -158,7 +156,6 @@
     "cytoscape-popper": "^2.0.0",
     "cz-git": "^1.4.0",
     "czg": "^1.4.0",
-    "defu": "^6.1.2",
     "detect-port": "^1.5.1",
     "dotenv": "~16.3.1",
     "dotenv-expand": "^10.0.0",

diff --git a/packages/create-nx-workspace/bin/create-nx-workspace.ts b/packages/create-nx-workspace/bin/create-nx-workspace.ts
@@ -66,7 +66,14 @@ interface VueArguments extends BaseArguments {
   stack: 'vue';
   workspaceType: 'standalone' | 'integrated';
   appName: string;
-  // framework: 'none' | 'nuxt';
+  style: string;
+  e2eTestRunner: 'none' | 'cypress' | 'playwright';
+}
+
+interface NuxtArguments extends BaseArguments {
+  stack: 'nuxt';
+  workspaceType: 'standalone' | 'integrated';
+  appName: string;
   style: string;
   e2eTestRunner: 'none' | 'cypress' | 'playwright';
 }
@@ -88,6 +95,7 @@ type Arguments =
   | ReactArguments
   | AngularArguments
   | VueArguments
+  | NuxtArguments
   | NodeArguments
   | UnknownStackArguments;
 
@@ -112,6 +120,8 @@ export const commandsObject: yargs.Argv<Arguments> = yargs
             describe: chalk.dim`Customizes the initial content of your workspace. Default presets include: [${Object.values(
               Preset
             )
+              // TODO(katerina): Remove this option when @nx/nuxt is released.
+              .filter((p) => p !== Preset.NuxtStandalone && p !== Preset.Nuxt)
               .map((p) => `"${p}"`)
               .join(
                 ', '
@@ -357,7 +367,7 @@ async function determineFolder(
 
 async function determineStack(
   parsedArgs: yargs.Arguments<Arguments>
-): Promise<'none' | 'react' | 'angular' | 'vue' | 'node' | 'unknown'> {
+): Promise<'none' | 'react' | 'angular' | 'vue' | 'node' | 'nuxt' | 'unknown'> {
   if (parsedArgs.preset) {
     switch (parsedArgs.preset) {
       case Preset.Angular:
@@ -373,6 +383,9 @@ async function determineStack(
       case Preset.VueStandalone:
       case Preset.VueMonorepo:
         return 'vue';
+      case Preset.NuxtStandalone:
+      case Preset.Nuxt:
+        return 'nuxt';
       case Preset.Nest:
       case Preset.NodeStandalone:
       case Preset.Express:
@@ -437,6 +450,8 @@ async function determinePresetOptions(
       return determineAngularOptions(parsedArgs);
     case 'vue':
       return determineVueOptions(parsedArgs);
+    case 'nuxt':
+      return determineNuxtOptions(parsedArgs);
     case 'node':
       return determineNodeOptions(parsedArgs);
     default:
@@ -670,6 +685,69 @@ async function determineVueOptions(
   return { preset, style, appName, e2eTestRunner };
 }
 
+async function determineNuxtOptions(
+  parsedArgs: yargs.Arguments<NuxtArguments>
+): Promise<Partial<Arguments>> {
+  let preset: Preset;
+  let style: undefined | string = undefined;
+  let appName: string;
+  let e2eTestRunner: undefined | 'none' | 'cypress' | 'playwright' = undefined;
+
+  if (parsedArgs.preset) {
+    preset = parsedArgs.preset;
+  } else {
+    const workspaceType = await determineStandaloneOrMonorepo();
+
+    if (workspaceType === 'standalone') {
+      preset = Preset.NuxtStandalone;
+    } else {
+      preset = Preset.Nuxt;
+    }
+  }
+
+  if (preset === Preset.NuxtStandalone) {
+    appName = parsedArgs.appName ?? parsedArgs.name;
+  } else {
+    appName = await determineAppName(parsedArgs);
+  }
+
+  e2eTestRunner = await determineE2eTestRunner(parsedArgs);
+
+  if (parsedArgs.style) {
+    style = parsedArgs.style;
+  } else {
+    const reply = await enquirer.prompt<{ style: string }>([
+      {
+        name: 'style',
+        message: `Default stylesheet format`,
+        initial: 'css' as any,
+        type: 'autocomplete',
+        choices: [
+          {
+            name: 'css',
+            message: 'CSS',
+          },
+          {
+            name: 'scss',
+            message: 'SASS(.scss)       [ http://sass-lang.com   ]',
+          },
+          {
+            name: 'less',
+            message: 'LESS              [ http://lesscss.org     ]',
+          },
+          {
+            name: 'none',
+            message: 'None',
+          },
+        ],
+      },
+    ]);
+    style = reply.style;
+  }
+
+  return { preset, style, appName, e2eTestRunner };
+}
+
 async function determineAngularOptions(
   parsedArgs: yargs.Arguments<AngularArguments>
 ): Promise<Partial<Arguments>> {
@@ -929,7 +1007,11 @@ async function determineStandaloneOrMonorepo(): Promise<
 
 async function determineAppName(
   parsedArgs: yargs.Arguments<
-    ReactArguments | AngularArguments | NodeArguments | VueArguments
+    | ReactArguments
+    | AngularArguments
+    | NodeArguments
+    | VueArguments
+    | NuxtArguments
   >
 ): Promise<string> {
   if (parsedArgs.appName) return parsedArgs.appName;

diff --git a/packages/create-nx-workspace/src/utils/preset/preset-options.ts b/packages/create-nx-workspace/src/utils/preset/preset-options.ts
@@ -23,6 +23,10 @@ export const presetOptions: { name: Preset; message: string }[] = [
     name: Preset.VueMonorepo,
     message: 'vue               [a monorepo with a single Vue application]',
   },
+  {
+    name: Preset.Nuxt,
+    message: 'nuxt              [a monorepo with a single Nuxt application]',
+  },
   {
     name: Preset.NextJs,
     message: 'next.js           [a monorepo with a single Next.js application]',

diff --git a/packages/create-nx-workspace/src/utils/preset/preset.ts b/packages/create-nx-workspace/src/utils/preset/preset.ts
@@ -11,6 +11,8 @@ export enum Preset {
   ReactStandalone = 'react-standalone',
   VueMonorepo = 'vue-monorepo',
   VueStandalone = 'vue-standalone',
+  Nuxt = 'nuxt',
+  NuxtStandalone = 'nuxt-standalone',
   NextJs = 'next',
   NextJsStandalone = 'nextjs-standalone',
   ReactNative = 'react-native',

diff --git a/packages/nuxt/.eslintrc.json b/packages/nuxt/.eslintrc.json
@@ -29,7 +29,12 @@
           "error",
           {
             "buildTargets": ["build-base"],
-            "ignoredDependencies": ["nx", "typescript"]
+            "ignoredDependencies": [
+              "nx",
+              "typescript",
+              "@nx/cypress",
+              "@nx/playwright"
+            ]
           }
         ]
       }

diff --git a/packages/nuxt/index.ts b/packages/nuxt/index.ts
@@ -2,4 +2,3 @@ export * from './src/utils/versions';
 export { applicationGenerator } from './src/generators/application/application';
 export { type InitSchema } from './src/generators/init/schema';
 export { nuxtInitGenerator } from './src/generators/init/init';
-export * from './plugins/with-nuxt';
diff --git a/packages/nuxt/package.json b/packages/nuxt/package.json
@@ -28,17 +28,11 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "defu": "^6.1.2",
-    "fs-extra": "^11.1.0",
     "tslib": "^2.3.0",
     "@nx/devkit": "file:../devkit",
     "@nx/js": "file:../js",
     "@nx/eslint": "file:../eslint",
-    "@nx/vue": "file:../vue",
-    "@nx/cypress": "file:../cypress",
-    "@nx/playwright": "file:../playwright",
-    "@nuxt/kit": "^3.7.4",
-    "@nuxt/schema": "^3.7.4"
+    "@nx/vue": "file:../vue"
   },
   "publishConfig": {
     "access": "public"

diff --git a/packages/nuxt/plugins/with-nuxt.ts b/packages/nuxt/plugins/with-nuxt.ts
diff --git a/packages/nuxt/src/generators/application/__snapshots__/application.spec.ts.snap b/packages/nuxt/src/generators/application/__snapshots__/application.spec.ts.snap
@@ -27,14 +27,16 @@ exports[`app generated files content - as-provided should configure eslint corre
 `;
 
 exports[`app generated files content - as-provided should configure nuxt correctly 1`] = `
-"import { NxNuxtModule } from '@nx/nuxt';
+"import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  modules: [NxNuxtModule],
   srcDir: 'src',
   devtools: { enabled: true },
   css: ['~/assets/css/styles.css'],
+  vite: {
+    plugins: [nxViteTsPaths()],
+  },
 });
 "
 `;

diff --git a/packages/nuxt/src/generators/application/files/nuxt.config.ts__tmpl__ b/packages/nuxt/src/generators/application/files/nuxt.config.ts__tmpl__
@@ -1,9 +1,13 @@
-import { NxNuxtModule } from '@nx/nuxt';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  modules: [NxNuxtModule],
   srcDir: 'src',
   devtools: { enabled: true },
   css: ['~/assets/css/styles.css'],
+  vite: {
+    plugins: [
+      nxViteTsPaths()
+    ],
+  }
 });