@nx/storybook 24.0.0-beta.1 → 24.0.0-beta.3

package/dist/src/generators/configuration/configuration.js

@@ -7,7 +7,6 @@ const internal_1 = require("@nx/devkit/internal");
 const semver_1 = require("semver");
 const js_1 = require("@nx/js");
 const init_1 = require("../init/init");
-const deprecation_1 = require("../../utils/deprecation");
 const assert_supported_storybook_version_1 = require("../../utils/assert-supported-storybook-version");
 const util_functions_1 = require("./lib/util-functions");
 const utilities_1 = require("../../utils/utilities");
@@ -16,7 +15,7 @@ const ensure_dependencies_1 = require("./lib/ensure-dependencies");
 const edit_root_tsconfig_1 = require("./lib/edit-root-tsconfig");
 const internal_2 = require("@nx/js/internal");
 function configurationGenerator(tree, schema) {
-    return configurationGeneratorInternal(tree, { addPlugin: false, ...schema });
+    return configurationGeneratorInternal(tree, schema);
 }
 async function configurationGeneratorInternal(tree, rawSchema) {
     (0, assert_supported_storybook_version_1.assertSupportedStorybookVersion)(tree);
@@ -24,7 +23,7 @@ async function configurationGeneratorInternal(tree, rawSchema) {
     if (storybookMajor === 8) {
         devkit_1.logger.warn(`Support for Storybook 8 is deprecated. Please upgrade to Storybook 9. See https://nx.dev/nx-api/storybook/generators/migrate-9 for more details.`);
     }
-    const schema = normalizeSchema(tree, rawSchema);
+    const schema = normalizeSchema(rawSchema);
     const tasks = [];
     const { projectType, targets, root } = (0, devkit_1.readProjectConfiguration)(tree, schema.project);
     const { compiler } = (0, utilities_1.findStorybookAndBuildTargetsAndCompiler)(targets);
@@ -54,22 +53,20 @@ async function configurationGeneratorInternal(tree, rawSchema) {
     tasks.push(jsInitTask);
     const initTask = await (0, init_1.initGenerator)(tree, {
         skipFormat: true,
-        addPlugin: schema.addPlugin,
     });
     tasks.push(initTask);
     tasks.push((0, ensure_dependencies_1.ensureDependencies)(tree, { uiFramework: schema.uiFramework }));
     (0, edit_root_tsconfig_1.editRootTsConfig)(tree);
-    const nxJson = (0, devkit_1.readNxJson)(tree);
-    const hasPlugin = nxJson.plugins?.some((p) => typeof p === 'string'
-        ? p === '@nx/storybook/plugin'
-        : p.plugin === '@nx/storybook/plugin');
     const mainDir = !!nextConfigFilePath &&
         (0, internal_2.getProjectType)(tree, root, projectType) === 'application'
         ? 'components'
         : 'src';
     const usesVite = !!viteConfigFilePath || schema.uiFramework?.endsWith('-vite');
     const usesReactNative = (0, util_functions_1.isUsingReactNative)(schema.project);
-    (0, util_functions_1.createProjectStorybookDir)(tree, schema.project, schema.uiFramework, schema.js, schema.tsConfiguration, root, projectType, (0, util_functions_1.projectIsRootProjectInStandaloneWorkspace)(root), schema.interactionTests, mainDir, !!nextConfigFilePath, compiler === 'swc', usesVite, viteConfigFilePath, hasPlugin, viteConfigFileName, usesReactNative);
+    // resolve.tsconfigPaths is native only from Vite 8; older majors ignore it.
+    const installedVite = (0, semver_1.coerce)((0, devkit_1.getDependencyVersionFromPackageJson)(tree, 'vite') ?? '');
+    const useNativeTsconfigPaths = !installedVite || (0, semver_1.major)(installedVite) >= 8;
+    (0, util_functions_1.createProjectStorybookDir)(tree, schema.project, schema.uiFramework, schema.js, schema.tsConfiguration, root, projectType, (0, util_functions_1.projectIsRootProjectInStandaloneWorkspace)(root), schema.interactionTests, mainDir, !!nextConfigFilePath, compiler === 'swc', usesVite, viteConfigFilePath, viteConfigFileName, usesReactNative, useNativeTsconfigPaths);
     if (schema.uiFramework !== '@storybook/angular') {
         (0, util_functions_1.createStorybookTsconfigFile)(tree, root, schema.uiFramework, (0, util_functions_1.projectIsRootProjectInStandaloneWorkspace)(root), mainDir);
     }
@@ -79,18 +76,11 @@ async function configurationGeneratorInternal(tree, rawSchema) {
     (0, util_functions_1.updateLintConfig)(tree, schema);
     (0, util_functions_1.addBuildStorybookToCacheableOperations)(tree);
     (0, util_functions_1.addStorybookToNamedInputs)(tree, schema);
-    if (!hasPlugin) {
-        (0, util_functions_1.addStorybookToTargetDefaults)(tree, schema);
-    }
     let devDeps = {};
-    if (!hasPlugin || schema.addExplicitTargets) {
-        (0, deprecation_1.warnStorybookExecutorGenerating)();
-        if (schema.uiFramework === '@storybook/angular') {
-            (0, util_functions_1.addAngularStorybookTarget)(tree, schema.project, schema.interactionTests);
-        }
-        else {
-            (0, util_functions_1.addStorybookTarget)(tree, schema.project, schema.uiFramework, schema.interactionTests);
-        }
+    if (schema.uiFramework === '@storybook/angular') {
+        // `@storybook/angular:*` builders are third-party and still supported, so
+        // Angular keeps an explicit target rather than relying on inference.
+        (0, util_functions_1.addAngularStorybookTarget)(tree, schema.project, schema.interactionTests);
         if (schema.configureStaticServe) {
             await (0, util_functions_1.addStaticTarget)(tree, schema);
         }
@@ -118,6 +108,9 @@ async function configurationGeneratorInternal(tree, rawSchema) {
     }
     if (usesVite && !viteConfigFilePath) {
         devDeps['tslib'] = versions_1.tsLibVersion;
+        if (!useNativeTsconfigPaths) {
+            devDeps['vite-tsconfig-paths'] = versions_1.viteTsconfigPathsVersion;
+        }
     }
     if (schema.configureStaticServe) {
         devDeps['@nx/web'] = versions_1.nxVersion;
@@ -130,28 +123,17 @@ async function configurationGeneratorInternal(tree, rawSchema) {
         });
         devDeps['core-js'] = versions_1.coreJsVersion;
     }
-    if (schema.uiFramework?.endsWith('-vite') && !viteConfigFilePath) {
-        // This means that the user has selected a Vite framework
-        // but the project does not have Vite configuration.
-        // We need to install the @nx/vite plugin in order to be able to use
-        // the nxViteTsPaths plugin to register the tsconfig paths in Vite.
-        devDeps['@nx/vite'] = versions_1.nxVersion;
-    }
     tasks.push((0, devkit_1.addDependenciesToPackageJson)(tree, {}, devDeps, undefined, true));
     if (!schema.skipFormat) {
         await (0, devkit_1.formatFiles)(tree);
     }
     return (0, devkit_1.runTasksInSerial)(...tasks);
 }
-function normalizeSchema(tree, schema) {
-    const nxJson = (0, devkit_1.readNxJson)(tree);
-    const addPlugin = process.env.NX_ADD_PLUGINS !== 'false' &&
-        nxJson.useInferencePlugins !== false;
+function normalizeSchema(schema) {
     const defaults = {
         interactionTests: true,
         js: false,
         tsConfiguration: true,
-        addPlugin,
     };
     return {
         ...defaults,

package/dist/src/generators/configuration/files/v10/project-files/.storybook/main.js__tmpl__

@@ -2,9 +2,9 @@ import { fileURLToPath } from "node:url";
 import { dirname } from "node:path";
 
 <% if (usesVite && !viteConfigFilePath) { %>
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { mergeConfig } from 'vite';
-<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %>
+<% if (!useNativeTsconfigPaths) { %>import tsconfigPaths from 'vite-tsconfig-paths';
+<% } %><% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %>
 
 const config = {
   stories: [
@@ -16,16 +16,11 @@ const config = {
   framework: {
     name: <% if(uiFramework !== '@storybook/angular') { %>getAbsolutePath(<% } %>'<%= uiFramework %>'<% if(uiFramework !== '@storybook/angular') { %>)<% } %>,
     options: {
-     <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+     <% if (usesVite && viteConfigFilePath) { %>
       builder: {
         viteConfigPath: '<%= viteConfigFileName %>',
       },
       <% } %>
-      <% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
-      builder: {
-        viteConfigPath: '<%= viteConfigFilePath %>',
-      },
-      <% } %>
     },
   },
   <% if (usesReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
@@ -48,8 +43,9 @@ const config = {
     mergeConfig(config, {
       <% if (usesReactNative) { %>define: {
         global: 'window',
-      },
+      },<% } %>
       resolve: {
+<% if (useNativeTsconfigPaths) { %>        tsconfigPaths: true,<% } %><% if (usesReactNative) { %>
         extensions: [
           '.mjs',
           '.web.tsx',
@@ -66,9 +62,9 @@ const config = {
         ],
         alias: {
           'react-native': 'react-native-web',
-        },
-      },<% } %>
-      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %>nxViteTsPaths()],
+        },<% } %>
+      },
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if (!useNativeTsconfigPaths) { %>tsconfigPaths({ loose: true })<% } %>],
     }),
   <% } %>
 };

package/dist/src/generators/configuration/files/v10/project-files-ts/.storybook/main.ts__tmpl__

@@ -4,9 +4,9 @@ import { dirname } from "node:path";
 
 <% } %>import type { StorybookConfig } from '<%= uiFramework %>';
 <% if (usesVite && !viteConfigFilePath) { %>
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { mergeConfig } from 'vite';
-<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %><% if (uiFramework === '@storybook/react-vite' && !viteConfigFilePath) { %>import react from '@vitejs/plugin-react'<% } %>
+<% if (!useNativeTsconfigPaths) { %>import tsconfigPaths from 'vite-tsconfig-paths';
+<% } %><% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %><% if (uiFramework === '@storybook/react-vite' && !viteConfigFilePath) { %>import react from '@vitejs/plugin-react'<% } %>
 
 const config: StorybookConfig = {
   stories: [
@@ -18,14 +18,10 @@ const config: StorybookConfig = {
   framework: {
     name: <% if(uiFramework !== '@storybook/angular') { %>getAbsolutePath(<% } %>'<%= uiFramework %>'<% if(uiFramework !== '@storybook/angular') { %>)<% } %>,
     options: {
-      <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+      <% if (usesVite && viteConfigFilePath) { %>
       builder: {
         viteConfigPath: '<%= viteConfigFileName %>',
       },
-      <% } %><% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
-      builder: {
-        viteConfigPath: '<%= viteConfigFilePath %>',
-      },
       <% } %>
     },
   },
@@ -49,8 +45,9 @@ const config: StorybookConfig = {
     mergeConfig(config, {
       <% if (usesReactNative) { %>define: {
         global: 'window',
-      },
+      },<% } %>
       resolve: {
+<% if (useNativeTsconfigPaths) { %>        tsconfigPaths: true,<% } %><% if (usesReactNative) { %>
         extensions: [
           '.mjs',
           '.web.tsx',
@@ -67,9 +64,9 @@ const config: StorybookConfig = {
         ],
         alias: {
           'react-native': 'react-native-web',
-        },
-      },<% } %>
-      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if(uiFramework === '@storybook/react-vite') { %>react(), <% } %>nxViteTsPaths()],
+        },<% } %>
+      },
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if(uiFramework === '@storybook/react-vite') { %>react(), <% } %><% if (!useNativeTsconfigPaths) { %>tsconfigPaths({ loose: true })<% } %>],
     }),
   <% } %>
 };

package/dist/src/generators/configuration/files/v9/project-files/.storybook/main.js__tmpl__

@@ -1,7 +1,7 @@
 <% if (usesVite && !viteConfigFilePath) { %>
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { mergeConfig } from 'vite';
-<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %>
+<% if (!useNativeTsconfigPaths) { %>import tsconfigPaths from 'vite-tsconfig-paths';
+<% } %><% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %>
 
 const config = {
   stories: [
@@ -13,16 +13,11 @@ const config = {
   framework: {
     name: '<%= uiFramework %>',
     options: {
-     <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+     <% if (usesVite && viteConfigFilePath) { %>
       builder: {
         viteConfigPath: '<%= viteConfigFileName %>',
       },
       <% } %>
-      <% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
-      builder: {
-        viteConfigPath: '<%= viteConfigFilePath %>',
-      },
-      <% } %>
     },
   },
   <% if (usesReactNative && uiFramework === '@storybook/react-webpack5') { %>webpackFinal: async (config) => {
@@ -45,8 +40,9 @@ const config = {
     mergeConfig(config, {
       <% if (usesReactNative) { %>define: {
         global: 'window',
-      },
+      },<% } %>
       resolve: {
+<% if (useNativeTsconfigPaths) { %>        tsconfigPaths: true,<% } %><% if (usesReactNative) { %>
         extensions: [
           '.mjs',
           '.web.tsx',
@@ -63,9 +59,9 @@ const config = {
         ],
         alias: {
           'react-native': 'react-native-web',
-        },
-      },<% } %>
-      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %>nxViteTsPaths()],
+        },<% } %>
+      },
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if (!useNativeTsconfigPaths) { %>tsconfigPaths({ loose: true })<% } %>],
     }),
   <% } %>
 };

