Support Storybook #3794

birkskyum · 2023-07-24T19:53:02Z

Storybook - Website - GitHub

What version of Bun is running?

0.7.0

What platform is your computer?

Darwin 22.5.0 arm64 arm

What steps can reproduce the bug?

First create the Vite project.

bun x create-vite@latest

✔ Project name: … vite-project
✔ Select a framework: › Solid
✔ Select a variant: › TypeScript

cd vite-project
bun i
bun --bun run dev (Check that the Vite + Solid project runs as expected)

Second init the storybook:

bun --bun x storybook@latest init

What is the expected behavior?

This is the case if ran just as bun x storybook@latest init without the --bun flag.


➜ bun --bun x storybook@latest init       

 storybook init - the simplest way to add a Storybook to your project. 

 • Detecting project type. ✓
 • Preparing to install dependencies. ✓



up to date, audited 942 packages in 1s

176 packages are looking for funding
  run `npm fund` for details

2 moderate severity vulnerabilities

To address all issues, run:
  npm audit fix

Run `npm audit` for details.
. ✓
 • Detected Vite project. Setting builder to Vite. ✓
 • Adding Storybook support to your "SolidJS" app
  ✔ Getting the correct version of 0 packages
. ✓
 • Preparing to install dependencies. ✓



up to date, audited 942 packages in 996ms

176 packages are looking for funding
  run `npm fund` for details

2 moderate severity vulnerabilities

To address all issues, run:
  npm audit fix

Run `npm audit` for details.
. ✓
╭──────────────────────────────────────────────────────────────────────────────╮
│                                                                              │
│   Storybook was successfully installed in your project! 🎉                   │
│   To run Storybook manually, run npm run storybook. CTRL+C to stop.          │
│                                                                              │
│   Wanna know more about Storybook? Check out https://storybook.js.org/       │
│   Having trouble or want to chat? Join us at https://discord.gg/storybook/   │
│                                                                              │
╰──────────────────────────────────────────────────────────────────────────────╯

Running Storybook

> [email protected] storybook
> storybook dev -p 6006 --quiet

@storybook/cli v7.1.0

info => Starting manager..

What do you see instead?

➜ bun --bun x storybook@latest init


