feat(storybook): move tsconfig one level up (#17749)

e2e/storybook/src/storybook-nested.test.ts

@@ -42,7 +42,7 @@ describe('Storybook generators and executors for standalone workspaces - using R
       checkFilesExist(
         '.storybook/main.js',
         '.storybook/preview.js',
-        '.storybook/tsconfig.json'
+        'tsconfig.storybook.json'
       );
     });
 

packages/react-native/src/generators/storybook-configuration/configuration.spec.ts

@@ -40,7 +40,7 @@ describe('react-native:storybook-configuration', () => {
         appTree.exists('libs/test-ui-lib/.storybook/main.js')
       ).toBeTruthy();
       expect(
-        appTree.exists('libs/test-ui-lib/.storybook/tsconfig.json')
+        appTree.exists('libs/test-ui-lib/tsconfig.storybook.json')
       ).toBeTruthy();
     });
 
@@ -74,7 +74,7 @@ describe('react-native:storybook-configuration', () => {
         appTree.exists('apps/test-ui-app/.storybook/main.js')
       ).toBeTruthy();
       expect(
-        appTree.exists('apps/test-ui-app/.storybook/tsconfig.json')
+        appTree.exists('apps/test-ui-app/tsconfig.storybook.json')
       ).toBeTruthy();
     });
 

packages/react/plugins/storybook/index.ts

@@ -167,9 +167,9 @@ export const webpack = async (
   }
 
   const { withNx, withWeb } = require('@nx/webpack');
-  const tsconfigPath = join(options.configDir, 'tsconfig.json');
 
   const projectData = await getProjectData(options);
+  const tsconfigPath = join(projectData.projectRoot, 'tsconfig.storybook.json');
 
   fixBabelConfigurationIfNeeded(storybookWebpackConfig, projectData);
 

packages/react/src/generators/storybook-configuration/configuration.spec.ts

@@ -42,7 +42,7 @@ describe('react:storybook-configuration', () => {
 
     expect(appTree.exists('libs/test-ui-lib/.storybook/main.js')).toBeTruthy();
     expect(
-      appTree.exists('libs/test-ui-lib/.storybook/tsconfig.json')
+      appTree.exists('libs/test-ui-lib/tsconfig.storybook.json')
     ).toBeTruthy();
     expect(
       appTree.exists('apps/test-ui-lib-e2e/cypress.config.ts')
@@ -104,7 +104,7 @@ describe('react:storybook-configuration', () => {
 
     expect(appTree.exists('apps/test-ui-app/.storybook/main.js')).toBeTruthy();
     expect(
-      appTree.exists('apps/test-ui-app/.storybook/tsconfig.json')
+      appTree.exists('apps/test-ui-app/tsconfig.storybook.json')
     ).toBeTruthy();
 
     /**

packages/storybook/migrations.json

@@ -59,6 +59,12 @@
       "version": "16.1.0-beta.0",
       "description": "Ignore @nx/react/plugins/storybook in Storybook eslint rules.",
       "factory": "./src/migrations/update-16-1-0/eslint-ignore-react-plugin"
+    },
+    "update-16-5-0": {
+      "cli": "nx",
+      "version": "16.5.0-beta.0",
+      "description": "Move .storybook/tsconfig.json to tsconfig.storybook.json for non-Angular projects.",
+      "factory": "./src/migrations/update-16-5-0/move-storybook-tsconfig"
     }
   },
   "packageJsonUpdates": {

packages/storybook/src/generators/configuration/__snapshots__/configuration-nested.spec.ts.snap

@@ -26,30 +26,34 @@ export default config;
 
 exports[`@nx/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 2`] = `
 "{
-  "extends": "../tsconfig.json",
+  "extends": "./tsconfig.json",
   "compilerOptions": {
     "emitDecoratorMetadata": true,
     "outDir": ""
   },
   "files": [
-    "../node_modules/@nx/react/typings/styled-jsx.d.ts",
-    "../node_modules/@nx/react/typings/cssmodule.d.ts",
-    "../node_modules/@nx/react/typings/image.d.ts"
+    "node_modules/@nx/react/typings/styled-jsx.d.ts",
+    "node_modules/@nx/react/typings/cssmodule.d.ts",
+    "node_modules/@nx/react/typings/image.d.ts"
   ],
   "exclude": [
-    "../**/*.spec.ts",
-    "../**/*.spec.js",
-    "../**/*.spec.tsx",
-    "../**/*.spec.jsx"
+    "src/**/*.spec.ts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.js",
+    "src/**/*.test.js",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.jsx",
+    "src/**/*.test.js"
   ],
   "include": [
-    "../src/**/*.stories.ts",
-    "../src/**/*.stories.js",
-    "../src/**/*.stories.jsx",
-    "../src/**/*.stories.tsx",
-    "../src/**/*.stories.mdx",
-    "*.ts",
-    "*.js"
+    "src/**/*.stories.ts",
+    "src/**/*.stories.js",
+    "src/**/*.stories.jsx",
+    "src/**/*.stories.tsx",
+    "src/**/*.stories.mdx",
+    ".storybook/*.js",
+    ".storybook/*.ts"
   ]
 }
 "
@@ -79,30 +83,34 @@ export default config;
 
 exports[`@nx/storybook:configuration for workspaces with Root project basic functionalities should generate Storybook files for nested project only 5`] = `
 "{
-  "extends": "../tsconfig.json",
+  "extends": "./tsconfig.json",
   "compilerOptions": {
     "emitDecoratorMetadata": true,
     "outDir": ""
   },
   "files": [
-    "../../../node_modules/@nx/react/typings/styled-jsx.d.ts",
-    "../../../node_modules/@nx/react/typings/cssmodule.d.ts",
-    "../../../node_modules/@nx/react/typings/image.d.ts"
+    "../../node_modules/@nx/react/typings/styled-jsx.d.ts",
+    "../../node_modules/@nx/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nx/react/typings/image.d.ts"
   ],
   "exclude": [
-    "../**/*.spec.ts",
-    "../**/*.spec.js",
-    "../**/*.spec.tsx",
-    "../**/*.spec.jsx"
+    "src/**/*.spec.ts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.js",
+    "src/**/*.test.js",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.jsx",
+    "src/**/*.test.js"
   ],
   "include": [
-    "../src/**/*.stories.ts",
-    "../src/**/*.stories.js",
-    "../src/**/*.stories.jsx",
-    "../src/**/*.stories.tsx",
-    "../src/**/*.stories.mdx",
-    "*.ts",
-    "*.js"
+    "src/**/*.stories.ts",
+    "src/**/*.stories.js",
+    "src/**/*.stories.jsx",
+    "src/**/*.stories.tsx",
+    "src/**/*.stories.mdx",
+    ".storybook/*.js",
+    ".storybook/*.ts"
   ]
 }
 "