denoland / deno

A modern runtime for JavaScript and TypeScript.
https://deno.com
MIT License
98.09k stars 5.4k forks source link

Support Storybook [tracking] #20610

Open birkskyum opened 1 year ago

birkskyum commented 1 year ago

Storybook - Website - GitHub

Open issues with Deno 2:

birkskyum commented 10 months ago

Error in Deno 1.40

➜ deno run -A npm:storybook@latest init
error: Uncaught TypeError: The associated stream is already closing.
    at WritableStreamDefaultWriter.close (ext:deno_web/06_streams.js:6569:9)
    at HttpsClientRequest.end (node:http:445:23)
    at Readable.<anonymous> (ext:deno_node/_stream.mjs:5374:15)
    at Object.onceWrapper (ext:deno_node/_stream.mjs:1929:32)
    at Readable.emit (ext:deno_node/_stream.mjs:1859:11)
    at endReadableNT (ext:deno_node/_stream.mjs:3648:16)
    at processTicksAndRejections (ext:deno_node/_next_tick.ts:33:15)
    at runNextTicks (ext:deno_node/_next_tick.ts:71:3)
    at eventLoopTick (ext:core/01_core.js:66:21)
birkskyum commented 7 months ago

Ran the init command with pnpx, and tried to build storybook gave error as before.

➜ DENO_FUTURE=1 deno task build-storybook
Task build-storybook storybook build
@storybook/cli v8.0.8

info => Cleaning outputDir: storybook-static
info => Loading presets
Error: Cannot find module '@storybook/builder-vite'

Installing @storybook/builder-vite with pnpm and running again gave:

➜ DENO_FUTURE=1 deno task build-storybook
Task build-storybook storybook build
@storybook/cli v8.0.8

info => Cleaning outputDir: storybook-static
info => Loading presets
info => Building manager..
Unhandled promise rejection: TypeError: The associated stream is already closing.

So basically both the init, and the following scripts in package json storybook and build-storybook all break with:

Unhandled promise rejection: TypeError: The associated stream is already closing.

birkskyum commented 2 months ago

Fails the init with deno 2 rc 2:

➜ deno run -A npm:storybook@latest init
╭──────────────────────────────────────────────────────╮
│                                                      │
│   Adding Storybook version 8.3.1 to your project..   │
│                                                      │
╰──────────────────────────────────────────────────────╯
 • Detecting project type. ✓
Installing dependencies...

npm warn ERESOLVE overriding peer dependency
npm warn ERESOLVE overriding peer dependency
npm warn ERESOLVE overriding peer dependency
npm warn ERESOLVE overriding peer dependency
npm warn ERESOLVE overriding peer dependency
npm error Cannot read properties of null (reading 'matches')
npm error A complete log of this run can be found in: /Users/admin/.npm/_logs/2024-09-18T00_08_22_605Z-debug-0.log
An error occurred while installing dependencies.
birkskyum commented 2 months ago

initializing with

gives this panic error

⇣8% ➜ deno task storybook
Task storybook storybook dev -p 6006
@storybook/core v8.3.1

============================================================
Deno has panicked. This is a bug in Deno. Please report this
at https://github.com/denoland/deno/issues/new.
If you can reliably reproduce this panic, include the
reproduction steps and re-run with the RUST_BACKTRACE=1 env
var set and include the backtrace in your report.

Platform: macos aarch64
Version: 2.0.0-rc.2+aaf2bf4
Args: ["/Users/admin/.deno/bin/deno", "run", "-A", "npm:storybook@8.3.1", "dev", "-p", "6006"]

thread 'main' panicked at /Users/runner/.cargo/registry/src/index.crates.io-6f17d22bba15001f/deno_core-0.309.0/modules/map.rs:1205:24:
internal error: entered unreachable code
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
bartlomieju commented 2 months ago

CC @devsnek looks like it's related to require(esm).

birkskyum commented 2 months ago

With the panic gone, I now see some install issue with npm:storybook-solidjs-vite module not found

➜ deno task storybook                                 
Task storybook storybook dev -p 6006
@storybook/core v8.3.1

SB_CORE-SERVER_0002 (CriticalPresetLoadError): Storybook failed to load the following preset: storybook-solidjs-vite/preset.

Please check whether your setup is correct, the Storybook dependencies (and their peer dependencies) are installed correctly and there are no package version clashes.

If you believe this is a bug, please open an issue on Github.

Error: ReferenceError: module is not defined
    at file://./node_modules/.deno/storybook-solidjs-vite@1.0.0-beta.2/node_modules/storybook-solidjs-vite/dist/preset.js:31:1
birkskyum commented 2 months ago