warn: Invalid original column value
/Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:1:0 132039execa/lib/errname: unable to establish process.binding('uv') 4111 |     if (typeof r.getSystemErrorName == "function")
4112 |       e.exports = r.getSystemErrorName;
4113 |     else {
4114 |       try {
4115 | 
4116 |         if (typeof (o = process.binding("uv")).errname != "function")
                           ^
TypeError: process.binding() is not supported in Bun. If that breaks something, please file an issue and include a reproducible code sample.
      at /Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:4116:24
      at n (/Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:8:13)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:3168:119
      at n (/Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:8:13)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:3154:25
      at n (/Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:8:13)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:3141:37
      at n (/Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:8:13)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/envinfo/dist/envinfo.js:3100:12

56 |         Please check the logfile generated at ./storybook.log for troubleshooting and try again.`)}await removeLogFile()}async runRemoveDeps(dependencies){let args=[...dependencies];await this.executeCommand({command:"pnpm",args:["remove",...args,...this.getInstallArgs()],stdio:"inherit"})}async runGetVersions(packageName,fetchAllVersions){let args=[fetchAllVersions?"versions":"version","--json"],commandResult=await this.executeCommand({command:"pnpm",args:["info",packageName,...args]});try{let parsedOutput=JSON.parse(commandResult);if(parsedOutput.error)throw new Error(parsedOutput.error.summary);return parsedOutput}catch{throw new Error(`Unable to find versions of ${packageName} using pnpm`)}}mapDependencies(input){let acc={},existingVersions={},duplicatedDependencies={},items=input.reduce((curr,item)=>{let{devDependencies,dependencies,peerDependencies}=item,allDependencies={...devDependencies,...dependencies,...peerDependencies};return Object.assign(curr,allDependencies)},{}),recurse=([name,packageInfo])=>{var _a;if(!name||!name.includes("storybook"))return;let value={version:packageInfo.version,location:""};(_a=existingVersions[name])!=null&&_a.includes(value.version)||(acc[name]?acc[name].push(value):acc[name]=[value],existingVersions[name]=[...existingVersions[name]||[],value.version],existingVersions[name].length>1&&(duplicatedDependencies[name]=existingVersions[name])),packageInfo.dependencies&&Object.entries(packageInfo.dependencies).forEach(recurse)};return Object.entries(items).forEach(recurse),{dependencies:acc,duplicatedDependencies,infoCommand:"pnpm list --depth=1"}}parseErrorFromLogs(logs){let finalMessage="PNPM error",match=logs.match(PNPM_ERROR_REGEX);if(match){let[errorCode]=match;errorCode&&(finalMessage=`${finalMessage} ${errorCode}`)}return finalMessage.trim()}};var import_ts_dedent5=__toESM(require("ts-dedent")),import_find_up5=require("find-up"),import_fs6=require("fs"),import_path9=__toESM(require("path")),import_fslib=require("@yarnpkg/fslib"),import_libzip=require("@yarnpkg/libzip"),import_semver7=__toESM(require("semver"));var parsePackageData=(packageName="")=>{let[first,second,third]=packageName.trim().split("@"),version=(third||second).replace("npm:","");return{name:third?`@${second}`:first,value:{version,location:""}}};var YARN2_ERROR_REGEX=/(YN\d{4}):.*?Error:\s+(.*)/i,YARN2_ERROR_CODES={YN0000:"UNNAMED",YN0001:"EXCEPTION",YN0002:"MISSING_PEER_DEPENDENCY",YN0003:"CYCLIC_DEPENDENCIES",YN0004:"DISABLED_BUILD_SCRIPTS",YN0005:"BUILD_DISABLED",YN0006:"SOFT_LINK_BUILD",YN0007:"MUST_BUILD",YN0008:"MUST_REBUILD",YN0009:"BUILD_FAILED",YN0010:"RESOLVER_NOT_FOUND",YN0011:"FETCHER_NOT_FOUND",YN0012:"LINKER_NOT_FOUND",YN0013:"FETCH_NOT_CACHED",YN0014:"YARN_IMPORT_FAILED",YN0015:"REMOTE_INVALID",YN0016:"REMOTE_NOT_FOUND",YN0017:"RESOLUTION_PACK",YN0018:"CACHE_CHECKSUM_MISMATCH",YN0019:"UNUSED_CACHE_ENTRY",YN0020:"MISSING_LOCKFILE_ENTRY",YN0021:"WORKSPACE_NOT_FOUND",YN0022:"TOO_MANY_MATCHING_WORKSPACES",YN0023:"CONSTRAINTS_MISSING_DEPENDENCY",YN0024:"CONSTRAINTS_INCOMPATIBLE_DEPENDENCY",YN0025:"CONSTRAINTS_EXTRANEOUS_DEPENDENCY",YN0026:"CONSTRAINTS_INVALID_DEPENDENCY",YN0027:"CANT_SUGGEST_RESOLUTIONS",YN0028:"FROZEN_LOCKFILE_EXCEPTION",YN0029:"CROSS_DRIVE_VIRTUAL_LOCAL",YN0030:"FETCH_FAILED",YN0031:"DANGEROUS_NODE_MODULES",YN0032:"NODE_GYP_INJECTED",YN0046:"AUTOMERGE_FAILED_TO_PARSE",YN0047:"AUTOMERGE_IMMUTABLE",YN0048:"AUTOMERGE_SUCCESS",YN0049:"AUTOMERGE_REQUIRED",YN0050:"DEPRECATED_CLI_SETTINGS",YN0059:"INVALID_RANGE_PEER_DEPENDENCY",YN0060:"INCOMPATIBLE_PEER_DEPENDENCY",YN0061:"DEPRECATED_PACKAGE",YN0062:"INCOMPATIBLE_OS",YN0063:"INCOMPATIBLE_CPU",YN0068:"UNUSED_PACKAGE_EXTENSION",YN0069:"REDUNDANT_PACKAGE_EXTENSION",YN0071:"NM_CANT_INSTALL_EXTERNAL_SOFT_LINK",YN0072:"NM_PRESERVE_SYMLINKS_REQUIRED",YN0074:"NM_HARDLINKS_MODE_DOWNGRADED",YN0075:"PROLOG_INSTANTIATION_ERROR",YN0076:"INCOMPATIBLE_ARCHITECTURE",YN0077:"GHOST_ARCHITECTURE"},Yarn2Proxy=class extends JsPackageManager{constructor(){super(...arguments);this.type="yarn2"}getInstallArgs(){return this.installArgs||(this.installArgs=[]),this.installArgs}async initPackageJson(){await this.executeCommand({command:"yarn",args:["init"]})}getRunStorybookCommand(){return"yarn storybook"}getRunCommand(command2){return`yarn ${command2}`}runPackageCommandSync(command2,args,cwd,stdio){return this.executeCommandSync({command:"yarn",args:[command2,...args],cwd,stdio})}async runPackageCommand(command2,args,cwd){return this.executeCommand({command:"yarn",args:[command2,...args],cwd})}async findInstallations(pattern){let commandResult=await this.executeCommand({command:"yarn",args:["info","--name-only","--recursive",pattern.map(p=>`"${p}"`).join(" "),`"${pattern}"`]});try{return this.mapDependencies(commandResult)}catch{return}}async getPackageJSON(packageName,basePath=this.cwd){let pnpapiPath=(0,import_find_up5.sync)([".pnp.js",".pnp.cjs"],{cwd:basePath});if(pnpapiPath)try{let pnpApi=require(pnpapiPath),resolvedPath=await pnpApi.resolveToUnqualified(packageName,basePath,{considerBuiltins:!1}),pkgLocator=pnpApi.findPackageLocator(resolvedPath),pkg2=pnpApi.getPackageInformation(pkgLocator),zipOpenFs=new import_fslib.ZipOpenFS({libzip:(0,import_libzip.getLibzipSync)()}),virtualFs=new import_fslib.VirtualFS({baseFs:zipOpenFs}),crossFs=new import_fslib.PosixFS(virtualFs),virtualPath=import_path9.default.join(pkg2.packageLocation,"package.json");return crossFs.readJsonSync(virtualPath)}catch(error){return error.code!=="MODULE_NOT_FOUND"&&console.error("Error while fetching package version in Yarn PnP mode:",error),null}let packageJsonPath=await(0,import_find_up5.sync)(dir=>{let possiblePath=import_path9.default.join(dir,"node_modules",packageName,"package.json");return(0,import_fs6.existsSync)(possiblePath)?possiblePath:void 0},{cwd:basePath});return packageJsonPath?JSON.parse((0,import_fs6.readFileSync)(packageJsonPath,"utf-8")):null}async getPackageVersion(packageName,basePath=this.cwd){var _a;let packageJSON=await this.getPackageJSON(packageName,basePath);return packageJSON?((_a=import_semver7.default.coerce(packageJSON.version))==null?void 0:_a.version)??null:null}getResolutions(packageJson,versions){return{resolutions:{...packageJson.resolutions,...versions}}}async runInstall(){await this.executeCommand({command:"yarn",args:["install",...this.getInstallArgs()],stdio:"inherit"})}async runAddDeps(dependencies,installAsDevDependencies){let args=[...dependencies];installAsDevDependencies&&(args=["-D",...args]);let{logStream,readLogFile,moveLogFile,removeLogFile}=await createLogStream();try{await this.executeCommand({command:"yarn",args:["add",...this.getInstallArgs(),...args],stdio:["ignore",logStream,logStream]})}catch{let stdout=await readLogFile(),errorMessage=this.parseErrorFromLogs(stdout);throw await moveLogFile(),new Error(import_ts_dedent5.default`${errorMessage}
57 |         
58 |         Please check the logfile generated at ./storybook.log for troubleshooting and try again.`)}await removeLogFile()}async runRemoveDeps(dependencies){let args=[...dependencies];await this.executeCommand({command:"yarn",args:["remove",...this.getInstallArgs(),...args],stdio:"inherit"})}async runGetVersions(packageName,fetchAllVersions){let field=fetchAllVersions?"versions":"version",args=["--fields",field,"--json"],commandResult=await this.executeCommand({command:"yarn",args:["npm","info",packageName,...args]});try{return JSON.parse(commandResult)[field]}catch{throw new Error(`Unable to find versions of ${packageName} using yarn 2`)}}mapDependencies(input){let lines=input.split(`
59 | `),acc={},existingVersions={},duplicatedDependencies={};return lines.forEach(packageName=>{var _a;if(!packageName||!packageName.includes("storybook"))return;let{name,value}=parsePackageData(packageName.replaceAll('"',""));(_a=existingVersions[name])!=null&&_a.includes(value.version)||(acc[name]?acc[name].push(value):acc[name]=[value],existingVersions[name]=[...existingVersions[name]||[],value.version],existingVersions[name].length>1&&(duplicatedDependencies[name]=existingVersions[name]))}),{dependencies:acc,duplicatedDependencies,infoCommand:"yarn why"}}parseErrorFromLogs(logs){let finalMessage="YARN2 error",match=logs.match(YARN2_ERROR_REGEX);if(match){let errorCode=match[1];errorCode&&(finalMessage=`${finalMessage} ${errorCode}`);let errorType=YARN2_ERROR_CODES[errorCode];errorType&&(finalMessage=`${finalMessage} - ${errorType}`);let errorMessage=match[2];errorMessage&&(finalMessage=`${finalMessage}: ${errorMessage}`)}return finalMessage.trim()}};var import_ts_dedent6=__toESM(require("ts-dedent")),import_find_up6=require("find-up"),import_fs7=require("fs"),import_path10=__toESM(require("path")),import_semver8=__toESM(require("semver"));var YARN1_ERROR_REGEX=/^error\s(.*)$/gm,Yarn1Proxy=class extends JsPackageManager{constructor(){super(...arguments);this.type="yarn1"}getInstallArgs(){return this.installArgs||(this.installArgs=["--ignore-workspace-root-check"]),this.installArgs}async initPackageJson(){await this.executeCommand({command:"yarn",args:["init","-y"]})}getRunStorybookCommand(){return"yarn storybook"}getRunCommand(command2){return`yarn ${command2}`}runPackageCommandSync(command2,args,cwd,stdio){return this.executeCommandSync({command:"yarn",args:[command2,...args],cwd,stdio})}async runPackageCommand(command2,args,cwd){return this.executeCommand({command:"yarn",args:[command2,...args],cwd})}async getPackageJSON(packageName,basePath=this.cwd){let packageJsonPath=await(0,import_find_up6.sync)(dir=>{let possiblePath=import_path10.default.join(dir,"node_modules",packageName,"package.json");return(0,import_fs7.existsSync)(possiblePath)?possiblePath:void 0},{cwd:basePath});return packageJsonPath?JSON.parse((0,import_fs7.readFileSync)(packageJsonPath,"utf-8")):null}async getPackageVersion(packageName,basePath=this.cwd){var _a;let packageJson=await this.getPackageJSON(packageName,basePath);return packageJson?((_a=import_semver8.default.coerce(packageJson.version))==null?void 0:_a.version)??null:null}async findInstallations(pattern){let commandResult=await this.executeCommand({command:"yarn",args:["list","--pattern",pattern.map(p=>`"${p}"`).join(" "),"--recursive","--json"]});try{let parsedOutput=JSON.parse(commandResult);return this.mapDependencies(parsedOutput)}catch{return}}getResolutions(packageJson,versions){return{resolutions:{...packageJson.resolutions,...versions}}}async runInstall(){await this.executeCommand({command:"yarn",args:["install",...this.getInstallArgs()],stdio:"inherit"})}async runAddDeps(dependencies,installAsDevDependencies){let args=[...dependencies];installAsDevDependencies&&(args=["-D",...args]);let{logStream,readLogFile,moveLogFile,removeLogFile}=await createLogStream();try{await this.executeCommand({command:"yarn",args:["add",...this.getInstallArgs(),...args],stdio:["ignore",logStream,logStream]})}catch{let stdout=await readLogFile(),errorMessage=this.parseErrorFromLogs(stdout);throw await moveLogFile(),new Error(import_ts_dedent6.default`${errorMessage}
60 |         
61 |         Please check the logfile generated at ./storybook.log for troubleshooting and try again.`)}await removeLogFile()}async runRemoveDeps(dependencies){let args=[...dependencies];await this.executeCommand({command:"yarn",args:["remove",...this.getInstallArgs(),...args],stdio:"inherit"})}async runGetVersions(packageName,fetchAllVersions){let args=[fetchAllVersions?"versions":"version","--json"],commandResult=await this.executeCommand({command:"yarn",args:["info",packageName,...args]});try{let parsedOutput=JSON.parse(commandResult);if(parsedOutput.type==="inspect")return parsedOutput.data;throw new Error(`Unable to find versions of ${packageName} using yarn`)}catch{throw new Error(`Unable to find versions of ${packageName} using yarn`)}}mapDependencies(input){if(input.type==="tree"){let{trees}=input.data,acc={},existingVersions={},duplicatedDependencies={},recurse=tree=>{var _a;let{children}=tree,{name,value}=parsePackageData(tree.name);!name||!name.includes("storybook")||((_a=existingVersions[name])!=null&&_a.includes(value.version)||(acc[name]?acc[name].push(value):acc[name]=[value],existingVersions[name]=[...existingVersions[name]||[],value.version],existingVersions[name].length>1&&(duplicatedDependencies[name]=existingVersions[name])),children.forEach(recurse))};return trees.forEach(recurse),{dependencies:acc,duplicatedDependencies,infoCommand:"yarn why"}}throw new Error("Something went wrong while parsing yarn output")}parseErrorFromLogs(logs){var _a;let finalMessage="YARN1 error",match=logs.match(YARN1_ERROR_REGEX);if(match){let errorMessage=(_a=match[0])==null?void 0:_a.replace(/^error\s(.*)$/,"$1");errorMessage&&(finalMessage=`${finalMessage}: ${errorMessage}`)}return finalMessage.trim()}};var NPM_LOCKFILE="package-lock.json",PNPM_LOCKFILE="pnpm-lock.yaml",YARN_LOCKFILE="yarn.lock",JsPackageManagerFactory=class{static getPackageManager({force}={},cwd){if(force==="npm")return new NPMProxy({cwd});if(force==="pnpm")return new PNPMProxy({cwd});if(force==="yarn1")return new Yarn1Proxy({cwd});if(force==="yarn2")return new Yarn2Proxy({cwd});let yarnVersion=getYarnVersion(cwd),closestLockfilePath=(0,import_find_up7.sync)([YARN_LOCKFILE,PNPM_LOCKFILE,NPM_LOCKFILE],{cwd}),closestLockfile=closestLockfilePath&&import_node_path.default.basename(closestLockfilePath),hasNPMCommand=hasNPM(cwd),hasPNPMCommand=hasPNPM(cwd);if(yarnVersion&&(closestLockfile===YARN_LOCKFILE||!hasNPMCommand&&!hasPNPMCommand))return yarnVersion===1?new Yarn1Proxy({cwd}):new Yarn2Proxy({cwd});if(hasPNPMCommand&&closestLockfile===PNPM_LOCKFILE)return new PNPMProxy({cwd});if(hasNPMCommand)return new NPMProxy({cwd});throw new Error("Unable to find a usable package manager within NPM, PNPM, Yarn and Yarn 2")}};function hasNPM(cwd){return(0,import_cross_spawn.sync)("npm",["--version"],{cwd,shell:!0}).status===0}function hasPNPM(cwd){return(0,import_cross_spawn.sync)("pnpm",["--version"],{cwd,shell:!0}).status===0}function getYarnVersion(cwd){let yarnVersionCommand=(0,import_cross_spawn.sync)("yarn",["--version"],{cwd,shell:!0});if(yarnVersionCommand.status!==0)return;let yarnVersion=yarnVersionCommand.output.toString().replace(/,/g,"").replace(/"/g,"");return/^1\.+/.test(yarnVersion)?1:2}var import_fs_extra6=require("fs-extra"),import_node_logger2=require("@storybook/node-logger"),import_path11=__toESM(require("path")),import_prompts2=__toESM(require("prompts"));var generateStorybookBabelConfigInCWD=async()=>{let target=process.cwd();return generateStorybookBabelConfig({target})},getBabelPresets=({typescript,jsx})=>{let dependencies=["@babel/preset-env"];return typescript&&dependencies.push("@babel/preset-typescript"),jsx&&dependencies.push("@babel/preset-react"),dependencies},writeBabelConfigFile=async({location,typescript,jsx})=>{let fileLocation=location||import_path11.default.join(process.cwd(),".babelrc.json"),presets=[["@babel/preset-env",{targets:{chrome:100}}]];typescript&&presets.push("@babel/preset-typescript"),jsx&&presets.push("@babel/preset-react");let contents=JSON.stringify({sourceType:"unambiguous",presets,plugins:[]},null,2);await(0,import_fs_extra6.writeFile)(fileLocation,contents)},generateStorybookBabelConfig=async({target})=>{import_node_logger2.logger.info(`Generating the Storybook default babel config at ${target}`);let fileName=".babelrc.json",location=import_path11.default.join(target,fileName);if(await(0,import_fs_extra6.pathExists)(location)){let{overwrite}=await(0,import_prompts2.default)({type:"confirm",initial:!1,name:"overwrite",message:`${fileName} already exists. Would you like overwrite it?`});if(overwrite===!1){import_node_logger2.logger.warn("Cancelled, babel config file was NOT written to file-system.");return}}let{typescript,jsx}=await(0,import_prompts2.default)([{type:"confirm",initial:!1,name:"typescript",message:"Do you want to add the TypeScript preset?"},{type:"confirm",initial:!1,name:"jsx",message:"Do you want to add the React preset?"}]),dependencies=getBabelPresets({typescript,jsx});import_node_logger2.logger.info(`Writing file to ${location}`),await writeBabelConfigFile({location,typescript,jsx});let packageManager=JsPackageManagerFactory.getPackageManager();import_node_logger2.logger.info(`Installing dependencies (${dependencies.join(", ")})`),await packageManager.addDependencies({installAsDevDependencies:!0},dependencies)};var import_fs_extra7=__toESM(require("fs-extra")),import_ts_dedent7=require("ts-dedent"),import_detect_indent=__toESM(require("detect-indent")),import_csf_tools=require("@storybook/csf-tools"),import_prompts3=__toESM(require("prompts")),import_chalk3=__toESM(require("chalk"));var SUPPORTED_ESLINT_EXTENSIONS=["js","cjs","json"],UNSUPPORTED_ESLINT_EXTENSIONS=["yaml","yml"],findEslintFile=()=>{let filePrefix=".eslintrc",unsupportedExtension=UNSUPPORTED_ESLINT_EXTENSIONS.find(ext=>import_fs_extra7.default.existsSync(`${filePrefix}.${ext}`));if(unsupportedExtension)throw new Error(unsupportedExtension);let extension=SUPPORTED_ESLINT_EXTENSIONS.find(ext=>import_fs_extra7.default.existsSync(`${filePrefix}.${ext}`));return extension?`${filePrefix}.${extension}`:null};async function extractEslintInfo(packageManager){let allDependencies=await packageManager.getAllDependencies(),packageJson=await packageManager.retrievePackageJson(),eslintConfigFile=null;try{eslintConfigFile=findEslintFile()}catch{}let isStorybookPluginInstalled=!!allDependencies["eslint-plugin-storybook"];return{hasEslint:allDependencies.eslint||eslintConfigFile||packageJson.eslintConfig,isStorybookPluginInstalled,eslintConfigFile}}async function configureEslintPlugin(eslintFile,packageManager){var _a;if(eslintFile)if(paddedLog(`Configuring Storybook ESLint plugin at ${eslintFile}`),eslintFile.endsWith("json")){let eslintConfig=await(0,import_fs_extra7.readJson)(eslintFile),existingConfigValue=Array.isArray(eslintConfig.extends)?eslintConfig.extends:[eslintConfig.extends].filter(Boolean);eslintConfig.extends=[...existingConfigValue||[],"plugin:storybook/recommended"];let eslintFileContents=await(0,import_fs_extra7.readFile)(eslintFile,"utf8"),spaces=(0,import_detect_indent.default)(eslintFileContents).amount||2;await(0,import_fs_extra7.writeJson)(eslintFile,eslintConfig,{spaces})}else{let eslint=await(0,import_csf_tools.readConfig)(eslintFile),extendsConfig=eslint.getFieldValue(["extends"])||[],existingConfigValue=Array.isArray(extendsConfig)?extendsConfig:[extendsConfig].filter(Boolean);eslint.setFieldValue(["extends"],[...existingConfigValue||[],"plugin:storybook/recommended"]),await(0,import_csf_tools.writeConfig)(eslint)}else{paddedLog("Configuring eslint-plugin-storybook in your package.json");let packageJson=await packageManager.retrievePackageJson();await packageManager.writePackageJson({...packageJson,eslintConfig:{...packageJson.eslintConfig,extends:[...((_a=packageJson.eslintConfig)==null?void 0:_a.extends)||[],"plugin:storybook/recommended"]}})}}var suggestESLintPlugin=async()=>{let{shouldInstall}=await(0,import_prompts3.default)({type:"confirm",name:"shouldInstall",message:import_ts_dedent7.dedent`
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               ^
error: Unable to find a usable package manager within NPM, PNPM, Yarn and Yarn 2
      at getPackageManager (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:61:2635)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:94:935
      at doInitiate (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:94:820)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:111:748
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/core-server/dist/index.js:113:3664
      at withTelemetry (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/core-server/dist/index.js:113:3318)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:111:601
      at initiate (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:111:587)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:435:2437
      at listener (/Users/admin/repos/storybook-test/vite-project/node_modules/commander/index.js:426:27)
      at _parseCommand (/Users/admin/repos/storybook-test/vite-project/node_modules/commander/index.js:1002:8)
      at _dispatchSubcommand (/Users/admin/repos/storybook-test/vite-project/node_modules/commander/index.js:953:6)
      at _parseCommand (/Users/admin/repos/storybook-test/vite-project/node_modules/commander/index.js:970:6)
      at parse (/Users/admin/repos/storybook-test/vite-project/node_modules/commander/index.js:801:4)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:440:49
      at globalThis (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/dist/generate.js:440:142)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/bin/index.js:9:0
      at globalThis (/Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/cli/bin/index.js:9:0)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/storybook/index.js:3:0
      at globalThis (/Users/admin/repos/storybook-test/vite-project/node_modules/storybook/index.js:3:0)

error: "storybook" exited with code 1 (SIGHUP)

Additional information

It seems like this is a clue:

TypeError: process.binding() is not supported in Bun. If that breaks something, please file an issue and include a reproducible code sample.

But also that Storybook searched for one of error: Unable to find a usable package manager within NPM, PNPM, Yarn and Yarn 2 but isn't satisfied with Bun as a package manager.

Related links:

The text was updated successfully, but these errors were encountered:

birkskyum · 2023-08-09T21:23:49Z

This is where bun is missing:

https://github.com/storybookjs/storybook/blob/a1406c739b17607c2fd763376a9a383145bb18a7/code/lib/cli/src/js-package-manager/JsPackageManagerFactory.ts#L17

The undertaking is somewhat similar to the Nest.js work

vafanassieff · 2023-09-08T08:44:49Z

Also having issues with storybook and bun

When I run storybook dev I got the following errors :

With process.binding

storybook dev -h 0.0.0.0 -p 6006 --no-open --disable-telemetry
execa/lib/errname: unable to establish process.binding('uv') 1 | (function (bindingName){"use strict";if(bindingName==="constants")return @processBindingConstants;const issue={fs:3546,buffer:2020,natives:2254,uv:2891}[bindingName];if(issue)throw new Error(`process.binding("${bindingName}") is not implemented in Bun. Track the status & thumbs up the issue: https://github.com/oven-sh/bun/issues/${issue}`);@throwTypeError(`process.binding("${bindingName}") is not implemented in Bun. If that breaks something, please file an issue and include a reproducible code sample.`)})
                       ^
error: process.binding("uv") is not implemented in Bun. Track the status & thumbs up the issue: https://github.com/oven-sh/bun/issues/2891
      at binding (:1:20)
      at /home/user/node_modules/envinfo/dist/envinfo.js:1:0
      at n (/home/user/node_modules/envinfo/dist/envinfo.js:1:33779)
      at /home/user/node_modules/envinfo/dist/envinfo.js:1:128061
      at n (/home/user/node_modules/envinfo/dist/envinfo.js:1:33779)
      at /home/user/node_modules/envinfo/dist/envinfo.js:1:127427
      at n (/home/user/node_modules/envinfo/dist/envinfo.js:1:33779)
      at /home/user/node_modules/envinfo/dist/envinfo.js:1:126485
      at n (/home/user/node_modules/envinfo/dist/envinfo.js:1:33779)
      at /home/user/node_modules/envinfo/dist/envinfo.js:1:124600

One with zlib / brotli

TypeError: import_node_zlib.default.createBrotliDecompress is not a function. (In 'import_node_zlib.default.createBrotliDecompress()', 'import_node_zlib.default.createBrotliDecompress' is undefined)
      at /home/user/node_modules/@storybook/core-server/dist/index.js:101:36807
      at node:http:859:28

And one with module (seems related to this function in storybook code

TypeError: undefined is not an object (evaluating 'require("node:module")._extensions[".ts"]')
    at interopRequireDefault (/home/user/node_modules/@storybook/core-common/dist/index.js:31:3074)
    at serverRequire (/home/user/node_modules/@storybook/core-common/dist/index.js:36:409)
    at <anonymous> (/home/user/node_modules/@storybook/core-common/dist/index.js:49:6912)

sjwilczynski · 2023-09-08T14:53:16Z

Would love to get support for that and to be able to run tests based on composeStories API!

birkskyum · 2023-09-15T16:37:07Z

Now the storybook can be initialized with : bun --bun x storybook@latest init 🎉

But when trying to run it: bun --bun run storybook or bun --bun run build-storybook, this happens:

                                                                                      ^
TypeError: import_node_zlib.default.createBrotliDecompress is not a function. (In 'import_node_zlib.default.createBrotliDecompress()', 'import_node_zlib.default.createBrotliDecompress' is undefined)
      at /Users/admin/repos/storybook-test/vite-project/node_modules/@storybook/core-server/dist/index.js:113:35958
      at node:http:862:28
      at processTicksAndRejections (:55:76)
ERR! TypeError: undefined is not an object (evaluating 'require("module")._extensions[".ts"]')

GustavoBlaze · 2023-09-20T14:38:15Z

I could init the storybook with bun 1.0.2 but i couldn't start nor build. I got this error below 👇

Enviroment: Mac Os Ventura (13.5.2); 2,4 GHz 8-Core Intel Core i9

rene-leanix · 2023-09-22T08:55:40Z

I've encountered the missing Module._extensions when trying to use bun to run an existing Jest unit test suite, which would be a huge win until the bun test runner supports all the main Jest features (and until teams find the time to port their code).

It is one of several Node.js Module internals that are being used by multiple packages. I've also encountered the use of Module._preloadModules in ts-node.

The "public API" of node:module seems to be completely implemented already. Are there any plans to implement some of these frequently used private properties/functions as well, @birkskyum?

Should we create a new issue to track this?

linkb15 · 2023-09-24T13:30:20Z

I was writing a tutorial about Bun + Storybook + Vite React App yesterda. Seems v1.0.3 works with bun storybook command and bun build-storybook as well - I have not tried their Jest integration yet.
https://linkb.hashnode.dev/bunsh-with-react-typescript-tailwindcss-and-storybook

iRyusa · 2023-10-06T15:58:30Z

I was having same error as @birkskyum

Updated to 1.0.4 and now bunx storybook@latest init --skip-install works fine, and bun storybook run without any error 🙌

birkskyum · 2023-12-10T15:18:35Z

bun 1.0.16
Darwin 23.1.0 arm64 arm

This is what I get:

➜ bun --bun x storybook@latest init

 storybook init - the simplest way to add a Storybook to your project. 

 • Detecting project type. ✓
 • Preparing to install dependencies. ✓


 • Installing dependencies(#########⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠼ idealTree: timing idealTree Com
up to date, audited 93 packages in 638ms

9 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
. ✓
 • Adding Storybook support to your "SolidJS" app
  ✔ Getting the correct version of 10 packages
⠋ Installing Storybook dependencies
An error occurred while installing dependencies:
NPM error

Please check the logfile generated at ./storybook.log for troubleshooting and try again.

     Error: NPM error

Please check the logfile generated at ./storybook.log for troubleshooting and try again.
    at new HandledError (/private/tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:21:4074)
    at <anonymous> (/private/tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:1494:93)
    at processTicksAndRejections (:61:39)

attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://storybook.js.org/telemetry

CallMeLaNN · 2023-12-10T19:28:23Z

@birkskyum I got the same error.

I try the versions that working above and using storybook version before the comment date to see if I can reproduce the working one, but all I got, is a the same NPM Error with empty log. Our result is inconsistent.

I'm using Apple chip, arm64.

Maybe, from now on, we should write a specific version and tell the platform env etc.

CallMeLaNN · 2023-12-11T10:50:07Z

Running Storybook using bun is not an issue, while runningstorybook@latest init is just one off. So it can be done with any of this:

In a bun project, just run bunx storybook@latest init without --bun and respect shebangs
Similarly, create using npm as usual: e.g. use create-vite then npx storybook@latest init then bun install. It will migrate package-lock.json
Install Storybook manually w/o their init script.

jdalton · 2024-01-19T23:49:41Z

Is this still an issue on latest Bun? I'm unable to reproduce.

birkskyum · 2024-01-19T23:54:15Z

checked just now, and i still experience this on an apple silicon mac

bun revision 1.0.23+83f2432da

lucadibello · 2024-01-30T09:45:55Z

Same here on apple silicon using latest Bun stable release.

✗ bunx storybook@latest init

error: Unable to find a usable package manager within NPM, PNPM, Yarn and Yarn 2
      at getPackageManager (/tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:66:2664)
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:124:307
      at doInitiate (/tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:124:34)
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:145:397
      at /tmp/storybook@latest--bunx/node_modules/@storybook/core-server/dist/index.js:65:3954
      at withTelemetry (/tmp/storybook@latest--bunx/node_modules/@storybook/core-server/dist/index.js:65:3497)
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:145:258
      at initiate (/tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:145:217)
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:516:1577
      at listener (/tmp/storybook@latest--bunx/node_modules/commander/index.js:426:28)
      at _parseCommand (/tmp/storybook@latest--bunx/node_modules/commander/index.js:1002:9)
      at _dispatchSubcommand (/tmp/storybook@latest--bunx/node_modules/commander/index.js:953:7)
      at _parseCommand (/tmp/storybook@latest--bunx/node_modules/commander/index.js:970:7)
      at parse (/tmp/storybook@latest--bunx/node_modules/commander/index.js:801:5)
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/dist/generate.js:521:50
      at /tmp/storybook@latest--bunx/node_modules/@storybook/cli/bin/index.js:26:1
      at /tmp/storybook@latest--bunx/node_modules/storybook/index.js:3:1

Current version:

✗ bun --version
1.0.25

gvilums · 2024-05-02T22:54:03Z

Do you have node installed? The storybook init script is looking for a package manager, but can't find one as it only considers npm, pnpm and yarn.

birkskyum · 2024-05-08T10:34:46Z

Tried again now that storybook 8 is out (same result for react and solid):

bun 1.1.8-canary.1+3c082012b

➜ bun --bun run dev
$ vite

  VITE v5.2.11  ready in 626 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help
^C

repos/bun-kitchensink/storybook-test via 🍞 v1.1.8 via 🅒 base took 7.5s 
➜ bun --bun x storybook@latest init
╭───────────────────────────────────────────────────────╮
│                                                       │
│   Adding Storybook version 8.0.10 to your project..   │
│                                                       │
╰───────────────────────────────────────────────────────╯
 • Detecting project type. ✓
Installing dependencies...


up to date, audited 85 packages in 736ms

9 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
 • Adding Storybook support to your "SolidJS" app
  ✔ Getting the correct version of 9 packages
  ✔ Installing Storybook dependencies

     Error: Invariant failed
    at invariant (/private/tmp/bunx-501-storybook@latest/node_modules/tiny-invariant/dist/tiny-invariant.cjs.js:13:25)
    at <anonymous> (/private/tmp/bunx-501-storybook@latest/node_modules/@storybook/cli/dist/generate.js:59:11578)
    at getRendererDir (/private/tmp/bunx-501-storybook@latest/node_modules/@storybook/cli/dist/generate.js:59:11157)
    at <anonymous> (/private/tmp/bunx-501-storybook@latest/node_modules/@storybook/cli/dist/generate.js:61:3078)
    at templatePath (/private/tmp/bunx-501-storybook@latest/node_modules/@storybook/cli/dist/generate.js:61:2749)
    at <anonymous> (/private/tmp/bunx-501-storybook@latest/node_modules/@storybook/cli/dist/generate.js:61:3943)
    at processTicksAndRejections (:12:39)

attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:

And running it (works without the --bun)

➜ bun --bun run storybook
$ storybook dev -p 6006
@storybook/cli v8.0.10

ENOENT: No such file or directory
    at readFileSync (native)
    at <anonymous> (./node_modules/chromatic/dist/chunk-2FVWIO6Q.js:176:145)
    at ZZ (./node_modules/chromatic/dist/chunk-2FVWIO6Q.js:176:39)
    at <anonymous> (./node_modules/@chromatic-com/storybook/dist/preset.js:589:436)
    at $tr (./node_modules/@chromatic-com/storybook/dist/preset.js:589:275)
    at <anonymous> (./node_modules/@storybook/core-common/dist/index.js:11:1215)
    at processTicksAndRejections (:12:39)

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

error: script "storybook" exited with code 1

valentinpalkovic · 2024-06-10T09:42:12Z

Is someone interested in supporting Bun's package manager? I have created an issue in Storybook's Monorepo: storybookjs/storybook#28164

The Storybook Core Team has not planned to work on it in the next months, so this work has to be community-driven. Though, I would like to support and give guidance as much as I can.

birkskyum added the bug Something isn't working label Jul 24, 2023

robobun added the node.js Compatibility with Node.js APIs label Jul 24, 2023

paperclover mentioned this issue Sep 14, 2023

feat(runtime): add process.binding uv/natives/config + make global object properties lazy #5355

Merged

Jarred-Sumner closed this as completed in #5355 Sep 15, 2023

birkskyum reopened this Sep 15, 2023

aaronc mentioned this issue Nov 7, 2023

chore: migrate to bun regen-network/regen-web#2139

Merged

10 tasks

chenjiahan mentioned this issue Jun 4, 2024

[Bug]: Bun: Reading from "bun:test" is not handled by plugins (Unhandled scheme). web-infra-dev/rsbuild#2502

Closed

iamtatsuki05 mentioned this issue Aug 18, 2024

Install storybook iamtatsuki05/bun-vite-remix-template#1

Open

Jarred-Sumner added tracking-pkg Issues tracking support for a library or package and removed bug Something isn't working labels Aug 29, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Support Storybook #3794

Support Storybook #3794

birkskyum commented Jul 24, 2023 •

edited

Loading

birkskyum commented Aug 9, 2023 •

edited

Loading

vafanassieff commented Sep 8, 2023 •

edited

Loading

sjwilczynski commented Sep 8, 2023

birkskyum commented Sep 15, 2023 •

edited

Loading

GustavoBlaze commented Sep 20, 2023

rene-leanix commented Sep 22, 2023 •

edited

Loading

linkb15 commented Sep 24, 2023

iRyusa commented Oct 6, 2023

birkskyum commented Dec 10, 2023 •

edited

Loading

CallMeLaNN commented Dec 10, 2023

CallMeLaNN commented Dec 11, 2023

jdalton commented Jan 19, 2024

birkskyum commented Jan 19, 2024 •

edited

Loading

lucadibello commented Jan 30, 2024 •

edited

Loading

gvilums commented May 2, 2024

birkskyum commented May 8, 2024 •

edited

Loading

valentinpalkovic commented Jun 10, 2024

Support Storybook #3794

Support Storybook #3794

Comments

birkskyum commented Jul 24, 2023 • edited Loading

What version of Bun is running?

What platform is your computer?

What steps can reproduce the bug?

What is the expected behavior?

What do you see instead?

Additional information

birkskyum commented Aug 9, 2023 • edited Loading

vafanassieff commented Sep 8, 2023 • edited Loading

sjwilczynski commented Sep 8, 2023

birkskyum commented Sep 15, 2023 • edited Loading

GustavoBlaze commented Sep 20, 2023

rene-leanix commented Sep 22, 2023 • edited Loading

linkb15 commented Sep 24, 2023

iRyusa commented Oct 6, 2023

birkskyum commented Dec 10, 2023 • edited Loading

CallMeLaNN commented Dec 10, 2023

CallMeLaNN commented Dec 11, 2023

jdalton commented Jan 19, 2024

birkskyum commented Jan 19, 2024 • edited Loading

lucadibello commented Jan 30, 2024 • edited Loading

gvilums commented May 2, 2024

birkskyum commented May 8, 2024 • edited Loading

valentinpalkovic commented Jun 10, 2024

birkskyum commented Jul 24, 2023 •

edited

Loading

birkskyum commented Aug 9, 2023 •

edited

Loading

vafanassieff commented Sep 8, 2023 •

edited

Loading

birkskyum commented Sep 15, 2023 •

edited

Loading

rene-leanix commented Sep 22, 2023 •

edited

Loading

birkskyum commented Dec 10, 2023 •

edited

Loading

birkskyum commented Jan 19, 2024 •

edited

Loading

lucadibello commented Jan 30, 2024 •

edited

Loading

birkskyum commented May 8, 2024 •

edited

Loading