如何禁用故事书的webpack的eslint-loader？

Question

我想禁用故事书的webpack的eslint-loader，因为我使用其他过程来验证代码的质量。

我知道存在关于故事书的webpack配置，如下面的代码，也许我可以在config.rules上使用一些过滤器，但可能不是很好：

const path = require('path')

module.exports = async ({ config }) => {
  // some modifications

  return config
}

我正在尝试搜索故事书的文档，但未找到任何相关内容。

Answer 1

我有一个类似的问题，就我而言，我正在使用create-react-app和customize-cra来禁用eslint，因为我也使用了自己的linter配置，但是我遇到了使用不同版本的Storybook的问题整理规则，并抱怨我的源代码。

然后我意识到，我可以只看custom-cra的源代码，以了解他们如何在webpack中禁用eslint并起作用。

disableEsLint = (e) => {
  return e.module.rules.filter(e =>
    e.use && e.use.some(e => e.options && void 0 !== e.options.useEslintrc)).forEach(s => {
      e.module.rules = e.module.rules.filter(e => e !== s)
    }), e
}

module.exports = function ({ config }) {
  // Same config, except it is missing the eslint rule
  config = disableEsLint(config);

  // Do any thing else you want here
  config.module.rules.unshift({
    test: /\.story\.tsx?$/,
    loaders: [
      {
        loader: require.resolve('@storybook/addon-storysource/loader'),
        options: { parser: 'typescript' },
      },
    ],
    enforce: 'pre',
  });

  // return the new config
  return config;
};

我不确定这是否适合您的情况，但值得尝试。

其他建议是尝试在webpack中控制台日志配置，找到规则的名称和config.module.rules.delete('your-rule-name')

就我而言，规则没有名称，或者我找不到它。