Error:

[AndreiSoroka]

Describe the bug

naiveui not working with Histoire

When I try to build (or runtime in dev) I catch the error:

> histoire build

Using 9 threads for story collection
src/components/MyTemplate/MyTemplate.story.vue 2650ms (setup:32ms, execute:16ms, run:2603ms)
src/components/MyHeader/MyHeader.story.vue 2662ms (setup:31ms, execute:16ms, run:2615ms)
(node:95318) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
Error while collecting story /Users/andreisoroka/git/other/test/src/components/MyForm/MyForm.story.vue:
/Users/andreisoroka/git/other/test/node_modules/@juggle/resize-observer/lib/utils/scheduler.js:1
import { process } from './process';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1149:20)
    at Module._compile (node:internal/modules/cjs/loader:1190:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1280:10)
    at Module.load (node:internal/modules/cjs/loader:1089:32)
    at Module._load (node:internal/modules/cjs/loader:930:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)
node:internal/process/promises:288
            triggerUncaughtException(err, true /* fromPromise */);
            ^

/Users/andreisoroka/git/other/test/node_modules/@juggle/resize-observer/lib/utils/scheduler.js:1
import { process } from './process';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1149:20)
    at Module._compile (node:internal/modules/cjs/loader:1190:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1280:10)
    at Module.load (node:internal/modules/cjs/loader:1089:32)
    at Module._load (node:internal/modules/cjs/loader:930:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

Node.js v18.14.0

Process finished with exit code 1

Reproduction

npm init vue@latest; # I use with TS
npm i -D histoire @histoire/plugin-vue;
npm i -D naive-ui

1. Create any component where you use naive-ui
2. Create story for component

full install instructions:

• vue
• histoire
• naiveui

System Info

System:
    OS: macOS 12.6
    CPU: (10) arm64 Apple M1 Pro
    Memory: 102.84 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.14.0 - /usr/local/bin/node
    npm: 9.3.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 109.0.5414.119
    Safari: 15.6.1
  npmPackages:
    @histoire/plugin-vue: ^0.15.8 => 0.15.8 
    @vitejs/plugin-vue: ^4.0.0 => 4.0.0 
    histoire: ^0.15.8 => 0.15.8 
    vite: ^4.0.0 => 4.1.2

Used Package Manager

npm

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[melishev]

@Akryum Any news?

[AndreiSoroka]

It's fun, today I tried svelte and have same problem

Error while collecting story /Users/andreisoroka/git/pet-projects/markio/src/lib/entities/TextAnalyzer/ui/LoadBook/LoadBook.story.svelte:
/Users/andreisoroka/git/pet-projects/markio/node_modules/epubjs/src/epub.js:1
import Book from "./book";
^^^^^^

SyntaxError: Cannot use import statement outside a module