导出变量时如何解决ESLint的“首选默认导出”错误？

Question

在单独的validation.js文件中，导出一个名为noFutureDate的变量：

export const noFutureDate = value => {
  const userDate = value.split('-').join('');
  ...
  return userDate < now;
};

然后在组件中导入noFutureDate，如下所示：

import { noFutureDate } from '@/validation';

但是ESlint恼人地说：

错误：首选默认导出（import / prefer-default-export）位于 src / validation.js：1：1：

我知道如何在函数等中使用export default，但是在这里如何使用变量noFutureDate，如何在保持ESLint满意的情况下导出它呢？

Answer 1

只要您在规则中看到/斜杠，该规则就不会来自ESLint。

import/prefer-default-export是来自eslint-import-plugin的规则（您可能直接导入了该规则，或者您在环境中使用的某些配置也已导入了它。）

位于https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/prefer-default-export.md的此规则的文档没有特别提及为什么建议使用此规则；有些规则纯粹是出于风格方面的原因（实际上，同一插件可以让您强制执行相反的操作：https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-default-export.md）。我已经看到，命名的进口商品有更多的理由支持使用它，例如将来可以灵活地添加到出口商品中。

因此，尽管通常许多eslint规则（或由插件设置的规则）有充分的理由，但其他规则可以安全地忽略。除非某个特定于vue的插件出于与该环境有关的某种原因而推荐它（我自己不知道vue.js），否则我认为您可以放心地忽略它。

有多种方法可以忽略eslint中的规则。您可以使用inline comment禁用.eslintrc.*文件中的group of files，也可以禁用规则for your whole project。

但是，如果您确实想更改代码而不是忽略代码，或者发现它是有原因的，则可以执行以下操作：

export default value => {
  const userDate = value.split('-').join('');
  // ...
  return userDate < now;
};

以及其他文件中

import noFutureDate from '@/validation';

Answer 2

const noFutureDate = value => {
  const userDate = value.split('-').join('');
  ...
  return userDate < now;
};

export default noFutureDate;

Answer 3

export default { noFutureDate }