package/dist/src/generators/configuration/files/v9/project-files-ts/.storybook/main.ts__tmpl__

@@ -1,8 +1,8 @@
 import type { StorybookConfig } from '<%= uiFramework %>';
 <% if (usesVite && !viteConfigFilePath) { %>
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { mergeConfig } from 'vite';
-<% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %><% if (uiFramework === '@storybook/react-vite' && !viteConfigFilePath) { %>import react from '@vitejs/plugin-react'<% } %>
+<% if (!useNativeTsconfigPaths) { %>import tsconfigPaths from 'vite-tsconfig-paths';
+<% } %><% } %><% if (uiFramework === '@storybook/vue3-vite' && !viteConfigFilePath) { %>import vue from '@vitejs/plugin-vue'<% } %><% if (uiFramework === '@storybook/react-vite' && !viteConfigFilePath) { %>import react from '@vitejs/plugin-react'<% } %>
 
 const config: StorybookConfig = {
   stories: [
@@ -14,14 +14,10 @@ const config: StorybookConfig = {
   framework: {
     name: '<%= uiFramework %>',
     options: {
-      <% if (usesVite && viteConfigFilePath && hasPlugin) { %>
+      <% if (usesVite && viteConfigFilePath) { %>
       builder: {
         viteConfigPath: '<%= viteConfigFileName %>',
       },
-      <% } %><% if (usesVite && viteConfigFilePath && !hasPlugin) { %>
-      builder: {
-        viteConfigPath: '<%= viteConfigFilePath %>',
-      },
       <% } %>
     },
   },
@@ -45,8 +41,9 @@ const config: StorybookConfig = {
     mergeConfig(config, {
       <% if (usesReactNative) { %>define: {
         global: 'window',
-      },
+      },<% } %>
       resolve: {
+<% if (useNativeTsconfigPaths) { %>        tsconfigPaths: true,<% } %><% if (usesReactNative) { %>
         extensions: [
           '.mjs',
           '.web.tsx',
@@ -63,9 +60,9 @@ const config: StorybookConfig = {
         ],
         alias: {
           'react-native': 'react-native-web',
-        },
-      },<% } %>
-      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if(uiFramework === '@storybook/react-vite') { %>react(), <% } %>nxViteTsPaths()],
+        },<% } %>
+      },
+      plugins: [<% if(uiFramework === '@storybook/vue3-vite') { %>vue(), <% } %><% if(uiFramework === '@storybook/react-vite') { %>react(), <% } %><% if (!useNativeTsconfigPaths) { %>tsconfigPaths({ loose: true })<% } %>],
     }),
   <% } %>
 };

