免责声明

由于此信息是自动生成的，可能存在不准确的情况。
要解决 /virtual:/@storybook/builder-vite/setup-addons.js 和 /virtual:/@storybook/builder-vite/vite-app.js 源Map中缺失源文件的问题，请按照以下步骤操作：

1. 检查 Vite 配置:确保 vite-config.ts 中的 Vite 配置正确处理了源Map。

// vite-config.ts
export async function commonConfig(options: Options, _type: PluginConfigType): Promise<ViteInlineConfig> {
  const configEnv = _type === 'development' ? configEnvServe : configEnvBuild;
  const { loadConfigFromFile, mergeConfig } = await import('vite');

  const { viteConfigPath } = await getBuilderOptions<BuilderOptions>(options);
  const projectRoot = path.resolve(options.configDir, '..');

  const { config: { build: buildProperty = undefined, ...userConfig } = {} } =
    (await loadConfigFromFile(configEnv, viteConfigPath, projectRoot)) ?? {};

  const sbConfig: InlineConfig = {
    configFile: false,
    cacheDir: resolvePathInStorybookCache('sb-vite', options.cacheKey),
    root: projectRoot,
    base: './',
    plugins: await pluginConfig(options),
    resolve: {
      conditions: ['storybook', 'stories', 'test', 'browser', 'import', 'module', 'default'],
      preserveSymlinks: isPreservingSymlinks(),
      alias: {
        assert: require.resolve('browser-assert'),
      },
    },
    envPrefix: userConfig.envPrefix ? ['STORYBOOK_'] : ['VITE_', 'STORYBOOK_'],
    build: {
      target: buildProperty?.target,
      sourcemap: true, // Ensure sourcemap is enabled
    },
  };

  const config: ViteConfig = mergeConfig(userConfig, sbConfig);

  return config;
}

1. 验证插件设置:确保 pluginConfig 中使用的插件正确处理了源Map。

// vite-config.ts
export async function pluginConfig(options: Options) {
  const frameworkName = await getFrameworkName(options);
  const build = await options.presets.apply('build');

  const externals: Record<string, string> = globalsNameReferenceMap;

  if (build?.test?.disableBlocks) {
    externals['@storybook/blocks'] = '__STORYBOOK_BLOCKS_EMPTY_MODULE__';
  }

  const plugins = [
    codeGeneratorPlugin(options),
    await csfPlugin(options),
    await injectExportOrderPlugin(),
    await stripStoryHMRBoundary(),
    {
      name: 'storybook:allow-storybook-dir',
      enforce: 'post',
      config(config) {
        if (config?.server?.fs?.allow) {
          config.server.fs.allow.push('.storybook');
        }
      },
    },
    await externalGlobalsPlugin(externals),
    pluginWebpackStats({ workingDir: process.cwd() }),
  ] as PluginOption[];

  if (frameworkName === '@storybook/glimmerx-vite') {
    const plugin = require('vite-plugin-glimmerx/index.cjs');
    plugins.push(plugin.default());
  }

  return plugins;
}

1. 更新 index.ts:确保 Vite 服务器正确配置以处理源Map。

// index.ts
export const start: ViteBuilder['start'] = async ({ startTime, options, router, server: devServer }) => {
  server = await createViteServer(options as Options, devServer);

  const previewResolvedDir = join(corePath, 'dist/preview');
  const previewDirOrigin = previewResolvedDir;

  router.use(`/sb-preview`, express.static(previewDirOrigin, { immutable: true, maxAge: '5m' }));
  router.use(iframeMiddleware(options as Options, server));
  router.use(server.middlewares);

  return {
    bail,
    stats: {
      toJson: () => {
        throw new NoStatsForViteDevError();
      },
    },
    totalTime: process.hrtime(startTime),
  };
};

这些更改应确保正确生成源Map并指向正确的源文件。

参考文献

/code/builders/builder-vite/src/index.ts
/code/builders/builder-vite/src/vite-config.ts
/code/builders/builder-vite
/code/builders

关于 Greptile

此响应为您提供了一个研究起点，而非精确解决方案。
帮助我们改进！如果这有帮助，请留下一个 👍，如果无关紧要，请留下一个 👎。

