@storybook/cli 8.0.5 → 8.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/generate.js +82 -76
- package/dist/generate.mjs +26 -20
- package/package.json +9 -9
package/dist/generate.mjs
CHANGED
|
@@ -173,11 +173,11 @@ The project types currently supported by Storybook are:
|
|
|
173
173
|
Wanna know more about Storybook? Check out ${chalk15.cyan("https://storybook.js.org/")}
|
|
174
174
|
Having trouble or want to chat? Join us at ${chalk15.cyan("https://discord.gg/storybook/")}
|
|
175
175
|
`,{borderStyle:"round",padding:1,borderColor:"#F1618C"})),{shouldRunDev:process.env.CI!=="true"&&process.env.IN_STORYBOOK_SANDBOX!=="true",projectType,packageManager,storybookCommand}}async function initiate(options,pkg2){let initiateResult=await withTelemetry("init",{cliOptions:options,printError:err=>!err.handled&&logger6.error(err)},()=>doInitiate(options));if(initiateResult?.shouldRunDev){let{projectType,packageManager,storybookCommand}=initiateResult;logger6.log(`
|
|
176
|
-
Running Storybook`);try{let isReactWebProject=projectType==="REACT_SCRIPTS"||projectType==="REACT"||projectType==="WEBPACK_REACT"||projectType==="REACT_PROJECT"||projectType==="NEXTJS",flags=[];packageManager.type==="npm"&&projectType!=="ANGULAR"&&flags.push("--"),isReactWebProject&&flags.push("--initial-path=/onboarding"),flags.push("--quiet"),packageManager.runPackageCommandSync(storybookCommand.replace(/^yarn /,""),flags,void 0,"inherit");}catch{}}}var postinstallAddon=async(addonName,options)=>{try{let modulePath=__require.resolve(`${addonName}/postinstall`,{paths:[process.cwd()]}),postinstall=__require(modulePath);try{console.log(`Running postinstall script for ${addonName}`),await postinstall(options);}catch(e){console.error(`Error running postinstall script for ${addonName}`),console.error(e);}}catch{}};var getVersionSpecifier=addon=>{let groups=/^(@{0,1}[^@]+)(?:@(.+))?$/.exec(addon);return groups?[groups[1],groups[2]]:[addon,void 0]},requireMain=configDir=>{let absoluteConfigDir=isAbsolute(configDir)?configDir:join(process.cwd(),configDir),mainFile=join(absoluteConfigDir,"main");return serverRequire(mainFile)??{}},checkInstalled=(addonName,main)=>!!main.addons?.find(entry=>(typeof entry=="string"?entry:entry.name)?.endsWith(addonName)),isCoreAddon=addonName=>Object.hasOwn(versions,addonName);async function add(addon,options,
|
|
176
|
+
Running Storybook`);try{let isReactWebProject=projectType==="REACT_SCRIPTS"||projectType==="REACT"||projectType==="WEBPACK_REACT"||projectType==="REACT_PROJECT"||projectType==="NEXTJS",flags=[];packageManager.type==="npm"&&projectType!=="ANGULAR"&&flags.push("--"),isReactWebProject&&flags.push("--initial-path=/onboarding"),flags.push("--quiet"),packageManager.runPackageCommandSync(storybookCommand.replace(/^yarn /,""),flags,void 0,"inherit");}catch{}}}var postinstallAddon=async(addonName,options)=>{try{let modulePath=__require.resolve(`${addonName}/postinstall`,{paths:[process.cwd()]}),postinstall=__require(modulePath);try{console.log(`Running postinstall script for ${addonName}`),await postinstall(options);}catch(e){console.error(`Error running postinstall script for ${addonName}`),console.error(e);}}catch{}};var getVersionSpecifier=addon=>{let groups=/^(@{0,1}[^@]+)(?:@(.+))?$/.exec(addon);return groups?[groups[1],groups[2]]:[addon,void 0]},requireMain=configDir=>{let absoluteConfigDir=isAbsolute(configDir)?configDir:join(process.cwd(),configDir),mainFile=join(absoluteConfigDir,"main");return serverRequire(mainFile)??{}},checkInstalled=(addonName,main)=>!!main.addons?.find(entry=>(typeof entry=="string"?entry:entry.name)?.endsWith(addonName)),isCoreAddon=addonName=>Object.hasOwn(versions,addonName);async function add(addon,options,logger33=console){let{packageManager:pkgMgr}=options,[addonName,inputVersion]=getVersionSpecifier(addon),packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),packageJson=await packageManager.retrievePackageJson(),{mainConfig,configDir}=getStorybookInfo(packageJson);if(typeof configDir>"u")throw new Error(dedent21`
|
|
177
177
|
Unable to find storybook config directory
|
|
178
|
-
`);if(!mainConfig){
|
|
178
|
+
`);if(!mainConfig){logger33.error("Unable to find storybook main.js config");return}if(checkInstalled(addonName,requireMain(configDir)))throw new Error(dedent21`
|
|
179
179
|
Addon ${addonName} is already installed; we skipped adding it to your ${mainConfig}.
|
|
180
|
-
`);let main=await readConfig(mainConfig);
|
|
180
|
+
`);let main=await readConfig(mainConfig);logger33.log(`Verifying ${addonName}`);let storybookVersion=await getCoercedStorybookVersion(packageManager),version=inputVersion;!version&&isCoreAddon(addonName)&&storybookVersion&&(version=storybookVersion),version||(version=await packageManager.latestVersion(addonName)),isCoreAddon(addonName)&&version!==storybookVersion&&logger33.warn(`The version of ${addonName} you are installing is not the same as the version of Storybook you are using. This may lead to unexpected behavior.`);let addonWithVersion=isValidVersion(version)?`${addonName}@^${version}`:`${addonName}@${version}`;logger33.log(`Installing ${addonWithVersion}`),await packageManager.addDependencies({installAsDevDependencies:!0},[addonWithVersion]),logger33.log(`Adding '${addon}' to main.js addons field.`),main.appendValueToArray(["addons"],addonName),await writeConfig(main),!options.skipPostinstall&&isCoreAddon(addonName)&&await postinstallAddon(addonName,{packageManager:packageManager.type});}function isValidVersion(version){return semver.valid(version)||version.match(/^\d+$/)}var logger7=console,getFrameworkPackageName=mainConfig=>{let packageNameOrPath=typeof mainConfig?.framework=="string"?mainConfig.framework:mainConfig?.framework?.name;if(!packageNameOrPath)return null;let normalizedPath=path9.normalize(packageNameOrPath).replace(new RegExp(/\\/,"g"),"/");return Object.keys(frameworkPackages).find(pkg2=>normalizedPath.endsWith(pkg2))||packageNameOrPath},getBuilderPackageName=mainConfig=>{let frameworkBuilder=getFrameworkOptions(mainConfig)?.builder,frameworkBuilderName=typeof frameworkBuilder=="string"?frameworkBuilder:frameworkBuilder?.options?.name,packageNameOrPath=(typeof mainConfig?.core?.builder=="string"?mainConfig.core.builder:mainConfig?.core?.builder?.name)??frameworkBuilderName;if(!packageNameOrPath)return null;let normalizedPath=path9.normalize(packageNameOrPath).replace(new RegExp(/\\/,"g"),"/");return builderPackages.find(pkg2=>normalizedPath.endsWith(pkg2))||packageNameOrPath},getFrameworkOptions=mainConfig=>typeof mainConfig?.framework=="string"?null:mainConfig?.framework?.options??null,getRendererPackageNameFromFramework=frameworkPackageName=>{if(frameworkPackageName){if(Object.keys(rendererPackages).includes(frameworkPackageName))return frameworkPackageName;if(Object.values(rendererPackages).includes(frameworkPackageName))return Object.keys(rendererPackages).find(k=>rendererPackages[k]===frameworkPackageName)}return null},getStorybookData=async({packageManager,configDir:userDefinedConfigDir})=>{let packageJson=await packageManager.retrievePackageJson(),{mainConfig:mainConfigPath,version:storybookVersionSpecifier,configDir:configDirFromScript,previewConfig:previewConfigPath}=getStorybookInfo(packageJson,userDefinedConfigDir),storybookVersion=await getCoercedStorybookVersion(packageManager),configDir=userDefinedConfigDir||configDirFromScript||".storybook",mainConfig;try{mainConfig=await loadMainConfig({configDir,noCache:!0});}catch(err){throw new Error(dedent21`Unable to find or evaluate ${chalk15.blue(mainConfigPath)}: ${String(err)}`)}return {configDir,mainConfig,storybookVersionSpecifier,storybookVersion,mainConfigPath,previewConfigPath}},updateMainConfig=async({mainConfigPath,dryRun},callback)=>{try{let main=await readConfig(mainConfigPath);await callback(main),dryRun||await writeConfig(main);}catch(e){logger7.info(`\u274C The migration failed to update your ${chalk15.blue(mainConfigPath)} on your behalf because of the following error:
|
|
181
181
|
${e}
|
|
182
182
|
`),logger7.info(`\u26A0\uFE0F Storybook automigrations are based on AST parsing and it's possible that your ${chalk15.blue(mainConfigPath)} file contains a non-standard format (e.g. your export is not an object) or that there was an error when parsing dynamic values (e.g. "require" calls, or usage of environment variables). When your main config is non-standard, automigrations are unfortunately not possible. Please follow the instructions given previously and follow the documentation to make the updates manually.`);}},getAddonNames=mainConfig=>(mainConfig.addons||[]).map(addon=>{let name="";if(typeof addon=="string"?name=addon:typeof addon=="object"&&(name=addon.name),!name.startsWith("."))return name.replace(/\/dist\/.*/,"").replace(/\.[mc]?[tj]?s[x]?$/,"").replace(/\/register$/,"").replace(/\/manager$/,"").replace(/\/preset$/,"")}).filter(item=>item!=null);var logger8=console,checkWebpack5Builder=async({mainConfig,storybookVersion})=>{if(semver.lt(storybookVersion,"6.3.0"))return logger8.warn(dedent21`
|
|
183
183
|
Detected SB 6.3 or below, please upgrade storybook to use webpack5.
|
|
@@ -525,7 +525,13 @@ globstar while`,file,fr,pattern,pr,swallowee),this.matchOne(file.slice(fr),patte
|
|
|
525
525
|
- ${chalk15.cyan("@storybook/addon-postcss")}
|
|
526
526
|
|
|
527
527
|
Please migrate to ${chalk15.cyan("@storybook/addon-styling-webpack")} once you're done upgrading.
|
|
528
|
-
`}};var
|
|
528
|
+
`}};var logger23=console,vta={id:"visual-tests-addon",versionRange:["<8.0.7",">=8.0.7"],async check({mainConfig}){return getAddonNames(mainConfig).some(addon=>addon.includes("@chromatic-com/storybook"))?null:{}},prompt(){return dedent`
|
|
529
|
+
New to Storybook 8: Storybook's Visual Tests addon helps you catch unintentional changes/bugs in your stories. The addon is powered by Chromatic, a cloud-based testing tool developed by Storybook's core team.
|
|
530
|
+
|
|
531
|
+
Learn more: ${chalk15.yellow("storybook.js.org/docs/writing-tests/visual-testing")}
|
|
532
|
+
|
|
533
|
+
Install Visual Tests addon in your project?
|
|
534
|
+
`},async run({packageManager,dryRun,mainConfigPath,skipInstall}){if(!dryRun){let packageJson=await packageManager.retrievePackageJson();await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall,packageJson},["@chromatic-com/storybook@^1"]),await updateMainConfig({mainConfigPath,dryRun:!!dryRun},async main=>{logger23.info('\u2705 Adding "@chromatic-com/storybook" addon'),main.appendValueToArray(["addons"],"@chromatic-dom/storybook");});}}};var checkPackageCompatibility=async(dependency,context)=>{let{currentStorybookVersion,skipErrors,packageManager}=context;try{let dependencyPackageJson=await packageManager.getPackageJSON(dependency);if(dependencyPackageJson===null)return {packageName:dependency};let{version:packageVersion,name=dependency,dependencies,peerDependencies,homepage}=dependencyPackageJson,hasIncompatibleDependencies=!!Object.entries({...dependencies,...peerDependencies}).filter(([dep])=>versions[dep]).find(([_,versionRange])=>versionRange&&semver.validRange(versionRange)&&!semver.satisfies(currentStorybookVersion,versionRange)),isCorePackage3=versions[name],availableUpdate;return isCorePackage3&&semver.gt(currentStorybookVersion,packageVersion)&&(availableUpdate=currentStorybookVersion),{packageName:name,packageVersion,homepage,hasIncompatibleDependencies,availableUpdate}}catch(err){return skipErrors||console.log(`Error checking compatibility for ${dependency}, please report an issue:
|
|
529
535
|
`,err),{packageName:dependency}}},getIncompatibleStorybookPackages=async context=>{let packageManager=context.packageManager??JsPackageManagerFactory.getPackageManager(),allDeps=await packageManager.getAllDependencies(),storybookLikeDeps=Object.keys(allDeps).filter(dep=>dep.includes("storybook"));if(storybookLikeDeps.length===0&&!context.skipErrors)throw new Error("No Storybook dependencies found in the package.json");return Promise.all(storybookLikeDeps.map(dep=>checkPackageCompatibility(dep,{...context,packageManager})))},getIncompatiblePackagesSummary=(dependencyAnalysis,currentStorybookVersion)=>{let summaryMessage=[],incompatiblePackages=dependencyAnalysis.filter(dep=>dep.hasIncompatibleDependencies);return incompatiblePackages.length>0&&(summaryMessage.push(`The following packages are incompatible with Storybook ${chalk15.bold(currentStorybookVersion)} as they depend on different major versions of Storybook packages:`),incompatiblePackages.forEach(({packageName:addonName,packageVersion:addonVersion,homepage,availableUpdate})=>{let packageDescription=`${chalk15.cyan(addonName)}@${chalk15.cyan(addonVersion)}`,updateMessage=availableUpdate?` (${availableUpdate} available!)`:"",packageRepo=homepage?`
|
|
530
536
|
Repo: ${chalk15.yellow(homepage)}`:"";summaryMessage.push(`- ${packageDescription}${updateMessage}${packageRepo}`);}),summaryMessage.push(`
|
|
531
537
|
`,"Please consider updating your packages or contacting the maintainers for compatibility details.","For more on Storybook 8 compatibility, see the linked GitHub issue:",chalk15.yellow("https://github.com/storybookjs/storybook/issues/26031"))),summaryMessage.join(`
|
|
@@ -546,7 +552,7 @@ globstar while`,file,fr,pattern,pr,swallowee),this.matchOne(file.slice(fr),patte
|
|
|
546
552
|
We upgraded ${yellow(upgradable.length)} packages:
|
|
547
553
|
${upgradable.map(({packageName,afterVersion,beforeVersion})=>`- ${cyan(packageName)}: ${cyan(beforeVersion)} => ${cyan(afterVersion)}`).join(`
|
|
548
554
|
`)}
|
|
549
|
-
`);}console.log();}};var allFixes=[addonsAPI,newFrameworks,cra5,webpack5,vue3,addonPostCSS,viteConfigFile,eslintPlugin,builderVite,sbBinary,sbScripts,removeJestTestingLibrary,removeArgtypesRegex,removedGlobalClientAPIs,mdxgfm,mdxToCSF,autodocsTrue,angularBuildersMultiproject,angularBuilders,wrapRequire,reactDocgen,storyshotsMigration,removeReactDependency,removeLegacyMDX1,webpack5CompilerSetup,mdx1to3,upgradeStorybookRelatedDependencies];var ansiRegex2=({onlyFirst=!1}={})=>{let pattern=["[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)","(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))"].join("|");return new RegExp(pattern,onlyFirst?void 0:"g")},cleanLog=str=>str.replace(ansiRegex2(),"").replace(/╮│/g,`\u256E
|
|
555
|
+
`);}console.log();}};var allFixes=[addonsAPI,newFrameworks,cra5,webpack5,vue3,addonPostCSS,viteConfigFile,eslintPlugin,builderVite,sbBinary,sbScripts,removeJestTestingLibrary,removeArgtypesRegex,removedGlobalClientAPIs,mdxgfm,mdxToCSF,autodocsTrue,angularBuildersMultiproject,angularBuilders,wrapRequire,reactDocgen,storyshotsMigration,removeReactDependency,removeLegacyMDX1,webpack5CompilerSetup,mdx1to3,upgradeStorybookRelatedDependencies,vta];var ansiRegex2=({onlyFirst=!1}={})=>{let pattern=["[\\u001B\\u009B][[\\]()#;?]*(?:(?:(?:(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]+)*|[a-zA-Z\\d]+(?:;[-a-zA-Z\\d\\/#&.:=?%@~_]*)*)?\\u0007)","(?:(?:\\d{1,4}(?:;\\d{0,4})*)?[\\dA-PR-TZcf-ntqry=><~]))"].join("|");return new RegExp(pattern,onlyFirst?void 0:"g")},cleanLog=str=>str.replace(ansiRegex2(),"").replace(/╮│/g,`\u256E
|
|
550
556
|
\u2502`).replace(/││/g,`\u2502
|
|
551
557
|
\u2502`).replace(/│╰/g,`\u2502
|
|
552
558
|
\u2570`).replace(/⚠️ {2}failed to check/g,`${EOL}\u26A0\uFE0F failed to check`);var messageDivider=`
|
|
@@ -575,7 +581,7 @@ ${packageVersions2.join(", ")}`):acc.trivial.push(`${chalk15.hex("#ff9800")(dep)
|
|
|
575
581
|
${packageVersions2.join(", ")}`),acc},{critical:[],trivial:[]});return critical.length===0&&trivial.length===0||(critical.length>0&&(messages.push(`${chalk15.bold("Critical:")} The following dependencies are duplicated and WILL cause unexpected behavior:`),messages.push(critical.join(messageDivider2),`
|
|
576
582
|
`)),trivial.length>0&&(messages.push(`${chalk15.bold("Attention:")} The following dependencies are duplicated which might cause unexpected behavior:`),messages.push(trivial.join(messageDivider2))),messages.push(`
|
|
577
583
|
`,`Please try de-duplicating these dependencies by running ${chalk15.cyan(`${installationMetadata.dedupeCommand}`)}`),messages.push(`
|
|
578
|
-
`,`You can find more information for a given dependency by running ${chalk15.cyan(`${installationMetadata.infoCommand} <package-name>`)}`)),messages}catch{return}}var
|
|
584
|
+
`,`You can find more information for a given dependency by running ${chalk15.cyan(`${installationMetadata.infoCommand} <package-name>`)}`)),messages}catch{return}}var logger24=console,LOG_FILE_NAME="doctor-storybook.log",LOG_FILE_PATH=join(process.cwd(),LOG_FILE_NAME),TEMP_LOG_FILE_PATH="",originalStdOutWrite=process.stdout.write.bind(process.stdout),originalStdErrWrite=process.stderr.write.bind(process.stdout),augmentLogsToFile=()=>{TEMP_LOG_FILE_PATH=tempy__default.file({name:LOG_FILE_NAME});let logStream=createWriteStream(TEMP_LOG_FILE_PATH);process.stdout.write=d=>(originalStdOutWrite(d),logStream.write(cleanLog(d))),process.stderr.write=d=>logStream.write(cleanLog(d));},cleanup=()=>{process.stdout.write=originalStdOutWrite,process.stderr.write=originalStdErrWrite;},doctor=async({configDir:userSpecifiedConfigDir,packageManager:pkgMgr}={})=>{augmentLogsToFile();let foundIssues=!1,logDiagnostic=(title,message)=>{foundIssues=!0,logger24.info(boxen(message,{borderStyle:"round",padding:1,title,borderColor:"#F1618C"}));};logger24.info("\u{1FA7A} The doctor is checking the health of your Storybook..");let packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),storybookVersion,mainConfig;try{let storybookData=await getStorybookData({configDir:userSpecifiedConfigDir,packageManager});storybookVersion=storybookData.storybookVersion,mainConfig=storybookData.mainConfig;}catch(err){err.message.includes("No configuration files have been found")&&logger24.info(dedent21`[Storybook doctor] Could not find or evaluate your Storybook main.js config directory at ${chalk15.blue(userSpecifiedConfigDir||".storybook")} so the doctor command cannot proceed. You might be running this command in a monorepo or a non-standard project structure. If that is the case, please rerun this command by specifying the path to your Storybook config directory via the --config-dir option.`),logger24.info(dedent21`[Storybook doctor] ❌ ${err.message}`),logger24.info("Please fix the error and try again.");}if(storybookVersion||(logger24.info(dedent21`
|
|
579
585
|
[Storybook doctor] ❌ Unable to determine Storybook version so the command will not proceed.
|
|
580
586
|
🤔 Are you running storybook doctor from your project directory? Please specify your Storybook config directory with the --config-dir flag.
|
|
581
587
|
`),process.exit(1)),!mainConfig)throw new Error("mainConfig is undefined");let allDependencies=await packageManager.getAllDependencies(),incompatibleStorybookPackagesList=await getIncompatibleStorybookPackages({currentStorybookVersion:storybookVersion}),incompatiblePackagesMessage=getIncompatiblePackagesSummary(incompatibleStorybookPackagesList,storybookVersion);incompatiblePackagesMessage&&logDiagnostic("Incompatible packages found",incompatiblePackagesMessage);let installationMetadata=await packageManager.findInstallations(["@storybook/*","storybook"]);if(!incompatiblePackagesMessage){let mismatchingVersionMessage=getMismatchingVersionsWarnings(installationMetadata,allDependencies);if(mismatchingVersionMessage)logDiagnostic("Diagnostics",[mismatchingVersionMessage].join(`
|
|
@@ -584,13 +590,13 @@ ${packageVersions2.join(", ")}`),acc},{critical:[],trivial:[]});return critical.
|
|
|
584
590
|
|
|
585
591
|
`));else {let list=installationMetadata?getDuplicatedDepsWarnings(installationMetadata):getDuplicatedDepsWarnings();Array.isArray(list)&&list.length>0&&logDiagnostic("Duplicated dependencies found",list?.join(`
|
|
586
592
|
`));}}let commandMessage=`You can always recheck the health of your project by running:
|
|
587
|
-
${chalk15.cyan("npx storybook doctor")}`;
|
|
588
|
-
`);console.log(),
|
|
593
|
+
${chalk15.cyan("npx storybook doctor")}`;logger24.info(),foundIssues?(logger24.info(commandMessage),logger24.info(),logger24.info(`Full logs are available in ${chalk15.cyan(LOG_FILE_PATH)}`),await move(TEMP_LOG_FILE_PATH,join(process.cwd(),LOG_FILE_NAME),{overwrite:!0})):(logger24.info("\u{1F973} Your Storybook project looks good!"),logger24.info(commandMessage),await remove(TEMP_LOG_FILE_PATH)),logger24.info(),cleanup();};var logger25=console,LOG_FILE_NAME2="migration-storybook.log",LOG_FILE_PATH2=join(process.cwd(),LOG_FILE_NAME2),TEMP_LOG_FILE_PATH2="",originalStdOutWrite2=process.stdout.write.bind(process.stdout),originalStdErrWrite2=process.stderr.write.bind(process.stdout),augmentLogsToFile2=()=>{TEMP_LOG_FILE_PATH2=tempy__default.file({name:LOG_FILE_NAME2});let logStream=createWriteStream(TEMP_LOG_FILE_PATH2);process.stdout.write=d=>(originalStdOutWrite2(d),logStream.write(cleanLog(d))),process.stderr.write=d=>logStream.write(cleanLog(d));},cleanup2=()=>{process.stdout.write=originalStdOutWrite2,process.stderr.write=originalStdErrWrite2;},logAvailableMigrations=()=>{let availableFixes=allFixes.map(f=>chalk15.yellow(f.id)).map(x=>`- ${x}`).join(`
|
|
594
|
+
`);console.log(),logger25.info(dedent21`
|
|
589
595
|
The following migrations are available:
|
|
590
596
|
${availableFixes}
|
|
591
|
-
`);},doAutomigrate=async options=>{let packageManager=JsPackageManagerFactory.getPackageManager({force:options.packageManager}),[packageJson,storybookVersion]=await Promise.all([packageManager.retrievePackageJson(),getCoercedStorybookVersion(packageManager)]),{configDir:inferredConfigDir,mainConfig:mainConfigPath}=getStorybookInfo(packageJson,options.configDir),configDir=options.configDir||inferredConfigDir||".storybook";if(!storybookVersion)throw new Error("Could not determine Storybook version");if(!mainConfigPath)throw new Error("Could not determine main config path");await automigrate({...options,packageManager,storybookVersion,beforeVersion:storybookVersion,mainConfigPath,configDir,isUpgrade:!1,isLatest:!1})&&await doctor({configDir,packageManager:options.packageManager});},automigrate=async({fixId,fixes:inputFixes,dryRun,yes,packageManager,list,configDir,mainConfigPath,storybookVersion,beforeVersion,renderer:rendererPackage,skipInstall,hideMigrationSummary=!1,isUpgrade,isLatest})=>{if(list)return logAvailableMigrations(),null;let selectedFixes=inputFixes||allFixes.filter(fix=>!(fix.id===upgradeStorybookRelatedDependencies.id&&isLatest===!1&&fixId!==upgradeStorybookRelatedDependencies.id)),fixes=fixId?selectedFixes.filter(f=>f.id===fixId):selectedFixes;if(fixId&&fixes.length===0)return
|
|
592
|
-
${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_failed";}if(result){let promptType=typeof f.promptType=="function"?await f.promptType(result):f.promptType??"auto";
|
|
593
|
-
\u{1F50E} found a '${chalk15.cyan(f.id)}' migration:`);let message=f.prompt(result),getTitle=()=>{switch(promptType){case"auto":return "Automigration detected";case"manual":return "Manual migration detected";case"notification":return "Migration notification"}};
|
|
597
|
+
`);},doAutomigrate=async options=>{let packageManager=JsPackageManagerFactory.getPackageManager({force:options.packageManager}),[packageJson,storybookVersion]=await Promise.all([packageManager.retrievePackageJson(),getCoercedStorybookVersion(packageManager)]),{configDir:inferredConfigDir,mainConfig:mainConfigPath}=getStorybookInfo(packageJson,options.configDir),configDir=options.configDir||inferredConfigDir||".storybook";if(!storybookVersion)throw new Error("Could not determine Storybook version");if(!mainConfigPath)throw new Error("Could not determine main config path");await automigrate({...options,packageManager,storybookVersion,beforeVersion:storybookVersion,mainConfigPath,configDir,isUpgrade:!1,isLatest:!1})&&await doctor({configDir,packageManager:options.packageManager});},automigrate=async({fixId,fixes:inputFixes,dryRun,yes,packageManager,list,configDir,mainConfigPath,storybookVersion,beforeVersion,renderer:rendererPackage,skipInstall,hideMigrationSummary=!1,isUpgrade,isLatest})=>{if(list)return logAvailableMigrations(),null;let selectedFixes=inputFixes||allFixes.filter(fix=>!(fix.id===upgradeStorybookRelatedDependencies.id&&isLatest===!1&&fixId!==upgradeStorybookRelatedDependencies.id)),fixes=fixId?selectedFixes.filter(f=>f.id===fixId):selectedFixes;if(fixId&&fixes.length===0)return logger25.info(`\u{1F4ED} No migrations found for ${chalk15.magenta(fixId)}.`),logAvailableMigrations(),null;augmentLogsToFile2(),logger25.info("\u{1F50E} checking possible migrations..");let{fixResults,fixSummary,preCheckFailure}=await runFixes({fixes,packageManager,rendererPackage,skipInstall,configDir,mainConfigPath,storybookVersion,beforeVersion,isUpgrade:!!isUpgrade,dryRun,yes});if(Object.values(fixResults).some(r=>r==="failed"||r==="check_failed")?await move(TEMP_LOG_FILE_PATH2,join(process.cwd(),LOG_FILE_NAME2),{overwrite:!0}):await remove(TEMP_LOG_FILE_PATH2),!hideMigrationSummary){let installationMetadata=await packageManager.findInstallations(["@storybook/*","storybook"]);logger25.info(),logger25.info(getMigrationSummary({fixResults,fixSummary,logFile:LOG_FILE_PATH2,installationMetadata})),logger25.info();}return cleanup2(),{fixResults,preCheckFailure}};async function runFixes({fixes,dryRun,yes,rendererPackage,skipInstall,configDir,packageManager,mainConfigPath,storybookVersion,beforeVersion,isUpgrade}){let fixResults={},fixSummary={succeeded:[],failed:{},manual:[],skipped:[]};for(let i=0;i<fixes.length;i+=1){let f=fixes[i],result;try{let{mainConfig,previewConfigPath}=await getStorybookData({configDir,packageManager});(isUpgrade&&semver.satisfies(beforeVersion,f.versionRange[0],{includePrerelease:!0})&&semver.satisfies(storybookVersion,f.versionRange[1],{includePrerelease:!0})||!isUpgrade)&&(result=await f.check({packageManager,configDir,rendererPackage,mainConfig,storybookVersion,previewConfigPath,mainConfigPath}));}catch(error){logger25.info(`\u26A0\uFE0F failed to check fix ${chalk15.bold(f.id)}`),error instanceof Error&&(logger25.error(`
|
|
598
|
+
${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_failed";}if(result){let promptType=typeof f.promptType=="function"?await f.promptType(result):f.promptType??"auto";logger25.info(`
|
|
599
|
+
\u{1F50E} found a '${chalk15.cyan(f.id)}' migration:`);let message=f.prompt(result),getTitle=()=>{switch(promptType){case"auto":return "Automigration detected";case"manual":return "Manual migration detected";case"notification":return "Migration notification"}};logger25.info(boxen(message,{borderStyle:"round",padding:1,borderColor:"#F1618C",title:getTitle()}));let runAnswer;try{if(dryRun)runAnswer={fix:!1};else if(yes)runAnswer={fix:!0},promptType==="manual"&&(fixResults[f.id]="manual_succeeded",fixSummary.manual.push(f.id));else if(promptType==="manual"){fixResults[f.id]="manual_succeeded",fixSummary.manual.push(f.id),logger25.info();let{shouldContinue}=await prompts5({type:"toggle",name:"shouldContinue",message:"Select continue once you have made the required changes, or quit to exit the migration process",initial:!0,active:"continue",inactive:"quit"},{onCancel:()=>{throw new Error}});if(!shouldContinue){fixResults[f.id]="manual_skipped";break}}else promptType==="auto"?runAnswer=await prompts5({type:"confirm",name:"fix",message:`Do you want to run the '${chalk15.cyan(f.id)}' migration on your project?`,initial:f.promptDefaultValue??!0},{onCancel:()=>{throw new Error}}):promptType==="notification"&&(runAnswer=await prompts5({type:"confirm",name:"fix",message:"Do you want to continue?",initial:!0},{onCancel:()=>{throw new Error}}));}catch{break}if(promptType==="auto")if(invariant5(runAnswer,"runAnswer must be defined if not promptOnly"),runAnswer.fix)try{invariant5(typeof f.run=="function","run method should be available in fix."),invariant5(mainConfigPath,"Main config path should be defined to run migration."),await f.run({result,packageManager,dryRun,mainConfigPath,skipInstall}),logger25.info(`\u2705 ran ${chalk15.cyan(f.id)} migration`),fixResults[f.id]="succeeded",fixSummary.succeeded.push(f.id);}catch(error){fixResults[f.id]="failed",fixSummary.failed[f.id]=error instanceof Error?error.message:"Failed to run migration",logger25.info(`\u274C error when running ${chalk15.cyan(f.id)} migration`),logger25.info(error),logger25.info();}else fixResults[f.id]="skipped",fixSummary.skipped.push(f.id);}else fixResults[f.id]=fixResults[f.id]||"unnecessary";}return {fixResults,fixSummary}}var logger26=console;async function migrate(migration,{glob:glob3,dryRun,list,rename,parser,configDir:userSpecifiedConfigDir}){if(list)listCodemods().forEach(key=>logger26.log(key));else if(migration){if(migration==="mdx-to-csf"&&!dryRun){let packageManager=JsPackageManagerFactory.getPackageManager(),[packageJson,storybookVersion]=await Promise.all([packageManager.retrievePackageJson(),getCoercedStorybookVersion(packageManager)]),{configDir:inferredConfigDir,mainConfig:mainConfigPath}=getStorybookInfo(packageJson,userSpecifiedConfigDir),configDir=userSpecifiedConfigDir||inferredConfigDir||".storybook";if(!storybookVersion)throw new Error("Could not determine Storybook version");if(!mainConfigPath)throw new Error("Could not determine main config path");await runFixes({fixes:[mdxToCSF],configDir,mainConfigPath,packageManager,storybookVersion,beforeVersion:storybookVersion,isUpgrade:!1}),await addStorybookBlocksPackage();}await runCodemod(migration,{glob:glob3,dryRun,logger:logger26,rename,parser});}else throw new Error("Migrate: please specify a migration name or --list")}async function addStorybookBlocksPackage(){let packageManager=JsPackageManagerFactory.getPackageManager(),packageJson=await packageManager.retrievePackageJson(),versionToInstall=getStorybookVersionSpecifier(await packageManager.retrievePackageJson());logger26.info('\u2705 Adding "@storybook/blocks" package'),await packageManager.addDependencies({installAsDevDependencies:!0,packageJson},[`@storybook/blocks@${versionToInstall}`]);}var excludesFalse=x=>x!==!1,blockers=()=>[import('./block-storystorev6-C2BHRNHL.mjs'),import('./block-dependencies-versions-VDCGN5AR.mjs'),import('./block-node-version-DKYGVJZQ.mjs')],segmentDivider2=`
|
|
594
600
|
|
|
595
601
|
\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
|
|
596
602
|
|
|
@@ -604,14 +610,14 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
604
610
|
|
|
605
611
|
You may want to CTRL+C to stop, and run with the latest version instead.
|
|
606
612
|
`),prelease:chalk15.yellow("This is a pre-release version.")};logger.plain(boxen([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(isPrerelease?[messages.prelease]:[]).join(`
|
|
607
|
-
`),{borderStyle:"round",padding:1,borderColor}));let results,{configDir:inferredConfigDir,mainConfig:mainConfigPath}=getStorybookInfo(packageJson,userSpecifiedConfigDir),configDir=userSpecifiedConfigDir||inferredConfigDir||".storybook",mainConfig=await loadMainConfig({configDir});if(!storybookVersion)throw new UpgradeStorybookUnknownCurrentVersionError;if(!results&&typeof mainConfig!="boolean"&&typeof mainConfigPath<"u"&&!options.force){let blockResult=await autoblock({packageManager,configDir,packageJson,mainConfig,mainConfigPath});blockResult&&(results={preCheckFailure:blockResult});}if(!dryRun&&!results){let toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>dependency in versions).map(dependency=>{let char="^";return isOutdated&&(char=""),isCanary&&(char=""),`${dependency}@${char}${versions[dependency]}`}),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);logger.info(`Updating dependencies in ${chalk15.cyan("package.json")}..`),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies();}if(!skipCheck&&!results&&mainConfigPath&&(checkVersionConsistency(),results=await automigrate({dryRun,yes,packageManager,configDir,mainConfigPath,beforeVersion,storybookVersion:currentVersion,isUpgrade:isOutdated,isLatest:isExactLatest})),!options.disableTelemetry){let{preCheckFailure,fixResults}=results||{};await telemetry("upgrade",{beforeVersion,afterVersion:currentVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}});}};async function upgrade(options){await withTelemetry("upgrade",{cliOptions:options},()=>doUpgrade(options));}var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",script:"npx -p @angular/cli@next ng new angular-v16 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},modifications:{extraDependencies:["preact-render-to-string"]},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},modifications:{extraDependencies:["preact-render-to-string"]},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"npm create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates};var logger28=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=versions["@storybook/cli"],isPrerelease=prerelease(currentVersion),isOutdated=lt(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${chalk15.bold(currentVersion)} sandbox..`,notLatest:chalk15.red(dedent`
|
|
613
|
+
`),{borderStyle:"round",padding:1,borderColor}));let results,{configDir:inferredConfigDir,mainConfig:mainConfigPath}=getStorybookInfo(packageJson,userSpecifiedConfigDir),configDir=userSpecifiedConfigDir||inferredConfigDir||".storybook",mainConfig=await loadMainConfig({configDir});if(!storybookVersion)throw new UpgradeStorybookUnknownCurrentVersionError;if(!results&&typeof mainConfig!="boolean"&&typeof mainConfigPath<"u"&&!options.force){let blockResult=await autoblock({packageManager,configDir,packageJson,mainConfig,mainConfigPath});blockResult&&(results={preCheckFailure:blockResult});}if(!dryRun&&!results){let toUpgradedDependencies=deps=>Object.keys(deps||{}).filter(dependency=>dependency in versions).map(dependency=>{let char="^";return isOutdated&&(char=""),isCanary&&(char=""),`${dependency}@${char}${versions[dependency]}`}),upgradedDependencies=toUpgradedDependencies(packageJson.dependencies),upgradedDevDependencies=toUpgradedDependencies(packageJson.devDependencies);logger.info(`Updating dependencies in ${chalk15.cyan("package.json")}..`),upgradedDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!1,skipInstall:!0,packageJson},upgradedDependencies),upgradedDevDependencies.length>0&&await packageManager.addDependencies({installAsDevDependencies:!0,skipInstall:!0,packageJson},upgradedDevDependencies),await packageManager.installDependencies();}if(!skipCheck&&!results&&mainConfigPath&&(checkVersionConsistency(),results=await automigrate({dryRun,yes,packageManager,configDir,mainConfigPath,beforeVersion,storybookVersion:currentVersion,isUpgrade:isOutdated,isLatest:isExactLatest})),!options.disableTelemetry){let{preCheckFailure,fixResults}=results||{};await telemetry("upgrade",{beforeVersion,afterVersion:currentVersion,...{automigrationResults:preCheckFailure?null:fixResults,automigrationPreCheckFailure:preCheckFailure||null}});}};async function upgrade(options){await withTelemetry("upgrade",{cliOptions:options},()=>doUpgrade(options));}var baseTemplates={"cra/default-js":{name:"Create React App Latest (Webpack | JavaScript)",script:"npx create-react-app {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"cra/default-ts":{name:"Create React App Latest (Webpack | TypeScript)",script:"npx create-react-app {{beforeDir}} --template typescript",skipTasks:["smoke-test","bench"],expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"}},"nextjs/13-ts":{name:"Next.js v13.5 (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} -e https://github.com/vercel/next.js/tree/next-13/examples/hello-world && cd {{beforeDir}} && npm pkg set "dependencies.next"="^13.5.6" && yarn && git add . && git commit --amend --no-edit && cd ..',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-js":{name:"Next.js Latest (Webpack | JavaScript)",script:'yarn create next-app {{beforeDir}} --javascript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/default-ts":{name:"Next.js Latest (Webpack | TypeScript)",script:'yarn create next-app {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"nextjs/prerelease":{name:"Next.js Prerelease (Webpack | TypeScript)",script:'npx create-next-app@canary {{beforeDir}} --typescript --eslint --tailwind --app --import-alias="@/*" --src-dir',expected:{framework:"@storybook/nextjs",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{mainConfig:{features:{experimentalRSC:!0}},extraDependencies:["server-only"]},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-js":{name:"React Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template react",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"react-vite/default-ts":{name:"React Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template react-ts",expected:{framework:"@storybook/react-vite",renderer:"@storybook/react",builder:"@storybook/builder-vite"},skipTasks:["bench"]},"react-webpack/18-ts":{name:"React Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"react-webpack/17-ts":{name:"React v17 (Webpack | TypeScript)",script:'yarn create webpack5-react {{beforeDir}} --version-react="17" --version-react-dom="17"',expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-js":{name:"SolidJS Latest (Vite | JavaScript)",script:"npx degit solidjs/templates/js {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"solid-vite/default-ts":{name:"SolidJS Latest (Vite | TypeScript)",script:"npx degit solidjs/templates/ts {{beforeDir}}",expected:{framework:"storybook-solidjs-vite",renderer:"storybook-solidjs",builder:"@storybook/builder-vite"},inDevelopment:!0,skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-js":{name:"Vue v3 (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"vue3-vite/default-ts":{name:"Vue v3 (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template vue-ts",expected:{framework:"@storybook/vue3-vite",renderer:"@storybook/vue3",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-webpack/default":{name:"HTML Latest (Webpack | JavaScript)",script:"yarn create webpack5-html {{beforeDir}}",expected:{framework:"@storybook/html-webpack5",renderer:"@storybook/html",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-js":{name:"HTML Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"html-vite/default-ts":{name:"HTML Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template vanilla-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/html-vite",renderer:"@storybook/html",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-js":{name:"Svelte Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-vite/default-ts":{name:"Svelte Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template svelte-ts",expected:{framework:"@storybook/svelte-vite",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"angular-cli/prerelease":{name:"Angular CLI Prerelease (Webpack | TypeScript)",script:"npx -p @angular/cli@next ng new angular-v16 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/default-ts":{name:"Angular CLI Latest (Webpack | TypeScript)",script:"npx -p @angular/cli ng new angular-latest --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn --ssr",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"angular-cli/15-ts":{name:"Angular CLI v15 (Webpack | TypeScript)",script:"npx -p @angular/cli@15 ng new angular-v15 --directory {{beforeDir}} --routing=true --minimal=true --style=scss --strict --skip-git --skip-install --package-manager=yarn",expected:{framework:"@storybook/angular",renderer:"@storybook/angular",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-js":{name:"SvelteKit Latest (Vite | JavaScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-js --directory={{beforeDir}} --template=skeleton --types=null --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/skeleton-ts":{name:"SvelteKit Latest (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/skeleton-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --no-svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"svelte-kit/prerelease-ts":{name:"SvelteKit Prerelease (Vite | TypeScript)",script:"yarn create svelte-with-args --name=svelte-kit/prerelease-ts --directory={{beforeDir}} --template=skeleton --types=typescript --no-prettier --no-eslint --no-playwright --no-vitest --svelte5",expected:{framework:"@storybook/sveltekit",renderer:"@storybook/svelte",builder:"@storybook/builder-vite"},skipTasks:["e2e-tests-dev","bench"]},"lit-vite/default-js":{name:"Lit Latest (Vite | JavaScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"lit-vite/default-ts":{name:"Lit Latest (Vite | TypeScript)",script:'npm create vite --yes {{beforeDir}} -- --template lit-ts && cd {{beforeDir}} && echo "export default {}" > vite.config.js',expected:{framework:"@storybook/web-components-vite",renderer:"@storybook/web-components",builder:"@storybook/builder-vite"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"vue-cli/default-js":{name:"Vue CLI v3 (Webpack | JavaScript)",script:'npx -p @vue/cli vue create {{beforeDir}} --default --packageManager=yarn --force --merge && cd {{beforeDir}} && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/vue3-webpack5",renderer:"@storybook/vue3",builder:"@storybook/builder-webpack5"},skipTasks:["smoke-test","e2e-tests-dev","bench"]},"preact-vite/default-js":{name:"Preact Latest (Vite | JavaScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},modifications:{extraDependencies:["preact-render-to-string"]},skipTasks:["e2e-tests-dev","bench"]},"preact-vite/default-ts":{name:"Preact Latest (Vite | TypeScript)",script:"npm create vite --yes {{beforeDir}} -- --template preact-ts",expected:{framework:"@storybook/preact-vite",renderer:"@storybook/preact",builder:"@storybook/builder-vite"},modifications:{extraDependencies:["preact-render-to-string"]},skipTasks:["e2e-tests-dev","bench"]},"qwik-vite/default-ts":{name:"Qwik CLI Latest (Vite | TypeScript)",script:"npm create qwik basic {{beforeDir}}",inDevelopment:!0,expected:{framework:"storybook-framework-qwik",renderer:"storybook-framework-qwik",builder:"storybook-framework-qwik"},skipTasks:["e2e-tests","e2e-tests-dev","bench"]},"ember/3-js":{name:"Ember v3 (Webpack | JavaScript)",script:"npx --package ember-cli@3.28.1 ember new {{beforeDir}}",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}},"ember/default-js":{name:"Ember v4 (Webpack | JavaScript)",script:"npx --package ember-cli@4.12.1 ember new {{beforeDir}} --yarn && cd {{beforeDir}} && yarn add --dev @storybook/ember-cli-storybook && yarn build",inDevelopment:!0,expected:{framework:"@storybook/ember",renderer:"@storybook/ember",builder:"@storybook/builder-webpack5"}}},internalTemplates={"internal/react18-webpack-babel":{name:"React with Babel Latest (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}}",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},modifications:{extraDependencies:["@storybook/addon-webpack5-compiler-babel"],editAddons:addons=>[...addons,"@storybook/addon-webpack5-compiler-babel"].filter(a=>a!=="@storybook/addon-webpack5-compiler-swc")},isInternal:!0,skipTasks:["e2e-tests-dev","bench"]},"internal/react16-webpack":{name:"React 16 (Webpack | TypeScript)",script:"yarn create webpack5-react {{beforeDir}} --version-react=16 --version-react-dom=16 --version-@types/react=16 --version-@types/react-dom=16",expected:{framework:"@storybook/react-webpack5",renderer:"@storybook/react",builder:"@storybook/builder-webpack5"},skipTasks:["e2e-tests-dev","bench"],isInternal:!0},"internal/server-webpack5":{name:"Server Webpack5",script:'yarn init -y && echo "module.exports = {}" > webpack.config.js',expected:{framework:"@storybook/server-webpack5",renderer:"@storybook/server",builder:"@storybook/builder-webpack5"},isInternal:!0,skipTasks:["bench"]}},benchTemplates={"bench/react-vite-default-ts":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-webpack-18-ts":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts)",isInternal:!0,modifications:{skipTemplateStories:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-nodocs":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, no docs)",isInternal:!0,modifications:{skipTemplateStories:!0,disableDocs:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests","chromatic"]},"bench/react-vite-default-ts-test-build":{...baseTemplates["react-vite/default-ts"],name:"Bench (react-vite/default-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]},"bench/react-webpack-18-ts-test-build":{...baseTemplates["react-webpack/18-ts"],name:"Bench (react-webpack/18-ts, test-build)",isInternal:!0,modifications:{skipTemplateStories:!0,testBuild:!0},skipTasks:["e2e-tests-dev","test-runner","test-runner-dev","e2e-tests"]}},allTemplates={...baseTemplates,...internalTemplates,...benchTemplates};var logger29=console,toChoices=c=>({title:allTemplates[c].name,value:c}),sandbox=async({output:outputDirectory,filterValue,init,...options},pkg2)=>{let selectedConfig=allTemplates[filterValue],templateId=selectedConfig?filterValue:null,{packageManager:pkgMgr}=options,packageManager=JsPackageManagerFactory.getPackageManager({force:pkgMgr}),latestVersion=await packageManager.latestVersion("@storybook/cli"),nextVersion=await packageManager.latestVersion("@storybook/cli@next").catch(e=>"0.0.0"),currentVersion=versions["@storybook/cli"],isPrerelease=prerelease(currentVersion),isOutdated=lt(currentVersion,isPrerelease?nextVersion:latestVersion),borderColor=isOutdated?"#FC521F":"#F1618C",downloadType=!isOutdated&&init?"after-storybook":"before-storybook",branch=isPrerelease?"next":"main",messages={welcome:`Creating a Storybook ${chalk15.bold(currentVersion)} sandbox..`,notLatest:chalk15.red(dedent`
|
|
608
614
|
This version is behind the latest release, which is: ${chalk15.bold(latestVersion)}!
|
|
609
615
|
You likely ran the init command through npx, which can use a locally cached version, to get the latest please run:
|
|
610
616
|
${chalk15.bold("npx storybook@latest sandbox")}
|
|
611
617
|
|
|
612
618
|
You may want to CTRL+C to stop, and run with the latest version instead.
|
|
613
|
-
`),longInitTime:chalk15.yellow("The creation of the sandbox will take longer, because we will need to run init."),prerelease:chalk15.yellow("This is a pre-release version.")};if(
|
|
614
|
-
`),{borderStyle:"round",padding:1,borderColor})),!selectedConfig){let filterRegex=new RegExp(`^${filterValue||""}`,"i"),keys=Object.keys(allTemplates),choices=keys.reduce((acc,group)=>{let current=allTemplates[group];return (!filterValue||current.name.match(filterRegex)||group.match(filterRegex)||current.expected.builder.match(filterRegex)||current.expected.framework.match(filterRegex)||current.expected.renderer.match(filterRegex))&&acc.push(group),acc},[]);if(choices.length===0&&(
|
|
619
|
+
`),longInitTime:chalk15.yellow("The creation of the sandbox will take longer, because we will need to run init."),prerelease:chalk15.yellow("This is a pre-release version.")};if(logger29.log(boxen([messages.welcome].concat(isOutdated&&!isPrerelease?[messages.notLatest]:[]).concat(init&&(isOutdated||isPrerelease)?[messages.longInitTime]:[]).concat(isPrerelease?[messages.prerelease]:[]).join(`
|
|
620
|
+
`),{borderStyle:"round",padding:1,borderColor})),!selectedConfig){let filterRegex=new RegExp(`^${filterValue||""}`,"i"),keys=Object.keys(allTemplates),choices=keys.reduce((acc,group)=>{let current=allTemplates[group];return (!filterValue||current.name.match(filterRegex)||group.match(filterRegex)||current.expected.builder.match(filterRegex)||current.expected.framework.match(filterRegex)||current.expected.renderer.match(filterRegex))&&acc.push(group),acc},[]);if(choices.length===0&&(logger29.info(boxen(dedent`
|
|
615
621
|
🔎 You filtered out all templates. 🔍
|
|
616
622
|
|
|
617
623
|
After filtering all the templates with "${chalk15.yellow(filterValue)}", we found no results. Please try again with a different filter.
|
|
@@ -619,7 +625,7 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
619
625
|
Available templates:
|
|
620
626
|
${keys.map(key=>chalk15.blue`- ${key}`).join(`
|
|
621
627
|
`)}
|
|
622
|
-
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"})),process.exit(1)),choices.length===1?[templateId]=choices:(
|
|
628
|
+
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"})),process.exit(1)),choices.length===1?[templateId]=choices:(logger29.info(boxen(dedent`
|
|
623
629
|
🤗 Welcome to ${chalk15.yellow("sb sandbox")}! 🤗
|
|
624
630
|
|
|
625
631
|
Create a ${chalk15.green("new project")} to minimally reproduce Storybook issues.
|
|
@@ -628,13 +634,13 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
628
634
|
2. select a location for the reproduction, outside of your project.
|
|
629
635
|
|
|
630
636
|
After the reproduction is ready, we'll guide you through the next steps.
|
|
631
|
-
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"})),templateId=await promptSelectedTemplate(choices)),!!!(templateId??null)){
|
|
637
|
+
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"})),templateId=await promptSelectedTemplate(choices)),!!!(templateId??null)){logger29.error("Somehow we got no templates. Please rerun this command!");return}if(selectedConfig=templateId?allTemplates[templateId]:void 0,!selectedConfig)throw new Error("\u{1F6A8} Sandbox: please specify a valid template type")}let selectedDirectory=outputDirectory,outputDirectoryName=outputDirectory||templateId;if(selectedDirectory&&existsSync(`${selectedDirectory}`)&&logger29.info(`\u26A0\uFE0F ${selectedDirectory} already exists! Overwriting...`),!selectedDirectory){let{directory:directory2}=await prompts5({type:"text",message:"Enter the output directory",name:"directory",initial:outputDirectoryName??void 0,validate:async directoryName=>existsSync(directoryName)?`${directoryName} already exists. Please choose another name.`:!0},{onCancel:()=>{logger29.log("Command cancelled by the user. Exiting..."),process.exit(1);}});selectedDirectory=directory2;}invariant5(selectedDirectory);try{let templateDestination=path9.isAbsolute(selectedDirectory)?selectedDirectory:path9.join(process.cwd(),selectedDirectory);logger29.info(`\u{1F3C3} Adding ${selectedConfig.name} into ${templateDestination}`),logger29.log(`\u{1F4E6} Downloading sandbox template (${chalk15.bold(downloadType)})...`);try{let gitPath=`github:storybookjs/sandboxes/${templateId}/${downloadType}#${branch}`;if(await downloadTemplate(gitPath,{force:!0,dir:templateDestination}),(await readdir(templateDestination)).length===0){let selected=chalk15.yellow(templateId);throw new Error(dedent`
|
|
632
638
|
Template downloaded from ${chalk15.blue(gitPath)} is empty.
|
|
633
639
|
Are you use it exists? Or did you want to set ${selected} to inDevelopment first?
|
|
634
|
-
`)}if(downloadType==="before-storybook"&&init){let before=process.cwd();process.chdir(templateDestination),await doInitiate({...options},pkg2),process.chdir(before);}}catch(err){throw
|
|
640
|
+
`)}if(downloadType==="before-storybook"&&init){let before=process.cwd();process.chdir(templateDestination),await doInitiate({...options},pkg2),process.chdir(before);}}catch(err){throw logger29.error(`\u{1F6A8} Failed to download sandbox template: ${String(err)}`),err}let initMessage=init?chalk15.yellow(dedent`
|
|
635
641
|
yarn install
|
|
636
642
|
yarn storybook
|
|
637
|
-
`):`Recreate your setup, then ${chalk15.yellow("npx storybook@latest init")}`;
|
|
643
|
+
`):`Recreate your setup, then ${chalk15.yellow("npx storybook@latest init")}`;logger29.info(boxen(dedent`
|
|
638
644
|
🎉 Your Storybook reproduction project is ready to use! 🎉
|
|
639
645
|
|
|
640
646
|
${chalk15.yellow(`cd ${selectedDirectory}`)}
|
|
@@ -647,7 +653,7 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
647
653
|
3. Link to the repro repository in your issue
|
|
648
654
|
|
|
649
655
|
Having a clean repro helps us solve your issue faster! 🙏
|
|
650
|
-
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"}));}catch(error){throw
|
|
656
|
+
`.trim(),{borderStyle:"round",padding:1,borderColor:"#F1618C"}));}catch(error){throw logger29.error("\u{1F6A8} Failed to create sandbox"),error}};async function promptSelectedTemplate(choices){let{template}=await prompts5({type:"select",message:"\u{1F308} Select the template",name:"template",choices:choices.map(toChoices)},{onCancel:()=>{logger29.log("Command cancelled by the user. Exiting..."),process.exit(1);}});return template||null}var exec2=async(command2,options={},{startMessage,errorMessage,dryRun}={})=>{if(startMessage&&logger.info(startMessage),dryRun){logger.info(`
|
|
651
657
|
> ${command2}
|
|
652
658
|
`);return}return logger.info(command2),new Promise((resolve2,reject)=>{let child=spawn(command2,{...options,shell:!0,stdio:"pipe"});child.stderr.pipe(process.stdout),child.stdout.pipe(process.stdout),child.on("exit",code=>{code===0?resolve2(void 0):(logger.error(chalk15.red(`An error occurred while executing: \`${command2}\``)),errorMessage&&logger.info(errorMessage),reject(new Error(`command exited with code: ${code}: `)));});})},link=async({target,local,start})=>{let storybookDir=process.cwd();try{if((await fse.readJSON("package.json")).name!=="@storybook/root")throw new Error}catch{throw new Error("Expected to run link from the root of the storybook monorepo")}let reproDir=target,reproName=path9.basename(target);if(!local){let reprosDir=path9.join(storybookDir,"../storybook-repros");logger.info(`Ensuring directory ${reprosDir}`),await fse.ensureDir(reprosDir),logger.info(`Cloning ${target}`),await exec2(`git clone ${target}`,{cwd:reprosDir}),reproName=path9.basename(target,path9.extname(target)),reproDir=path9.join(reprosDir,reproName);}let reproPackageJson=await fse.readJSON(path9.join(reproDir,"package.json")),version=sync$2("yarn",["--version"],{cwd:reproDir,stdio:"pipe",shell:!0}).stdout.toString();if(!/^[2-4]\./.test(version)){logger.warn(`\u{1F6A8} Expected yarn 2 or higher in ${reproDir}!`),logger.warn(""),logger.warn("Please set it up with `yarn set version berry`,"),logger.warn(`then link '${reproDir}' with the '--local' flag.`);return}logger.info(`Linking ${reproDir}`),await exec2(`yarn link --all ${storybookDir}`,{cwd:reproDir}),logger.info(`Installing ${reproName}`),await exec2("yarn install",{cwd:reproDir}),reproPackageJson.devDependencies?.vite||await exec2("yarn add -D webpack-hot-middleware",{cwd:reproDir}),await exec2("yarn add @types/node@18",{cwd:reproDir}),start&&(logger.info(`Running ${reproName} storybook`),await exec2("yarn run storybook",{cwd:reproDir}));};function printError(error){instance.heading="",error instanceof Error?error.error?logger.error(error.error):error.stats&&error.stats.compilation.errors?error.stats.compilation.errors.forEach(e=>logger.plain(e)):logger.error(error):error.compilation?.errors&&error.compilation.errors.forEach(e=>logger.plain(e)),logger.line(),logger.warn(error.close?dedent`
|
|
653
659
|
FATAL broken build!, will close the process,
|
|
@@ -656,7 +662,7 @@ ${error.stack}`),fixSummary.failed[f.id]=error.message),fixResults[f.id]="check_
|
|
|
656
662
|
Broken build, fix the error above.
|
|
657
663
|
You may need to refresh the browser.
|
|
658
664
|
`),logger.line();}var dev=async cliOptions=>{process.env.NODE_ENV=process.env.NODE_ENV||"development";let readUpResult2=sync$1({cwd:__dirname});invariant5(readUpResult2,"Failed to find the closest package.json file.");let options={...cliOptions,configDir:cliOptions.configDir||"./.storybook",configType:"DEVELOPMENT",ignorePreview:!!cliOptions.previewUrl&&!cliOptions.forceBuildPreview,cache,packageJson:sync$1({cwd:__dirname})?.packageJson};await withTelemetry("dev",{cliOptions,presetOptions:options,printError},()=>buildDevStandalone(options));};var build=async cliOptions=>{let readUpResult2=sync$1({cwd:__dirname});invariant5(readUpResult2,"Failed to find the closest package.json file.");let options={...cliOptions,configDir:cliOptions.configDir||"./.storybook",outputDir:cliOptions.outputDir||"./storybook-static",ignorePreview:!!cliOptions.previewUrl&&!cliOptions.forceBuildPreview,configType:"PRODUCTION",cache:cache,packageJson:readUpResult2.packageJson};await withTelemetry("build",{cliOptions,presetOptions:options},()=>buildStaticStandalone(options));};addToGlobalContext("cliVersion",versions.storybook);var readUpResult=sync$1({cwd:__dirname});invariant5(readUpResult,"Failed to find the closest package.json file.");var pkg=readUpResult.packageJson,consoleLogger=console,command=name=>program.command(name).option("--disable-telemetry","Disable sending telemetry data",process.env.STORYBOOK_DISABLE_TELEMETRY&&process.env.STORYBOOK_DISABLE_TELEMETRY!=="false").option("--debug","Get more logs in debug mode",!1).option("--enable-crash-reports","Enable sending crash reports to telemetry data");command("init").description("Initialize Storybook into your project.").option("-f --force","Force add Storybook").option("-s --skip-install","Skip installing deps").option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager for installing deps").option("--use-pnp","Enable pnp mode for Yarn 2+").option("-p --parser <babel | babylon | flow | ts | tsx>","jscodeshift parser").option("-t --type <type>","Add Storybook for a specific project type").option("-y --yes","Answer yes to all prompts").option("-b --builder <webpack5 | vite>","Builder library").option("-l --linkable","Prepare installation for link (contributor helper)").action(options=>{initiate(options).catch(()=>process.exit(1));});command("add <addon>").description("Add an addon to your Storybook").option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager for installing dependencies").option("-s --skip-postinstall","Skip package specific postinstall config modifications").action((addonName,options)=>add(addonName,options));command("remove <addon>").description("Remove an addon from your Storybook").option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager for installing dependencies").action((addonName,options)=>withTelemetry("remove",{cliOptions:options},async()=>{await removeAddon(addonName,options),options.disableTelemetry||await telemetry("remove",{addon:addonName,source:"cli"});}));command("upgrade").description(`Upgrade your Storybook packages to v${versions.storybook}`).option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager for installing dependencies").option("-y --yes","Skip prompting the user").option("-f --force","force the upgrade, skipping autoblockers").option("-n --dry-run","Only check for upgrades, do not install").option("-s --skip-check","Skip postinstall version and automigration checks").option("-c, --config-dir <dir-name>","Directory where to load Storybook configurations from").action(async options=>upgrade(options).catch(()=>process.exit(1)));command("info").description("Prints debugging information about the local environment").action(async()=>{consoleLogger.log(chalk15.bold(`
|
|
659
|
-
Storybook Environment Info:`));let activePackageManager=(await JsPackageManagerFactory.getPackageManager()).type.replace(/\d/,""),output=await envinfo.run({System:["OS","CPU","Shell"],Binaries:["Node","Yarn","npm","pnpm"],Browsers:["Chrome","Edge","Firefox","Safari"],npmPackages:"{@storybook/*,*storybook*,sb,chromatic}",npmGlobalPackages:"{@storybook/*,*storybook*,sb,chromatic}"}),activePackageManagerLine=output.match(new RegExp(`${activePackageManager}:.*`,"i"));consoleLogger.log(output.replace(activePackageManagerLine,chalk15.bold(`${activePackageManagerLine} <----- active`)));});command("migrate [migration]").description("Run a Storybook codemod migration on your source files").option("-l --list","List available migrations").option("-g --glob <glob>","Glob for files upon which to apply the migration","**/*.js").option("-p --parser <babel | babylon | flow | ts | tsx>","jscodeshift parser").option("-n --dry-run","Dry run: verify the migration exists and show the files to which it will be applied").option("-r --rename <from-to>",'Rename suffix of matching files after codemod has been applied, e.g. ".js:.ts"').action((migration,{configDir,glob:glob3,dryRun,list,rename,parser})=>{migrate(migration,{configDir,glob:glob3,dryRun,list,rename,parser
|
|
665
|
+
Storybook Environment Info:`));let activePackageManager=(await JsPackageManagerFactory.getPackageManager()).type.replace(/\d/,""),output=await envinfo.run({System:["OS","CPU","Shell"],Binaries:["Node","Yarn","npm","pnpm"],Browsers:["Chrome","Edge","Firefox","Safari"],npmPackages:"{@storybook/*,*storybook*,sb,chromatic}",npmGlobalPackages:"{@storybook/*,*storybook*,sb,chromatic}"}),activePackageManagerLine=output.match(new RegExp(`${activePackageManager}:.*`,"i"));consoleLogger.log(output.replace(activePackageManagerLine,chalk15.bold(`${activePackageManagerLine} <----- active`)));});command("migrate [migration]").description("Run a Storybook codemod migration on your source files").option("-l --list","List available migrations").option("-g --glob <glob>","Glob for files upon which to apply the migration","**/*.js").option("-p --parser <babel | babylon | flow | ts | tsx>","jscodeshift parser").option("-c, --config-dir <dir-name>","Directory where to load Storybook configurations from").option("-n --dry-run","Dry run: verify the migration exists and show the files to which it will be applied").option("-r --rename <from-to>",'Rename suffix of matching files after codemod has been applied, e.g. ".js:.ts"').action((migration,{configDir,glob:glob3,dryRun,list,rename,parser})=>{migrate(migration,{configDir,glob:glob3,dryRun,list,rename,parser}).catch(err=>{logger.error(err),process.exit(1);});});command("sandbox [filterValue]").alias("repro").description("Create a sandbox from a set of possible templates").option("-o --output <outDir>","Define an output directory").option("--no-init","Whether to download a template without an initialized Storybook",!1).action((filterValue,options)=>sandbox({filterValue,...options},pkg).catch(e=>{logger.error(e),process.exit(1);}));command("link <repo-url-or-directory>").description("Pull down a repro from a URL (or a local directory), link it, and run storybook").option("--local","Link a local directory already in your file system").option("--no-start","Start the storybook",!0).action((target,{local,start})=>link({target,local,start}).catch(e=>{logger.error(e),process.exit(1);}));command("automigrate [fixId]").description("Check storybook for incompatibilities or migrations and apply fixes").option("-y --yes","Skip prompting the user").option("-n --dry-run","Only check for fixes, do not actually run them").option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager").option("-l --list","List available migrations").option("-c, --config-dir <dir-name>","Directory of Storybook configurations to migrate").option("-s --skip-install","Skip installing deps").option("--renderer <renderer-pkg-name>","The renderer package for the framework Storybook is using.").action(async(fixId,options)=>{await doAutomigrate({fixId,...options}).catch(e=>{logger.error(e),process.exit(1);});});command("doctor").description("Check Storybook for known problems and provide suggestions or fixes").option("--package-manager <npm|pnpm|yarn1|yarn2>","Force package manager").option("-c, --config-dir <dir-name>","Directory of Storybook configuration").action(async options=>{await doctor(options).catch(e=>{logger.error(e),process.exit(1);});});command("dev").option("-p, --port <number>","Port to run Storybook",str=>parseInt(str,10)).option("-h, --host <string>","Host to run Storybook").option("-c, --config-dir <dir-name>","Directory where to load Storybook configurations from").option("--https","Serve Storybook over HTTPS. Note: You must provide your own certificate information.").option("--ssl-ca <ca>","Provide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)",parseList).option("--ssl-cert <cert>","Provide an SSL certificate. (Required with --https)").option("--ssl-key <key>","Provide an SSL key. (Required with --https)").option("--smoke-test","Exit after successful start").option("--ci","CI mode (skip interactive prompts, don't open browser)").option("--no-open","Do not open Storybook automatically in the browser").option("--loglevel <level>","Control level of logging during build").option("--quiet","Suppress verbose build output").option("--no-version-updates","Suppress update check",!0).option("--debug-webpack","Display final webpack configurations for debugging purposes").option("--webpack-stats-json [directory]","Write Webpack stats JSON to disk (synonym for `--stats-json`)").option("--stats-json [directory]","Write stats JSON to disk").option("--preview-url <string>","Disables the default storybook preview and lets your use your own").option("--force-build-preview","Build the preview iframe even if you are using --preview-url").option("--docs","Build a documentation-only site using addon-docs").option("--exact-port","Exit early if the desired port is not available").option("--initial-path [path]","URL path to be appended when visiting Storybook for the first time").action(async options=>{logger.setLevel(program.loglevel),consoleLogger.log(chalk15.bold(`${pkg.name} v${pkg.version}`)+chalk15.reset(`
|
|
660
666
|
`)),getEnvConfig(options,{port:"SBCONFIG_PORT",host:"SBCONFIG_HOSTNAME",staticDir:"SBCONFIG_STATIC_DIR",configDir:"SBCONFIG_CONFIG_DIR",ci:"CI"}),parseInt(`${options.port}`,10)&&(options.port=parseInt(`${options.port}`,10)),await dev({...options,packageJson:pkg}).catch(()=>process.exit(1));});command("build").option("-o, --output-dir <dir-name>","Directory where to store built files").option("-c, --config-dir <dir-name>","Directory where to load Storybook configurations from").option("--quiet","Suppress verbose build output").option("--loglevel <level>","Control level of logging during build").option("--debug-webpack","Display final webpack configurations for debugging purposes").option("--webpack-stats-json [directory]","Write Webpack stats JSON to disk (synonym for `--stats-json`)").option("--stats-json [directory]","Write stats JSON to disk").option("--preview-url <string>","Disables the default storybook preview and lets your use your own").option("--force-build-preview","Build the preview iframe even if you are using --preview-url").option("--docs","Build a documentation-only site using addon-docs").option("--test","Build stories optimized for testing purposes.").action(async options=>{process.env.NODE_ENV=process.env.NODE_ENV||"production",logger.setLevel(program.loglevel),consoleLogger.log(chalk15.bold(`${pkg.name} v${pkg.version}
|
|
661
667
|
`)),getEnvConfig(options,{staticDir:"SBCONFIG_STATIC_DIR",outputDir:"SBCONFIG_OUTPUT_DIR",configDir:"SBCONFIG_CONFIG_DIR"}),await build({...options,packageJson:pkg,test:!!options.test||process.env.SB_TESTBUILD==="true"}).catch(()=>process.exit(1));});program.on("command:*",([invalidCmd])=>{consoleLogger.error(` Invalid command: %s.
|
|
662
668
|
See --help for a list of available commands.`,invalidCmd);let suggestion=program.commands.map(cmd=>cmd._name).find(cmd=>leven(cmd,invalidCmd)<3);suggestion&&consoleLogger.info(`
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/cli",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.7",
|
|
4
4
|
"description": "Storybook's CLI - install, dev, build, upgrade, and more",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"cli",
|
|
@@ -59,14 +59,14 @@
|
|
|
59
59
|
"@babel/core": "^7.23.0",
|
|
60
60
|
"@babel/types": "^7.23.0",
|
|
61
61
|
"@ndelangen/get-tarball": "^3.0.7",
|
|
62
|
-
"@storybook/codemod": "8.0.
|
|
63
|
-
"@storybook/core-common": "8.0.
|
|
64
|
-
"@storybook/core-events": "8.0.
|
|
65
|
-
"@storybook/core-server": "8.0.
|
|
66
|
-
"@storybook/csf-tools": "8.0.
|
|
67
|
-
"@storybook/node-logger": "8.0.
|
|
68
|
-
"@storybook/telemetry": "8.0.
|
|
69
|
-
"@storybook/types": "8.0.
|
|
62
|
+
"@storybook/codemod": "8.0.7",
|
|
63
|
+
"@storybook/core-common": "8.0.7",
|
|
64
|
+
"@storybook/core-events": "8.0.7",
|
|
65
|
+
"@storybook/core-server": "8.0.7",
|
|
66
|
+
"@storybook/csf-tools": "8.0.7",
|
|
67
|
+
"@storybook/node-logger": "8.0.7",
|
|
68
|
+
"@storybook/telemetry": "8.0.7",
|
|
69
|
+
"@storybook/types": "8.0.7",
|
|
70
70
|
"@types/semver": "^7.3.4",
|
|
71
71
|
"@yarnpkg/fslib": "2.10.3",
|
|
72
72
|
"@yarnpkg/libzip": "2.3.0",
|