package/dist/src/generators/configuration/lib/util-functions.d.ts

@@ -1,7 +1,6 @@
 import { Tree } from '@nx/devkit';
 import { StorybookConfigureSchema } from '../schema';
 import { UiFramework } from '../../../utils/models';
-export declare function addStorybookTarget(tree: Tree, projectName: string, uiFramework: UiFramework, interactionTests: boolean): void;
 export declare function addAngularStorybookTarget(tree: Tree, projectName: string, interactionTests: boolean): void;
 export declare function addStaticTarget(tree: Tree, opts: StorybookConfigureSchema): Promise<void>;
 export declare function createStorybookTsconfigFile(tree: Tree, projectRoot: string, uiFramework: UiFramework, isRootProject: boolean, mainDir: 'components' | 'src'): void;
@@ -18,8 +17,7 @@ export declare function configureTsSolutionConfig(tree: Tree, schema: StorybookC
 export declare function updateLintConfig(tree: Tree, schema: StorybookConfigureSchema): void;
 export declare function normalizeSchema(schema: StorybookConfigureSchema): StorybookConfigureSchema;
 export declare function addStorybookToNamedInputs(tree: Tree, schema: StorybookConfigureSchema): void;
-export declare function addStorybookToTargetDefaults(tree: Tree, schema: StorybookConfigureSchema, setCache?: boolean): void;
-export declare function createProjectStorybookDir(tree: Tree, projectName: string, uiFramework: UiFramework, js: boolean, tsConfiguration: boolean, root: string, projectType: string, projectIsRootProjectInStandaloneWorkspace: boolean, interactionTests: boolean, mainDir?: string, isNextJs?: boolean, usesSwc?: boolean, usesVite?: boolean, viteConfigFilePath?: string, hasPlugin?: boolean, viteConfigFileName?: string, usesReactNative?: boolean): void;
+export declare function createProjectStorybookDir(tree: Tree, projectName: string, uiFramework: UiFramework, js: boolean, tsConfiguration: boolean, root: string, projectType: string, projectIsRootProjectInStandaloneWorkspace: boolean, interactionTests: boolean, mainDir?: string, isNextJs?: boolean, usesSwc?: boolean, usesVite?: boolean, viteConfigFilePath?: string, viteConfigFileName?: string, usesReactNative?: boolean, useNativeTsconfigPaths?: boolean): void;
 export declare function getTsConfigPath(tree: Tree, projectName: string, path?: string): string;
 export declare function addBuildStorybookToCacheableOperations(tree: Tree): void;
 export declare function projectIsRootProjectInStandaloneWorkspace(projectRoot: string): boolean;

package/dist/src/generators/configuration/lib/util-functions.js

@@ -1,6 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addStorybookTarget = addStorybookTarget;
 exports.addAngularStorybookTarget = addAngularStorybookTarget;
 exports.addStaticTarget = addStaticTarget;
 exports.createStorybookTsconfigFile = createStorybookTsconfigFile;
@@ -10,7 +9,6 @@ exports.configureTsSolutionConfig = configureTsSolutionConfig;
 exports.updateLintConfig = updateLintConfig;
 exports.normalizeSchema = normalizeSchema;
 exports.addStorybookToNamedInputs = addStorybookToNamedInputs;
-exports.addStorybookToTargetDefaults = addStorybookToTargetDefaults;
 exports.createProjectStorybookDir = createProjectStorybookDir;
 exports.getTsConfigPath = getTsConfigPath;
 exports.addBuildStorybookToCacheableOperations = addBuildStorybookToCacheableOperations;
@@ -26,46 +24,8 @@ const path_1 = require("path");
 const utilities_1 = require("../../../utils/utilities");
 const versions_1 = require("../../../utils/versions");
 const internal_1 = require("@nx/eslint/internal");
-const internal_2 = require("@nx/devkit/internal");
-const internal_3 = require("@nx/js/internal");
+const internal_2 = require("@nx/js/internal");
 const DEFAULT_PORT = 4400;
-function addStorybookTarget(tree, projectName, uiFramework, interactionTests) {
-    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, projectName);
-    projectConfig.targets['storybook'] = {
-        executor: '@nx/storybook:storybook',
-        options: {
-            port: DEFAULT_PORT,
-            configDir: `${projectConfig.root}/.storybook`,
-        },
-        configurations: {
-            ci: {
-                quiet: true,
-            },
-        },
-    };
-    projectConfig.targets['build-storybook'] = {
-        executor: '@nx/storybook:build',
-        outputs: ['{options.outputDir}'],
-        options: {
-            outputDir: (0, devkit_1.joinPathFragments)('dist/storybook', projectName),
-            configDir: `${projectConfig.root}/.storybook`,
-        },
-        configurations: {
-            ci: {
-                quiet: true,
-            },
-        },
-    };
-    if (interactionTests === true) {
-        projectConfig.targets['test-storybook'] = {
-            executor: 'nx:run-commands',
-            options: {
-                command: `test-storybook -c ${projectConfig.root}/.storybook --url=http://localhost:${DEFAULT_PORT}`,
-            },
-        };
-    }
-    (0, devkit_1.updateProjectConfiguration)(tree, projectName, projectConfig);
-}
 function addAngularStorybookTarget(tree, projectName, interactionTests) {
     const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, projectName);
     const { ngBuildTarget } = (0, utilities_1.findStorybookAndBuildTargetsAndCompiler)(projectConfig.targets);
