@nx/nuxt 18.1.0-beta.1 → 18.1.0-beta.3

package/index.d.ts

@@ -2,3 +2,4 @@ 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 { storybookConfigurationGenerator } from './src/generators/storybook-configuration/configuration';

package/index.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.nuxtInitGenerator = exports.applicationGenerator = void 0;
+exports.storybookConfigurationGenerator = exports.nuxtInitGenerator = exports.applicationGenerator = void 0;
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./src/utils/versions"), exports);
 var application_1 = require("./src/generators/application/application");
 Object.defineProperty(exports, "applicationGenerator", { enumerable: true, get: function () { return application_1.applicationGenerator; } });
 var init_1 = require("./src/generators/init/init");
 Object.defineProperty(exports, "nuxtInitGenerator", { enumerable: true, get: function () { return init_1.nuxtInitGenerator; } });
+var configuration_1 = require("./src/generators/storybook-configuration/configuration");
+Object.defineProperty(exports, "storybookConfigurationGenerator", { enumerable: true, get: function () { return configuration_1.storybookConfigurationGenerator; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/nuxt",
-  "version": "18.1.0-beta.1",
+  "version": "18.1.0-beta.3",
   "private": false,
   "description": "The Nuxt plugin for Nx contains executors and generators for managing Nuxt applications and libraries within an Nx workspace. It provides:\n\n\n- Integration with libraries such as Vitest, Cypress, and Storybook.\n\n- Generators for applications, libraries, and more.\n\n- Library build support for publishing packages to npm or other registries.\n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -30,10 +30,11 @@
   "dependencies": {
     "tslib": "^2.3.0",
     "@nuxt/kit": "^3.10.0",
-    "@nx/devkit": "18.1.0-beta.1",
-    "@nx/js": "18.1.0-beta.1",
-    "@nx/eslint": "18.1.0-beta.1",
-    "@nx/vue": "18.1.0-beta.1"
+    "@nx/devkit": "18.1.0-beta.3",
+    "@nx/js": "18.1.0-beta.3",
+    "@nx/eslint": "18.1.0-beta.3",
+    "@nx/vue": "18.1.0-beta.3",
+    "@nx/vite": "18.1.0-beta.3"
   },
   "peerDependencies": {},
   "publishConfig": {

package/src/generators/application/application.js

@@ -44,8 +44,6 @@ async function applicationGenerator(tree, schema) {
         tmpl: '',
         style: options.style,
         projectRoot: options.appProjectRoot,
-        buildDirectory: (0, devkit_1.joinPathFragments)(`dist/${options.appProjectRoot}/.nuxt`),
-        nitroOutputDir: (0, devkit_1.joinPathFragments)(`dist/${options.appProjectRoot}/.output`),
         hasVitest: options.unitTestRunner === 'vitest',
     });
     if (options.style === 'none') {

package/src/generators/application/files/nuxt.config.ts__tmpl__

@@ -5,7 +5,6 @@ import { defineNuxtConfig } from 'nuxt/config';
 export default defineNuxtConfig({
   workspaceDir: '<%= offsetFromRoot %>',
   srcDir: 'src',
-  buildDir: '<%= offsetFromRoot %><%= buildDirectory %>',
   devtools: { enabled: true },
   devServer: {
     host: 'localhost',
@@ -18,7 +17,7 @@ export default defineNuxtConfig({
     },
   },
   imports: {
-    autoImport: false,
+    autoImport: true,
   },
   <% if (style !== 'none') { %>
   css: ['~/assets/css/styles.<%= style %>'],
@@ -28,9 +27,4 @@ export default defineNuxtConfig({
       nxViteTsPaths()
     ],
   },
-  nitro: {
-    output: {
-      dir: '<%= offsetFromRoot %><%= nitroOutputDir %>',
-    },
-  },
 });

package/src/generators/application/lib/add-e2e.js

@@ -21,6 +21,10 @@ async function addE2e(host, options) {
             bundler: 'vite',
             skipFormat: true,
             devServerTarget: `${options.projectName}:serve`,
+            webServerCommands: {
+                default: `${(0, devkit_1.getPackageManagerCommand)().exec} nx serve ${options.projectName}`,
+            },
+            ciWebServerCommand: `nx run ${options.projectName}:serve-static`,
             baseUrl: 'http://localhost:4200',
             jsx: true,
             addPlugin: true,

package/src/generators/init/lib/utils.js

@@ -7,6 +7,7 @@ function updateDependencies(host, schema) {
     return (0, devkit_1.addDependenciesToPackageJson)(host, {}, {
         '@nx/nuxt': versions_1.nxVersion,
         nuxt: versions_1.nuxtVersion,
+        '@nx/vite': versions_1.nxVersion,
     }, undefined, schema.keepExistingVersions);
 }
 exports.updateDependencies = updateDependencies;
@@ -43,6 +44,7 @@ function addPlugin(tree) {
             options: {
                 buildTargetName: 'build',
                 serveTargetName: 'serve',
+                serveStaticTargetName: 'serve-static',
             },
         });
     }

package/src/generators/storybook-configuration/configuration.d.ts

@@ -1,4 +1,4 @@
 import { Tree } from '@nx/devkit';
 import { Schema } from './schema';
-export declare function storybookConfigurationGenerator(host: Tree, options: Schema): Promise<import("@nx/devkit").GeneratorCallback>;
+export declare function storybookConfigurationGenerator(tree: Tree, options: Schema): Promise<import("@nx/devkit").GeneratorCallback>;
 export default storybookConfigurationGenerator;

package/src/generators/storybook-configuration/configuration.js

@@ -7,22 +7,21 @@ const vue_1 = require("@nx/vue");
  * This generator is basically the Vue one, but for Nuxt we
  * are just adding the styles in `.storybook/preview.ts`
  */
-async function storybookConfigurationGenerator(host, options) {
-    const storybookConfigurationGenerator = await (0, vue_1.storybookConfigurationGenerator)(host, {
+async function storybookConfigurationGenerator(tree, options) {
+    const storybookConfigurationGenerator = await (0, vue_1.storybookConfigurationGenerator)(tree, {
         ...options,
         addPlugin: true,
     });
-    const projectConfiguration = (0, devkit_1.readProjectConfiguration)(host, options.project);
-    const storybookConfigFolder = projectConfiguration.targets?.storybook?.options?.configDir;
-    host.write(`${storybookConfigFolder}/preview.${options.tsConfiguration ? 'ts' : 'js'}`, `import '../src/assets/css/styles.css';`);
-    (0, devkit_1.updateJson)(host, `${projectConfiguration.root}/tsconfig.storybook.json`, (json) => {
+    const { root } = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    tree.write((0, devkit_1.joinPathFragments)(root, '.storybook', 'preview.' + options.tsConfiguration ? 'ts' : 'js'), `import '../src/assets/css/styles.css';`);
+    (0, devkit_1.updateJson)(tree, `${root}/tsconfig.storybook.json`, (json) => {
         json.compilerOptions = {
             ...json.compilerOptions,
             composite: true,
         };
         return json;
     });
-    await (0, devkit_1.formatFiles)(host);
+    await (0, devkit_1.formatFiles)(tree);
     return (0, devkit_1.runTasksInSerial)(storybookConfigurationGenerator);
 }
 exports.storybookConfigurationGenerator = storybookConfigurationGenerator;

package/src/migrations/update-18-1-0/add-include-tsconfig.d.ts

@@ -0,0 +1,2 @@
+import { Tree } from '@nx/devkit';
+export default function (tree: Tree): Promise<void>;

package/src/migrations/update-18-1-0/add-include-tsconfig.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const devkit_1 = require("@nx/devkit");
+const executor_utils_1 = require("../../utils/executor-utils");
+const path_1 = require("path");
+async function default_1(tree) {
+    const projects = (0, devkit_1.getProjects)(tree);
+    for (const project of projects.values()) {
+        const nuxtConfigPath = findNuxtConfig(tree, project.root);
+        if (!nuxtConfigPath) {
+            continue;
+        }
+        const nuxtConfig = await getInfoFromNuxtConfig(nuxtConfigPath, project.root);
+        const buildDir = nuxtConfig.buildDir ?? '.nuxt';
+        const tsConfigPath = (0, devkit_1.joinPathFragments)(project.root, 'tsconfig.json');
+        if (tree.exists(tsConfigPath)) {
+            (0, devkit_1.updateJson)(tree, tsConfigPath, (json) => {
+                if (!json.include) {
+                    json.include = [];
+                }
+                if (!json.include.includes(buildDir + '/nuxt.d.ts')) {
+                    json.include.push(buildDir + '/nuxt.d.ts');
+                }
+                return json;
+            });
+        }
+    }
+    await (0, devkit_1.formatFiles)(tree);
+}
+exports.default = default_1;
+function findNuxtConfig(tree, projectRoot) {
+    const allowsExt = ['js', 'mjs', 'ts', 'cjs', 'mts', 'cts'];
+    for (const ext of allowsExt) {
+        if (tree.exists((0, devkit_1.joinPathFragments)(projectRoot, `nuxt.config.${ext}`))) {
+            return (0, devkit_1.joinPathFragments)(projectRoot, `nuxt.config.${ext}`);
+        }
+    }
+}
+async function getInfoFromNuxtConfig(configFilePath, projectRoot) {
+    const { loadNuxtConfig } = await (0, executor_utils_1.loadNuxtKitDynamicImport)();
+    const config = await loadNuxtConfig({
+        cwd: (0, devkit_1.joinPathFragments)(devkit_1.workspaceRoot, projectRoot),
+        configFile: (0, path_1.basename)(configFilePath),
+    });
+    return {
+        buildDir: config?.buildDir,
+    };
+}

package/src/plugins/plugin.d.ts

@@ -3,5 +3,7 @@ export declare const createDependencies: CreateDependencies;
 export interface NuxtPluginOptions {
     buildTargetName?: string;
     serveTargetName?: string;
+    serveStaticTargetName?: string;
+    buildStaticTargetName?: string;
 }
 export declare const createNodes: CreateNodes<NuxtPluginOptions>;

package/src/plugins/plugin.js

@@ -58,6 +58,8 @@ async function buildNuxtTargets(configFilePath, projectRoot, options, context) {
     const targets = {};
     targets[options.buildTargetName] = buildTarget(options.buildTargetName, namedInputs, buildOutputs, projectRoot);
     targets[options.serveTargetName] = serveTarget(projectRoot);
+    targets[options.serveStaticTargetName] = serveStaticTarget(options);
+    targets[options.buildStaticTargetName] = buildStaticTarget(options.buildStaticTargetName, namedInputs, buildOutputs, projectRoot);
     return targets;
 }
 function buildTarget(buildTargetName, namedInputs, buildOutputs, projectRoot) {
@@ -86,6 +88,35 @@ function serveTarget(projectRoot) {
     };
     return targetConfig;
 }
+function serveStaticTarget(options) {
+    const targetConfig = {
+        executor: '@nx/web:file-server',
+        options: {
+            buildTarget: `${options.buildStaticTargetName}`,
+            staticFilePath: '{projectRoot}/dist',
+            port: 4200,
+        },
+    };
+    return targetConfig;
+}
+function buildStaticTarget(buildStaticTargetName, namedInputs, buildOutputs, projectRoot) {
+    const targetConfig = {
+        command: `nuxt build --prerender`,
+        options: { cwd: projectRoot },
+        cache: true,
+        dependsOn: [`^${buildStaticTargetName}`],
+        inputs: [
+            ...('production' in namedInputs
+                ? ['production', '^production']
+                : ['default', '^default']),
+            {
+                externalDependencies: ['nuxt'],
+            },
+        ],
+        outputs: buildOutputs,
+    };
+    return targetConfig;
+}
 async function getInfoFromNuxtConfig(configFilePath, context, projectRoot) {
     const { loadNuxtConfig } = await (0, executor_utils_1.loadNuxtKitDynamicImport)();
     const config = await loadNuxtConfig({
@@ -99,12 +130,11 @@ async function getInfoFromNuxtConfig(configFilePath, context, projectRoot) {
 function getOutputs(nuxtConfig, projectRoot) {
     let nuxtBuildDir = nuxtConfig?.buildDir;
     if (nuxtConfig?.buildDir && (0, path_1.basename)(nuxtConfig?.buildDir) === '.nuxt') {
-        // buildDir will most probably be `../dist/my-app/.nuxt`
-        // we want the "general" outputPath to be `../dist/my-app`
+        // if buildDir exists, it will be `something/something/.nuxt`
+        // we want the "general" outputPath to be `something/something`
         nuxtBuildDir = nuxtConfig.buildDir.replace((0, path_1.basename)(nuxtConfig.buildDir), '');
     }
-    const buildOutputPath = normalizeOutputPath(nuxtBuildDir, projectRoot) ??
-        '{workspaceRoot}/dist/{projectRoot}';
+    const buildOutputPath = normalizeOutputPath(nuxtBuildDir, projectRoot);
     return {
         buildOutputs: [buildOutputPath],
     };
@@ -112,10 +142,10 @@ function getOutputs(nuxtConfig, projectRoot) {
 function normalizeOutputPath(outputPath, projectRoot) {
     if (!outputPath) {
         if (projectRoot === '.') {
-            return `{projectRoot}/dist`;
+            return `{projectRoot}`;
         }
         else {
-            return `{workspaceRoot}/dist/{projectRoot}`;
+            return `{workspaceRoot}/{projectRoot}`;
         }
     }
     else {
@@ -136,5 +166,7 @@ function normalizeOptions(options) {
     options ??= {};
     options.buildTargetName ??= 'build';
     options.serveTargetName ??= 'serve';
+    options.serveStaticTargetName ??= 'serve-static';
+    options.buildStaticTargetName ??= 'build-static';
     return options;
 }

package/src/utils/add-linting.js

@@ -4,8 +4,8 @@ exports.addLinting = void 0;
 const eslint_1 = require("@nx/eslint");
 const path_1 = require("nx/src/utils/path");
 const devkit_1 = require("@nx/devkit");
-const lint_1 = require("./lint");
 const vue_1 = require("@nx/vue");
+const versions_1 = require("./versions");
 async function addLinting(host, options) {
     const tasks = [];
     if (options.linter === 'eslint') {
@@ -19,10 +19,22 @@ async function addLinting(host, options) {
             addPlugin: true,
         });
         tasks.push(lintTask);
-        (0, devkit_1.updateJson)(host, (0, path_1.joinPathFragments)(options.projectRoot, '.eslintrc.json'), lint_1.extendNuxtEslintJson);
         (0, vue_1.editEslintConfigFiles)(host, options.projectRoot, options.rootProject);
-        const installTask = (0, devkit_1.addDependenciesToPackageJson)(host, lint_1.extraEslintDependencies.dependencies, {
-            ...lint_1.extraEslintDependencies.devDependencies,
+        (0, devkit_1.updateJson)(host, (0, path_1.joinPathFragments)(options.projectRoot, '.eslintrc.json'), (json) => {
+            const { extends: pluginExtends, ignorePatterns: pluginIgnorePatters, ...config } = json;
+            return {
+                extends: ['@nuxt/eslint-config', ...(pluginExtends || [])],
+                ignorePatterns: [
+                    ...(pluginIgnorePatters || []),
+                    '.nuxt/**',
+                    '.output/**',
+                    'node_modules',
+                ],
+                ...config,
+            };
+        });
+        const installTask = (0, devkit_1.addDependenciesToPackageJson)(host, {}, {
+            '@nuxt/eslint-config': versions_1.nuxtEslintConfigVersion,
         });
         tasks.push(installTask);
     }

package/src/utils/create-ts-config.js

@@ -8,7 +8,7 @@ function createTsConfig(host, options, relativePathToRootTsConfig) {
     const json = {
         compilerOptions: {},
         files: [],
-        include: [],
+        include: ['.nuxt/nuxt.d.ts'],
         references: [
             {
                 path: './tsconfig.app.json',

package/src/utils/lint.d.ts

@@ -1,7 +0,0 @@
-export declare const extraEslintDependencies: {
-    dependencies: {};
-    devDependencies: {
-        '@nuxt/eslint-config': string;
-    };
-};
-export declare const extendNuxtEslintJson: (json: any) => any;

package/src/utils/lint.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.extendNuxtEslintJson = exports.extraEslintDependencies = void 0;
-const versions_1 = require("./versions");
-exports.extraEslintDependencies = {
-    dependencies: {},
-    devDependencies: {
-        '@nuxt/eslint-config': versions_1.nuxtEslintConfigVersion,
-    },
-};
-const extendNuxtEslintJson = (json) => {
-    const { extends: pluginExtends, ...config } = json;
-    return {
-        extends: ['@nuxt/eslint-config', ...(pluginExtends || [])],
-        ignorePatterns: ['.nuxt', 'node_modules', '.output'],
-        ...config,
-    };
-};
-exports.extendNuxtEslintJson = extendNuxtEslintJson;