With deno 2 rc.6 is gives:

➜ deno task storybook           
Task storybook storybook dev -p 6006
@storybook/core v8.3.1

SB_CORE-SERVER_0002 (CriticalPresetLoadError): Storybook failed to load the following preset: storybook-solidjs-vite/preset.

Please check whether your setup is correct, the Storybook dependencies (and their peer dependencies) are installed correctly and there are no package version clashes.

If you believe this is a bug, please open an issue on Github.

Error: ReferenceError: module is not defined
    at file://./node_modules/.deno/storybook-solidjs-vite@1.0.0-beta.2/node_modules/storybook-solidjs-vite/dist/preset.js:31:1
    at loadESMFromCJS (node:module:770:21)
    at Module._compile (node:module:725:12)
    at Module._extensions..js (node:module:767:10)
    at Object.newLoader (file://./node_modules/.deno/esbuild-register@3.6.0/node_modules/esbuild-register/dist/node.js:2262:9)
    at Object.extensions..js (file://./node_modules/.deno/esbuild-register@3.6.0/node_modules/esbuild-register/dist/node.js:4833:24)
    at Module.load (node:module:665:32)
    at Function.Module._load (node:module:537:12)
    at Module.require (node:module:684:19)
    at require (node:module:808:16)
    at loadESMFromCJS (node:module:770:21)
    at Module._compile (node:module:725:12)
    at Module._extensions..js (node:module:767:10)
    at Object.newLoader (file://./node_modules/.deno/esbuild-register@3.6.0/node_modules/esbuild-register/dist/node.js:2262:9)
    at Object.extensions..js (file://./node_modules/.deno/esbuild-register@3.6.0/node_modules/esbuild-register/dist/node.js:4833:24)
    at Module.load (node:module:665:32)
    at Function.Module._load (node:module:537:12)
    at Module.require (node:module:684:19)
    at require (node:module:808:16)
    at interopRequireDefault (file://./node_modules/.deno/@storybook+core@8.3.1/node_modules/@storybook/core/dist/common/index.cjs:134633:11)

More info: 

    at loadPreset (file://./node_modules/.deno/@storybook+core@8.3.1/node_modules/@storybook/core/dist/common/index.cjs:139445:13)
    at eventLoopTick (ext:core/01_core.js:175:7)

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.
kt3k commented 1 day ago

Now I see this error while running deno task storybook. Is chromatic.config.json supposed to exist in cwd? Update: this seems to have been addressed in https://github.com/denoland/deno/pull/26632

$ deno task storybook
Task storybook storybook dev -p 6006
@storybook/core v8.4.5

NotFound: No such file or directory (os error 2): readfile 'chromatic.config.json': No such file or directory (os error 2): readfile 'chromatic.config.json': No such file or directory (os error 2)
    at Object.readFileSync (ext:deno_fs/30_fs.js:733:10)
    at Object.readFileSync (ext:deno_node/_fs/_fs_readFile.ts:52:21)
    at Object.Ooe (file://./node_modules/.deno/chromatic@11.18.1/node_modules/chromatic/dist/chunk-44ZQWA3Z.js:706:1340)
    at Object.Uir [as experimental_serverChannel] (file://./node_modules/.deno/@chromatic-com+storybook@1.9.0/node_modules/@chromatic-com/storybook/dist/preset.js:595:402)
    at file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/common/index.cjs:16512:18
    at eventLoopTick (ext:core/01_core.js:175:7)
    at async storybookDevServer (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35955:96)
    at async buildOrThrow (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35017:12)
    at async buildDevStandalone (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:37190:78)
    at async withTelemetry (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35757:12)
kt3k commented 1 day ago

Now I see the below error:

$ deno task storybook
Task storybook storybook dev -p 6006
@storybook/core v8.4.5

TypeError: g.start is not a function
    at storybookDevServer (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35974:19)
    at eventLoopTick (ext:core/01_core.js:175:7)
    at async buildOrThrow (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35017:12)
    at async buildDevStandalone (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:37190:78)
    at async withTelemetry (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs:35757:12)
    at async dev (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/cli/bin/index.cjs:2591:3)
    at async s.<anonymous> (file://./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/cli/bin/index.cjs:2643:74)
kt3k commented 1 day ago

It looks like a wrong branch of conditional exports is taken for the dynamic import import("@storybook/core/builder-manager") from ./node_modules/.deno/@storybook+core@8.4.5/node_modules/@storybook/core/dist/core-server/index.cjs (I'll create an issue for it. Update: Created https://github.com/denoland/deno/issues/27059 )

BTW if I manually modified g.start part to g.default.start, then it started the storybook server successfully and I was able to see the storybook page on the browser.