如何在Storybook模板中规避USELESS_ARROW_FUNC_BIND静态分析错误

以下是 Storybook 6.0 按 Args 规范编写故事的通用示例代码：

const Template = (args) => <Button {...args} />;

// 所有故事复用同一个模板逻辑
export const Primary = Template.bind({});

这种写法的问题是，Template.bind 会触发 DeepScan 静态分析的 USELESS_ARROW_FUNC_BIND 规则报错——毕竟箭头函数没有独立的 this 指向，理论上对箭头函数做 bind 操作确实没有实际意义。
之前试过绕过 bind，直接写 Primary = Template({})，结果编译直接报错，提示缺失必要的 context 参数，根本没法运行。现在需要找合规的写法规避这个 linter 校验问题。

• 优先选的兼容写法：把箭头函数模板改成普通函数声明
  DeepScan 的这条规则仅检测箭头函数的无意义 bind 操作，对普通函数的 bind 调用完全不会标记。修改后既不改变原有模板的逻辑，又能通过所有静态检测，还完全兼容 Storybook 的参数解析机制，不需要额外加规则豁免注释：

  function Template(args) {
    return <Button {...args} />
  }
  
  // 这行 bind 不会触发任何规则报错
  export const Primary = Template.bind({});
  Primary.args = {
    label: '主要按钮',
    variant: 'primary'
  }
  

  这种方式也不会出现之前直接调用模板导致的缺 context 报错，完全符合 Storybook 官方的故事编写规范，后续升级版本也不会出现兼容问题。

• 如果保留原有箭头函数写法，用单行规则屏蔽即可
  如果项目里已经统一了代码风格，所有模板都习惯用箭头函数编写，不想批量改成函数声明，只要在每处触发报错的 bind 代码行上方，加一行规则忽略注释就行，改动量极小：

  const Template = (args) => <Button {...args} />;
  
  // deepscan-disable-next-line USELESS_ARROW_FUNC_BIND
  export const Primary = Template.bind({});
  

补充说明：为什么直接写 Primary = Template({}) 会报错？
Storybook 在加载故事时，会把全局装饰器、组件参数、故事元信息等上下文统一传入导出的故事函数。如果直接调用模板函数生成组件，相当于把 Storybook 传入的上下文全部丢弃，自然会触发缺参数的编译错误。而 bind 在这里的核心作用不是绑定 this，而是生成一个和原函数逻辑一致的独立函数引用，供 Storybook 挂载对应的 args 配置，这也是静态检测规则出现误判的根本原因。

内容的提问来源于stack exchange，提问作者ianmayo