带有craco的故事书-叫一个不同版本的react-scripts

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了带有craco的故事书-叫一个不同版本的react-scripts相关的知识,希望对你有一定的参考价值。

故事书当前正在调用react-scripts。但是,我用craco覆盖了CRA配置的某些部分。这意味着我的应用程序是用craco ...而不是react-scripts ...调用的。

是否有一个干净的解决方案让Storybook调用craco

答案

我想出的解决方案是这个:

。storybook / main.js:

const path = require('path');

module.exports = {
  stories: ['../src/**/*.stories.js'],
  addons: [
    '@storybook/preset-create-react-app',
    '@storybook/addon-actions',
    '@storybook/addon-links',
    '@storybook/addon-viewport/register',
    '@storybook/addon-knobs/register',
  ],
  webpackFinal(config, { configType }) {
    return {
      ...config,
      resolve: {
        alias: {
          ...config.resolve.alias,
          '~': path.resolve(__dirname, '../src/'),
        },
      },
    };
  },
};

我只在我的craco文件中使用了别名功能,因此在这里我从Storybook覆盖了webpack的配置,只添加了alias参数。对于您的情况,您需要添加自己的配置。

以上是关于带有craco的故事书-叫一个不同版本的react-scripts的主要内容,如果未能解决你的问题,请参考以下文章

带有 Tailwind 和 Emotion 设置的故事书

故事书行动——他们到底在叫啥?

未找到带有故事书模块的 CSS 模块

为故事书和制作构建的不同依赖项集

React项目框架搭建(CRA版本搭建)一

在每个故事的故事书中应用不同的主题