histoire icon indicating copy to clipboard operation
histoire copied to clipboard

date-fns-tz doesn't work with Histoire

Open did opened this issue 5 months ago • 0 comments

Describe the bug

I described the issue and the solution here: https://github.com/marnusw/date-fns-tz/issues/299

When building my stories in a brand new Nuxt app embedding the date-fns-tz lib, I got this error:

Error while collecting story /Users/foo/hello-world/components/HelloWord.story.vue:
Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/Users/foo/hello-world/node_modules/date-fns-tz/dist/esm' is not supported resolving ES modules imported from /Users/foo/hello-world/node_modules/vite-node/dist/client.mjs
Did you mean to import "/Users/foo/hello-world/node_modules/date-fns-tz/dist/esm/index.js"?
    at finalizeResolution (node:internal/modules/esm/resolve:259:11)
    at moduleResolve (node:internal/modules/esm/resolve:933:10)
    at defaultResolve (node:internal/modules/esm/resolve:1157:11)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:390:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:359:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:234:38)
    at ModuleLoader.import (node:internal/modules/esm/loader:322:34)
    at importModuleDynamically (node:internal/modules/esm/translators:160:35)
    at importModuleDynamicallyCallback (node:internal/modules/esm/utils:225:14)
    at ViteNodeRunner.importExternalModule (file:///Users/foo/hello-world/node_modules/vite-node/dist/client.mjs:357:5)
    ```
    
  The `viteNodeInlineDeps` trick didn't help.

### Reproduction

1. generate a brand Nuxt app
2. add the `date-fns-tz` lib
3. generate a component and its story
4. in the component, include `import { fromZonedTime } from 'date-fns-tz/fromZonedTime';` and use it in the code.
5. run `yarn story:build`

### System Info

```shell
System:
    OS: macOS 14.6.1
    CPU: (12) arm64 Apple M2 Pro
    Memory: 136.34 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v20.12.2/bin/yarn
    npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm
    pnpm: 9.1.3 - ~/.nvm/versions/node/v20.12.2/bin/pnpm
  Browsers:
    Safari: 17.6
  npmPackages:
    @histoire/plugin-nuxt: ^0.17.17 => 0.17.17 
    @histoire/plugin-vue: ^0.17.17 => 0.17.17 
    histoire: ^0.17.17 => 0.17.17

Used Package Manager

yarn

Validations

did avatar Sep 12 '24 21:09 did