CLI: add preprepare script to generate repro templates list

code/lib/cli/package.json

@@ -42,6 +42,7 @@
   ],
   "scripts": {
     "check": "tsc --noEmit",
+    "preprepare": "node ./scripts/generate-repro-templates-list.js",
     "prepare": "node ../../../scripts/prepare.js",
     "test": "jest test/**/*.test.js"
   },
@@ -67,6 +68,7 @@
     "fs-extra": "^9.0.1",
     "get-port": "^5.1.1",
     "globby": "^11.0.2",
+    "js-yaml": "^3.14.1",
     "jscodeshift": "^0.13.1",
     "json5": "^2.1.3",
     "leven": "^3.1.0",

code/lib/cli/scripts/generate-repro-templates-list.js

@@ -0,0 +1,42 @@
+#!/usr/bin/env node
+
+const { writeFile } = require('fs-extra');
+const { exec } = require('child_process');
+const path = require('path');
+const { default: dedent } = require('ts-dedent');
+const { readFile } = require('fs-extra');
+const yml = require('js-yaml');
+
+const logger = console;
+
+async function getTemplatesData(filePath) {
+  const configContents = await readFile(filePath, 'utf8');
+  return yml.load(configContents);
+}
+
+const run = async () => {
+  logger.log('Generating templates list...');
+  const templatesData = await getTemplatesData(
+    path.resolve(__dirname, '../../../../scripts/next-repro-generators/repro-config.yml')
+  );
+  const destination = path.join(__dirname, '..', 'src', 'repro-templates.ts');
+
+  await writeFile(
+    destination,
+    dedent`
+      // This file was auto generated from generate-repro-templates-list.js, please do not edit!
+      export default ${JSON.stringify(templatesData, null, 2)}
+    `
+  );
+
+  exec(`yarn lint:js:cmd --fix ${destination}`, {
+    cwd: path.join(__dirname, '..', '..', '..'),
+  });
+
+  logger.log('Done! generated ', destination);
+};
+
+run().catch((e) => {
+  logger.error(e);
+  process.exit(1);
+});

code/lib/cli/src/repro-templates.ts

@@ -0,0 +1,21 @@
+// auto generated file, do not edit
+export default {
+  'cra/default-js': {
+    name: 'Create React App (Javascript)',
+    script: 'npx create-react-app .',
+    expected: {
+      framework: '@storybook/cra',
+      renderer: '@storybook/react',
+      builder: '@storybook/builder-webpack5',
+    },
+  },
+  'cra/default-ts': {
+    name: 'Create React App (Typescript)',
+    script: 'npx create-react-app . --template typescript',
+    expected: {
+      framework: '@storybook/cra',
+      renderer: '@storybook/react',
+      builder: '@storybook/builder-webpack5',
+    },
+  },
+} as const;

code/yarn.lock

@@ -7708,6 +7708,7 @@ __metadata:
     fs-extra: ^9.0.1
     get-port: ^5.1.1
     globby: ^11.0.2
+    js-yaml: ^3.14.1
     jscodeshift: ^0.13.1
     json5: ^2.1.3
     leven: ^3.1.0