今天从8.0.4升级到8.2.4,现在遇到了这个问题。

Sourcemap for "/virtual:/@storybook/builder-vite/setup-addons.js" points to missing source files
Sourcemap for "/virtual:/@storybook/builder-vite/vite-app.js" points to missing source files
Sourcemap for "/Users/kerry/dev/some-design-worktree/components/projects/components/node_modules/.cache/storybook/c698b8ade20774e74879ccaec4f97d28db2fdf6f7fb93649c7d24018c42360de/sb-vite/deps/chunk-4UF4PDC3.js" points to missing source files

...等等
@valentinpalkovic认为我在这里遇到的文档错误与丢失的源文件无关，所以在这里不强调它。我猜测这导致了我的parameters.docs.source.transform的code参数未定义，基本上在我的任何组件的文档页面上都会出现以下错误：

Loic57,你能在Stencil中创建另一个与你的HMR问题相关的GitHub问题吗？

@kerryj89 我认为您的问题与丢失源文件的问题无关。您能创建另一个GitHub问题吗？

今天升级到8.2.4后，我遇到了同样的问题。
"/virtual:/@storybook/builder-vite/setup-addons.js"的源Map指向缺失的源文件。
"/virtual:/@storybook/builder-vite/vite-app.js"的源Map指向缺失的源文件。
所以我降级回了7.6.20版本。

除了在终端中出现一个讨厌的警告之外，Storybook仍然可以正常工作。我不建议仅仅因为这个原因就降级。你可以升级到8.1.11版本，这个版本不包含这个问题。

我也遇到了相同的错误。

复现步骤：

1. 1. yarn create vue
2. 1. yarn dlx storybook init

复现仓库：

https://github.com/issue-reproduction/vue-vite-storybook-issue/tree/yarn/nodeLinker-node-modules

"vue": "^3.4.31",
"storybook": "^8.2.4",
"vite": "^5.3.4",
"@vitejs/plugin-vue": "^5.0.5"

完整日志：
yarn storybook dev -p 6006

D:\Code\issue\vue-vite-storybook-issue>yarn storybook dev -p 6006
storybook v8.2.4

info => Starting manager..
info => Starting preview..
╭───────────────────────────────────────────────────╮
│                                                   │
│   Storybook 8.2.4 for vue3-vite started           │
│   411 ms for manager and 672 ms for preview       │
│                                                   │
│    Local:            http://localhost:6006/       │
│    On your network:  http://192.168.1.20:6006/    │
│                                                   │
╰───────────────────────────────────────────────────╯
Sourcemap for "/virtual:/@storybook/builder-vite/setup-addons.js" points to missing source files
Sourcemap for "/virtual:/@storybook/builder-vite/vite-app.js" points to missing source files

yarn storybook build

D:\Code\issue\vue-vite-storybook-issue>yarn storybook build
storybook v8.2.4

