Nx Storybook(Webpack 5)“导出未定义”和无限加载

x4shl7ld  于 2022-11-13  发布在  Webpack
关注(0)|答案(1)|浏览(171)

我已经将Nx包升级到最新版本14. 7. 5,它破坏了我的Storybook构建,该构建仍在使用Webpack 4。因此,我认为将其更新到Webpack 5可能会解决该问题,迁移后,它正在成功构建,但是Storybook卡在主页面上,无限显示加载动画,(XHR调用/progress从未返回),并且在控制台中出现Uncaught ReferenceError: exports is not defined错误。此错误来自于JS中的一个生成文件(其余文件在TypeScript中)。我不确定此错误是否导致无限加载,但这是我唯一的线索。
当我静态地构建Storybook时,它在编译期间也会显示以下警告:

export 'AssetService' (reexported as 'AssetService') was not found in './protos/Asset_pb_service' (module has no exports)

它来自与控制台中的错误相同的文件,因此它可能是连接的(尽管文件有导出)。
我的主要Storybook配置:

module.exports = {
  core: {
    builder: 'webpack5',
  },
  typescript: { reactDocgen: false },
  stories: [],
  addons: [
    {
      name: '@storybook/addon-essentials',
      options: {
        backgrounds: true,
        viewport: false,
      },
    },
    '@nrwl/react/plugins/storybook',
    'storybook-dark-mode'
  ],
};

主应用程序的故事书配置:

// This loads the configuration above
const rootMain = require('../../../.storybook/main');

module.exports = {
  ...rootMain,

  core: { ...rootMain.core, builder: 'webpack5' },

  stories: [
    ...rootMain.stories,
    '../src/**/*.stories.mdx',
    '../src/**/*.stories.@(js|jsx|ts|tsx)',
    '../*.stories.mdx',
    '../../../libs/**/*.stories.mdx',
    '../../../libs/**/*.stories.@(js|jsx|ts|tsx)',
  ],
  webpackFinal: async (config, { configType }) => {
    // apply any global webpack configs that might have been specified in .storybook/main.js
    if (rootMain.webpackFinal) {
      config = await rootMain.webpackFinal(config, { configType });
    }

    // add your own webpack tweaks if needed

    return config;
  },
};

故事书软件包版本:

"@storybook/addon-docs": "6.5.12",
    "@storybook/addon-essentials": "6.5.12",
    "@storybook/builder-webpack5": "6.5.12",
    "@storybook/core-server": "6.5.12",
    "@storybook/manager-webpack5": "6.5.12",
    "@storybook/react": "6.5.12",

任何帮助都将不胜感激。

az31mfrm

az31mfrm1#

这是由preview.js引起的,它用一些提供程序 Package 每个故事,并间接导入导致错误的JS文件。看起来这个preview.js的编译方式与故事的编译方式不同,因为在将有问题的提供程序移到需要它们的故事后,Storybook又开始工作了。

**编辑:**实际上,在将有问题的提供者转移到故事中后,问题并没有消失,只是故事现在不工作了,但这总比整个故事书不工作要好。

相关问题