首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

sort-imports

--fix命令行上的选项可以自动修复一些被这条规则反映的问题。

import语句用于导入从外部模块导出的成员(函数,对象或基元)。使用特定的成员语法:

// single - Import single member.
import myMember from "my-module.js";

// multiple - Import multiple members.
import {foo, bar} from "my-module.js";

// all - Import all members, where myModule contains all the exported bindings.
import * as myModule from "my-module.js";

导入语句也可以导入模块而不导出绑定。在模块不导出任何内容时使用,但运行自己的代码或更改全局上下文对象时使用。

// none - Import module without exported bindings.
import "my-module.js"

在声明多个导入时,导入声明的排序列表使开发人员可以更轻松地阅读代码并在稍后查找必要的导入。这个规则纯粹是一种风格问题。

规则细节

此规则检查所有导入声明并验证所有导入首先按使用的成员语法排序,然后按第一个成员或别名按字母顺序排序。

--fix命令行上的选项自动修复此规则报道一些问题:在一行上的多个构件被自动排序(例如import { b, a } from 'foo.js'校正为import { a, b } from 'foo.js'),但多行不重新排序。

选项

该规则接受一个对象,其属性为

  • ignoreCase(默认值:false
  • ignoreMemberSort(默认值:false
  • memberSyntaxSortOrder(默认:)["none", "all", "multiple", "single"]; 数组中必须存在所有4个项目,但可以更改顺序:
    • none =没有导出绑定的导入模块。
    • all =导入由导出的绑定提供的所有成员。
    • multiple =导入多个成员。
    • single =进口单个成员。

默认选项设置是:

{
    "sort-imports": ["error", {
        "ignoreCase": false,
        "ignoreMemberSort": false,
        "memberSyntaxSortOrder": ["none", "all", "multiple", "single"]
    }]
}

示例

默认设置

使用默认选项时此规则的正确代码示例:

/*eslint sort-imports: "error"*/
import 'module-without-export.js';
import * as bar from 'bar.js';
import * as foo from 'foo.js';
import {alpha, beta} from 'alpha.js';
import {delta, gamma} from 'delta.js';
import a from 'baz.js';
import b from 'qux.js';

/*eslint sort-imports: "error"*/
import a from 'foo.js';
import b from 'bar.js';
import c from 'baz.js';

/*eslint sort-imports: "error"*/
import 'foo.js'
import * as bar from 'bar.js';
import {a, b} from 'baz.js';
import c from 'qux.js';

/*eslint sort-imports: "error"*/
import {a, b, c} from 'foo.js'

使用默认选项时此规则的代码不正确的示例:

/*eslint sort-imports: "error"*/
import b from 'foo.js';
import a from 'bar.js';

/*eslint sort-imports: "error"*/
import a from 'foo.js';
import A from 'bar.js';

/*eslint sort-imports: "error"*/
import {b, c} from 'foo.js';
import {a, b} from 'bar.js';

/*eslint sort-imports: "error"*/
import a from 'foo.js';
import {b, c} from 'bar.js';

/*eslint sort-imports: "error"*/
import a from 'foo.js';
import * as b from 'bar.js';

/*eslint sort-imports: "error"*/
import {b, a, c} from 'foo.js'

ignoreCase

true规则忽略导入本地名称的区分大小写时。

此规则的错误代码示例包含以下{ "ignoreCase": true }选项:

/*eslint sort-imports: ["error", { "ignoreCase": true }]*/

import B from 'foo.js';
import a from 'bar.js';

此规则的正确代码示例包含以下{ "ignoreCase": true }选项:

/*eslint sort-imports: ["error", { "ignoreCase": true }]*/

import a from 'foo.js';
import B from 'bar.js';
import c from 'baz.js';

默认是false

ignoreMemberSort

忽略multiple成员导入声明中的成员排序。

此规则的默认代码错误代码示例{ "ignoreMemberSort": false }

/*eslint sort-imports: ["error", { "ignoreMemberSort": false }]*/
import {b, a, c} from 'foo.js'

此规则的正确代码示例包含以下{ "ignoreMemberSort": true }选项:

/*eslint sort-imports: ["error", { "ignoreMemberSort": true }]*/
import {b, a, c} from 'foo.js'

默认是false

memberSyntaxSortOrder

有四种不同的样式,默认的成员语法排序顺序是:

  • none - 导入模块没有导出的绑定。
  • all - 导入由导出的绑定提供的所有成员。
  • multiple - 导入多个成员。
  • single - 进口单一成员。

所有四个选项都必须在数组中指定,但您可以自定义它们的顺序。

此规则的默认代码错误代码示例{ "memberSyntaxSortOrder": ["none", "all", "multiple", "single"] }

/*eslint sort-imports: "error"*/
import a from 'foo.js';
import * as b from 'bar.js';

此规则的正确代码示例包含以下{ "memberSyntaxSortOrder": ['single', 'all', 'multiple', 'none'] }选项:

/*eslint sort-imports: ["error", { "memberSyntaxSortOrder": ['single', 'all', 'multiple', 'none'] }]*/

import a from 'foo.js';
import * as b from 'bar.js';

此规则的正确代码示例包含以下{ "memberSyntaxSortOrder": ['all', 'single', 'multiple', 'none'] }选项:

/*eslint sort-imports: ["error", { "memberSyntaxSortOrder": ['all', 'single', 'multiple', 'none'] }]*/

import * as foo from 'foo.js';
import z from 'zoo.js';
import {a, b} from 'foo.js';

默认是["none", "all", "multiple", "single"]

何时不使用它

此规则是一种格式化首选项,不遵循它不会对代码的质量产生负面影响。如果按字母顺序输入不是您编码标准的一部分,那么您可以禁用此规则。

相关规则

  • sort-keys
  • sort-vars

版本

此规则在ESLint 2.0.0-beta.1中引入。

资源

扫码关注腾讯云开发者

领取腾讯云代金券