info => Cleaning outputDir: storybook-static
info => Loading presets
info => Building manager..
info => Manager built (221 ms)
info => Building preview..
vite v5.3.4 building for production...
node_modules/telejson/dist/index.mjs (1413: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 (1416: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.
node_modules/@storybook/vue3/dist/entry-preview-docs.mjs (9:1345): Use of eval in "node_modules/@storybook/vue3/dist/entry-preview-docs.mjs" is strongly discouraged as it poses security risks and may cause issues with minification.
✓ 497 modules transformed.
storybook-static/assets/context-C0qIqeS4.png                   6.12 kB
storybook-static/assets/styling-Bk6zjRzU.png                   7.24 kB
storybook-static/iframe.html                                  16.36 kB │ gzip:   4.44 kB
storybook-static/assets/docs---vsFbMi.png                     27.88 kB
storybook-static/assets/share-DGA-UcQf.png                    40.77 kB
storybook-static/assets/accessibility-W_h2acOZ.png            42.34 kB
storybook-static/assets/figma-plugin-CH2hELiO.png             44.25 kB
storybook-static/assets/theming-D6WJLNoW.png                  44.37 kB
storybook-static/assets/testing-cbzR9l9r.png                  49.31 kB
storybook-static/assets/addon-library-BWUCAmyN.png           467.37 kB
storybook-static/assets/Header-BjLH3naM.css                    0.51 kB │ gzip:   0.30 kB
storybook-static/assets/Button-BfyGbg8N.css                    0.52 kB │ gzip:   0.29 kB
storybook-static/assets/Page-B9ntr4df.css                      0.93 kB │ gzip:   0.40 kB
storybook-static/assets/preview-BnWGZYux.js                    0.07 kB │ gzip:   0.08 kB
storybook-static/assets/preview-CIRcjyVj.js                    0.11 kB │ gzip:   0.11 kB
storybook-static/assets/preview-DE7p7AzZ.js                    0.16 kB │ gzip:   0.16 kB
storybook-static/assets/index-BoSSb2R6.js                      0.26 kB │ gzip:   0.18 kB
storybook-static/assets/index-CjvHkRZd.js                      0.39 kB │ gzip:   0.26 kB
storybook-static/assets/preview-BJPLiuSt.js                    0.64 kB │ gzip:   0.45 kB
storybook-static/assets/preview-BpcF_O6y.js                    0.71 kB │ gzip:   0.50 kB
storybook-static/assets/index-DrFu-skq.js                      0.77 kB │ gzip:   0.47 kB
storybook-static/assets/preview-2enRuHIs.js                    0.77 kB │ gzip:   0.50 kB
storybook-static/assets/Header.stories-BGlEp0Gs.js             1.02 kB │ gzip:   0.52 kB
storybook-static/assets/Button.stories-C57JHs79.js             1.56 kB │ gzip:   0.58 kB
storybook-static/assets/Header-DHOsF23d.js                     1.60 kB │ gzip:   0.89 kB
storybook-static/assets/index-Dym7vi56.js                      1.68 kB │ gzip:   0.85 kB
storybook-static/assets/DocsRenderer-PKQXORMH-DOdF88mr.js      1.78 kB │ gzip:   0.88 kB
storybook-static/assets/entry-preview-DM95eRMn.js              2.33 kB │ gzip:   1.25 kB
storybook-static/assets/index-D-8MO0q_.js                      2.58 kB │ gzip:   1.26 kB
storybook-static/assets/preview-9hFJSo5S.js                    3.20 kB │ gzip:   1.38 kB
storybook-static/assets/preview-Ct5NkTJf.js                    3.50 kB │ gzip:   1.69 kB
storybook-static/assets/Page.stories-Dks3FqcD.js               3.54 kB │ gzip:   1.68 kB
storybook-static/assets/iframe-Dly9Xvin.js                     4.54 kB │ gzip:   1.82 kB
storybook-static/assets/preview-DB9FwMii.js                    7.62 kB │ gzip:   1.56 kB
storybook-static/assets/preview-Cdum89jS.js                    8.12 kB │ gzip:   3.10 kB
storybook-static/assets/entry-preview-docs-xQ1Zq6ry.js        14.89 kB │ gzip:   5.81 kB
storybook-static/assets/Configure-CYEWVRpQ.js                 26.65 kB │ gzip:  11.53 kB
storybook-static/assets/Color-KGDBMAHA-NqxdIwus.js            30.80 kB │ gzip:  11.70 kB
storybook-static/assets/index-DZLKizrv.js                     61.57 kB │ gzip:  21.47 kB
storybook-static/assets/index-TAVom-gR.js                     80.58 kB │ gzip:  23.98 kB
storybook-static/assets/vue.esm-bundler-CMiB1aF2.js          156.87 kB │ gzip:  58.77 kB
storybook-static/assets/Button-BQ2yOadR.js                   642.77 kB │ gzip: 148.44 kB
storybook-static/assets/index-C8IehePe.js                  1,023.04 kB │ gzip: 325.85 kB

(!) Some chunks are larger than 500 kB 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 6.28s
info => Preview built (6.91 s)
info => Output directory: D:\Code\issue\vue-vite-storybook-issue\storybook-static

在使用 Yarn 4 (nodeLinker: pnpm) 时，我又遇到了另一个错误 #28620