@@ -126,7 +86,7 @@ async function addStaticTarget(tree, opts) {
 function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProject, mainDir) {
     const storybookMajorVersion = (0, utilities_1.storybookMajorVersion)(tree);
     const offset = (0, devkit_1.offsetFromRoot)(projectRoot);
-    const useTsSolution = (0, internal_3.isUsingTsSolutionSetup)(tree);
+    const useTsSolution = (0, internal_2.isUsingTsSolutionSetup)(tree);
     // First let's check if old configuration file exists
     // If it exists, let's rename it and move it to the new location
     const oldStorybookTsConfigPath = (0, devkit_1.joinPathFragments)(projectRoot, '.storybook/tsconfig.json');
@@ -175,7 +135,7 @@ function createStorybookTsconfigFile(tree, projectRoot, uiFramework, isRootProje
         ],
     };
     if (useTsSolution) {
-        const runtimeConfig = (0, internal_3.findRuntimeTsConfigName)(projectRoot, tree);
+        const runtimeConfig = (0, internal_2.findRuntimeTsConfigName)(projectRoot, tree);
         if (runtimeConfig) {
             storybookTsConfig.references ??= [];
             storybookTsConfig.references.push({
@@ -371,39 +331,8 @@ function addStorybookToNamedInputs(tree, schema) {
         (0, devkit_1.updateNxJson)(tree, nxJson);
     }
 }
-function addStorybookToTargetDefaults(tree, schema, setCache = true) {
-    const nxJson = (0, devkit_1.readNxJson)(tree) ?? {};
-    const existing = (0, internal_2.findTargetDefault)(nxJson.targetDefaults, {
-        target: 'build-storybook',
-    });
-    const inputs = existing?.inputs
-        ? [...existing.inputs]
-        : [
-            'default',
-            nxJson.namedInputs && 'production' in nxJson.namedInputs
-                ? '^production'
-                : '^default',
-        ];
-    if (!inputs.includes('{projectRoot}/.storybook/**/*')) {
-        inputs.push('{projectRoot}/.storybook/**/*');
-    }
-    // Drop the negation glob so Storybook rebuilds when .storybook changes.
-    const negatedIndex = inputs.indexOf('!{projectRoot}/.storybook/**/*');
-    if (negatedIndex !== -1)
-        inputs.splice(negatedIndex, 1);
-    if (schema.uiFramework !== '@storybook/angular' &&
-        !inputs.includes('{projectRoot}/tsconfig.storybook.json')) {
-        inputs.push('{projectRoot}/tsconfig.storybook.json');
-    }
-    (0, internal_2.upsertTargetDefault)(tree, nxJson, {
-        target: 'build-storybook',
-        ...(setCache && existing?.cache === undefined ? { cache: true } : {}),
-        inputs,
-    });
-    (0, devkit_1.updateNxJson)(tree, nxJson);
-}
-function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfiguration, root, projectType, projectIsRootProjectInStandaloneWorkspace, interactionTests, mainDir, isNextJs, usesSwc, usesVite, viteConfigFilePath, hasPlugin, viteConfigFileName, usesReactNative) {
-    let projectDirectory = (0, internal_3.getProjectType)(tree, root, projectType) ===
+function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfiguration, root, projectType, projectIsRootProjectInStandaloneWorkspace, interactionTests, mainDir, isNextJs, usesSwc, usesVite, viteConfigFilePath, viteConfigFileName, usesReactNative, useNativeTsconfigPaths = true) {
+    let projectDirectory = (0, internal_2.getProjectType)(tree, root, projectType) ===
         'application'
         ? isNextJs
             ? 'components'
@@ -431,15 +360,15 @@ function createProjectStorybookDir(tree, projectName, uiFramework, js, tsConfigu
         interactionTests,
         mainDir,
         isNextJs: isNextJs &&
-            (0, internal_3.getProjectType)(tree, root, projectType) ===
+            (0, internal_2.getProjectType)(tree, root, projectType) ===
                 'application',
         usesSwc,
         usesVite,
         isRootProject: projectIsRootProjectInStandaloneWorkspace,
         viteConfigFilePath,
-        hasPlugin,
         viteConfigFileName,
         usesReactNative,
+        useNativeTsconfigPaths,
     });
     if (js) {
         (0, devkit_1.toJS)(tree);
@@ -458,7 +387,7 @@ function getTsConfigPath(tree, projectName, path) {
     const { root, projectType } = (0, devkit_1.readProjectConfiguration)(tree, projectName);
     return (0, path_1.join)(root, path?.length > 0
         ? path
-        : (0, internal_3.getProjectType)(tree, root, projectType) === 'application'
+        : (0, internal_2.getProjectType)(tree, root, projectType) === 'application'
             ? 'tsconfig.app.json'
             : 'tsconfig.lib.json');
 }

package/dist/src/generators/configuration/schema.d.ts

@@ -10,10 +10,8 @@ export interface StorybookConfigureSchema {
   tsConfiguration?: boolean;
   configureStaticServe?: boolean;
   skipFormat?: boolean;
-  addPlugin?: boolean;
 
   /**
    * @internal
    */
-  addExplicitTargets?: boolean;
 }

package/dist/src/generators/convert-to-inferred/convert-to-inferred.js

@@ -40,8 +40,9 @@ async function convertToInferred(tree, options) {
         await (0, devkit_1.formatFiles)(tree);
     }
     const installTask = (0, devkit_1.addDependenciesToPackageJson)(tree, {}, { storybook: versions_1.storybookVersion }, undefined, true);
-    return (0, devkit_1.runTasksInSerial)(installTask, () => {
-        migrationLogs.flushLogs();
-    });
+    // Flushed now rather than in the callback so remove-deprecated-executors, which
+    // skips the install callback, still prints these.
+    migrationLogs.flushLogs();
+    return installTask;
 }
 exports.default = convertToInferred;

package/dist/src/generators/init/init.js

@@ -23,15 +23,6 @@ function checkDependenciesInstalled(host, schema) {
     });
     return (0, devkit_1.addDependenciesToPackageJson)(host, {}, devDependencies, undefined, schema.keepExistingVersions ?? true);
 }
