Cannot read properties of undefined (reading 'importedBy')

[spencerchubb]

I don't know why this bug is happening, but I do know that it's related to importing the css and ts. If you comment out any of the imports in page1.html or page2.html, then it builds without error.

Minimal reproduction: https://github.com/spencerchubb/top-level-await-bug

This may be a related issue: https://github.com/Menci/vite-plugin-top-level-await/issues/32

The bug:

$ npm run build

> vite-app@0.0.0 build
> vite build --mode development --watch

vite v4.4.7 building for development...

watching for file changes...

build started...
✓ 5 modules transformed.
rendering chunks (2)...[vite-plugin-top-level-await] Cannot read properties of undefined (reading 'importedBy')

[mrhoodz]

Im also getting the same error

[PaulSender]

Seeing this when trying to build with storybook but not when building vite on its own.

 npx vite build
vite v4.4.9 building for production...
node_modules/js-sha256/src/sha256.js (83:17) Use of eval in "node_modules/js-sha256/src/sha256.js" is strongly discouraged as it poses security risks and may cause issues with minification.
node_modules/js-sha256/src/sha256.js (84:17) Use of eval in "node_modules/js-sha256/src/sha256.js" is strongly discouraged as it poses security risks and may cause issues with minification.
✓ 3831 modules transformed.
dist/assets/send-icon-24e10d67.svg            0.36 kB │ gzip:   0.27 kB
dist/index.html                               0.91 kB │ gzip:   0.44 kB
dist/assets/redPinIcon-d83470eb.svg           3.99 kB │ gzip:   1.55 kB
dist/assets/bluePinIcon-20a2b29e.svg          3.99 kB │ gzip:   1.56 kB
dist/assets/loading-spinner-e5f6af62.svg      8.23 kB │ gzip:   1.67 kB
dist/assets/index-a2f40570.css                0.50 kB │ gzip:   0.30 kB
dist/assets/CombinedApp-cb071430.css         37.94 kB │ gzip:  11.25 kB
dist/assets/LightTheme-258427ef.css         232.54 kB │ gzip:  28.55 kB
dist/assets/DarkTheme-4843b0aa.css          233.07 kB │ gzip:  28.55 kB
dist/assets/DarkTheme-3ddde8a4.js             0.39 kB │ gzip:   0.27 kB │ map:     0.68 kB
dist/assets/LightTheme-9e86e54b.js            0.39 kB │ gzip:   0.27 kB │ map:     0.68 kB
dist/assets/ChangePassword-529a25bf.js        2.11 kB │ gzip:   0.94 kB │ map:     7.05 kB
dist/assets/NewUserDialog-d417aeba.js         2.62 kB │ gzip:   0.99 kB │ map:     7.37 kB
dist/assets/vendor-fce844bd.js              162.39 kB │ gzip:  52.90 kB │ map:   469.47 kB
dist/assets/index-42c48af9.js             1,283.92 kB │ gzip: 357.39 kB │ map: 1,047.27 kB
dist/assets/CombinedApp-e37cb683.js       2,007.23 kB │ gzip: 752.76 kB │ map: 1,828.42 kB
dist/assets/eui-94b5466c.js               2,527.31 kB │ gzip: 668.79 kB │ map: 1,730.29 kB

(!) Some chunks are larger than 500 kBs after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
✓ built in 16.06s

npx storybook build
@storybook/cli v7.2.0

info => Cleaning outputDir: /storybook-static
(node:19004) Warning: Setting the NODE_TLS_REJECT_UNAUTHORIZED environment variable to '0' makes TLS connections and HTTPS requests insecure by disabling certificate verification.
(Use `node --trace-warnings ...` to show where the warning was created)
info => Loading presets
info => Building manager..
info => Manager built (141 ms)
WARN No story files found for the specified pattern: src/**/*.mdx
vite v4.4.9 building for production...

./sb-common-assets/fonts.css doesn't exist at build time, it will remain unchanged to be resolved at runtime
node_modules/telejson/dist/index.mjs (1394:15) Use of eval in "node_modules/telejson/dist/index.mjs" is strongly discouraged as it poses security risks and may cause issues with minification.
node_modules/telejson/dist/index.mjs (1397:18) Use of eval in "node_modules/telejson/dist/index.mjs" is strongly discouraged as it poses security risks and may cause issues with minification.
✓ 3068 modules transformed.
rendering chunks (85)...[vite-plugin-top-level-await] Cannot read properties of undefined (reading 'importedBy')
✓ built in 18.40s
ERR! Cannot read properties of undefined (reading 'importedBy')

Any ideas on why one would throw and error and the other wouldn't?

[msanzv]

I'm seeing the same error in my project. I migrated a storybook project from webpack to vite, and in webpack I had this config:

    webpackFinal: async (config) => {
      ((config.resolve ??= {}).plugins ??= []).push(
        new TsconfigPathsPlugin({ extensions: config.resolve.extensions }),
      );
      config.experiments = { ...config.experiments, topLevelAwait: true };
      return config;
    },

So I was looking for an alternative to that topLevelAwait flag, since it's the only thing preventing my build from working right now.

At first, I tried both of these two options, but if I understand correctly, those are just telling the build to not transpile most things, so my build was failing.

So I arrived to this plugin, tried it both with no options and with the options provided in the example (which I noticed are just the defaults), but then it gives me the same error as in the reports above.

rendering chunks (346)...[vite-plugin-top-level-await] Cannot read properties of undefined (reading 'importedBy')
✓ built in 35.33s
TypeError: Cannot read properties of undefined (reading 'importedBy')
    at ./node_modules/vite-plugin-top-level-await/dist/bundle-info.js:64:44
    at Array.forEach (<anonymous>)
    at parseBundleInfo (./node_modules/vite-plugin-top-level-await/dist/bundle-info.js:63:29)
    at Object.generateBundle (./node_modules/vite-plugin-top-level-await/dist/index.js:87:72)
    at async Bundle.generate (file://./node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:17848:9)
    at async file://./node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:26694:27
    at async catchUnfinishedHookActions (file://./node_modules/vite/node_modules/rollup/dist/es/shared/node-entry.js:25827:16)
    at async Module.build (file://./node_modules/vite/dist/node/chunks/dep-df561101.js:48011:22)
    at async build (./node_modules/@storybook/builder-vite/dist/index.js:159:11024)
    at async Promise.all (index 0)
    at async Module.build2 (./node_modules/@storybook/builder-vite/dist/index.js:159:13356)
    at async Promise.all (index 0)
    at async buildStaticStandalone (./node_modules/@storybook/core-server/dist/index.js:97:4608)
    at async withTelemetry (./node_modules/@storybook/core-server/dist/index.js:101:4155)
    at async build (./node_modules/@storybook/cli/dist/generate.js:473:1059)
    at async Command.<anonymous> (./node_modules/@storybook/cli/dist/generate.js:476:125)

Any idea on why this happens or what else could I try? I looked into the code of this plugin but didn't find more options I could try. I could try offering an example reproduction repo, but I've seen other's provide one in issue #32 and apparently that didn't work out. Thanks in advance!

[msmp1]

I ran into the same error but couldn't find a fix. A workaround I have is to skip adding this plugin when building for Storybook: In vite.config:

plugins: [
    ...(process.env.STORYBOOK ? [] : [topLevelAwait()])
]

Run script with STORYBOOK=true storybook build.

This will at least move you past the error until a good fix is found.

[Menci]

@spencerchubb Even without this plugin, your project builds an import to a non-existing file... I have no idea of how it could happen...

I'll workaround it in my plugin by ignoring non-existing files when processing. But I'm not sure whether it could lead to other issues...