-function addCacheableOperation(tree) {
-    const nxJson = (0, devkit_1.readNxJson)(tree) ?? {};
-    const cacheableOperations = nxJson.tasksRunnerOptions?.default?.options?.cacheableOperations;
-    if (cacheableOperations && !cacheableOperations.includes('build-storybook')) {
-        nxJson.tasksRunnerOptions.default.options.cacheableOperations.push('build-storybook');
-    }
-    (0, internal_1.upsertTargetDefault)(tree, nxJson, { target: 'build-storybook', cache: true });
-    (0, devkit_1.updateNxJson)(tree, nxJson);
-}
 function moveToDevDependencies(tree) {
     let updated = false;
     (0, devkit_1.updateJson)(tree, 'package.json', (packageJson) => {
@@ -48,54 +39,45 @@ function moveToDevDependencies(tree) {
     return updated ? () => (0, devkit_1.installPackagesTask)(tree) : () => { };
 }
 function initGenerator(tree, schema) {
-    return initGeneratorInternal(tree, { addPlugin: false, ...schema });
+    return initGeneratorInternal(tree, schema);
 }
 async function initGeneratorInternal(tree, schema) {
     (0, assert_supported_storybook_version_1.assertSupportedStorybookVersion)(tree);
-    const nxJson = (0, devkit_1.readNxJson)(tree);
-    const addPluginDefault = process.env.NX_ADD_PLUGINS !== 'false' &&
-        nxJson.useInferencePlugins !== false;
-    schema.addPlugin ??= addPluginDefault;
-    if (schema.addPlugin) {
-        await (0, internal_1.addPlugin)(tree, await (0, devkit_1.createProjectGraphAsync)(), '@nx/storybook/plugin', plugin_1.createNodesV2, {
-            serveStorybookTargetName: [
-                'storybook',
-                'serve:storybook',
-                'serve-storybook',
-                'storybook:serve',
-                'storybook-serve',
-            ],
-            buildStorybookTargetName: [
-                'build-storybook',
-                'build:storybook',
-                'storybook:build',
-            ],
-            testStorybookTargetName: [
-                'test-storybook',
-                'test:storybook',
-                'storybook:test',
-            ],
-            staticStorybookTargetName: [
-                'static-storybook',
-                'static:storybook',
-                'storybook:static',
-            ],
-            buildDepsTargetName: [
-                'build-deps',
-                'storybook:build-deps',
-                'storybook-build-deps',
-            ],
-            watchDepsTargetName: [
-                'watch-deps',
-                'storybook:watch-deps',
-                'storybook-watch-deps',
-            ],
-        }, schema.updatePackageScripts);
-        (0, update_gitignore_1.updateGitignore)(tree);
-    }
-    else {
-        addCacheableOperation(tree);
-    }
+    await (0, internal_1.addPlugin)(tree, await (0, devkit_1.createProjectGraphAsync)(), '@nx/storybook/plugin', plugin_1.createNodesV2, {
+        serveStorybookTargetName: [
+            'storybook',
+            'serve:storybook',
+            'serve-storybook',
+            'storybook:serve',
+            'storybook-serve',
+        ],
+        buildStorybookTargetName: [
+            'build-storybook',
+            'build:storybook',
+            'storybook:build',
+        ],
+        testStorybookTargetName: [
+            'test-storybook',
+            'test:storybook',
+            'storybook:test',
+        ],
+        staticStorybookTargetName: [
+            'static-storybook',
+            'static:storybook',
+            'storybook:static',
+        ],
+        buildDepsTargetName: [
+            'build-deps',
+            'storybook:build-deps',
+            'storybook-build-deps',
+        ],
+        watchDepsTargetName: [
+            'watch-deps',
+            'storybook:watch-deps',
+            'storybook-watch-deps',
+        ],
+    }, schema.updatePackageScripts);
+    (0, update_gitignore_1.updateGitignore)(tree);
     const tasks = [];
     if (!schema.skipPackageJson) {
         tasks.push(moveToDevDependencies(tree));

package/dist/src/generators/init/schema.d.ts

@@ -3,5 +3,4 @@ export interface Schema {
   skipPackageJson?: boolean;
   keepExistingVersions?: boolean;
   updatePackageScripts?: boolean;
-  addPlugin?: boolean;
 }

package/dist/src/generators/migrate-10/files/ai-instructions-for-cjs-esm.md

@@ -57,15 +57,15 @@ B. Convert `require()` to import
 // FROM (CJS):
 
 ```
-const { nxViteTsPaths } = require('@nx/vite/plugins/nx-tsconfig-paths.plugin');
 const { mergeConfig } = require('vite');
+const react = require('@vitejs/plugin-react');
 ```
 
 // TO (ESM):
 
 ```
-import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { mergeConfig } from 'vite';
+import react from '@vitejs/plugin-react';
 ```
 
 C. Handle `path.join()` patterns