如何使用 tslint 的导入排序规则对导入进行排序
How to order imports with tslint's import-ordering rule
在我的项目中使用了 tslint 的 "import-ordering" 规则
import CopyLensModal from './CopyLensModal';
import FetchStatus from '../../../../../state/generic/models/FetchStatus';
import FlexRow from '../../../../generic/components/FlexRow';
import Geofilter from '../../../../../state/geofilter/models/Geofilter';
import Input from '../../../../generic/components/Input';
import * as React from 'react';
import * as salert from 'sweetalert';
import { func } from '../../../../../types/func';
import { Iterable } from 'immutable';
import { Button } from 'react-bootstrap';
tslint 对此命令不满意并因错误而崩溃
[2, 1]: Import sources within a group must be alphabetized.
[4, 1]: Import sources within a group must be alphabetized.
This page 并没有多大帮助,我尝试以多种不同的方式放置导入但没有运气。哪个顺序是正确的?
我同意这令人困惑。问题是源字符串比较包括模块名称的 ../..
部分,因此为了安抚规则,您需要像这样对它们进行排序:
import FetchStatus from '../../../../../state/generic/models/FetchStatus';
import Geofilter from '../../../../../state/geofilter/models/Geofilter';
import FlexRow from '../../../../generic/components/FlexRow';
import Input from '../../../../generic/components/Input';
import CopyLensModal from './CopyLensModal';
该规则有两部分,可以配置为分别强制执行导入名称和来源的排序。要仅强制执行名称的顺序,您可以使用这样的配置:
"ordered-imports": [true, {
"import-sources-order": "any",
"named-imports-order": "case-insensitive"
}]
这会引发这样的导入错误:
import { A, C, B } from 'some-module';
但不会强制对模块路径等进行排序
如果没有添加空的新行作为导入组之间的分隔,也会发生此错误。
import * as fs from 'fs';
import * as os from 'os';
import * as bar from './bar';
import * as foo from './foo';
另请注意错误是否如下所示:
***(5,1): Import sources within a group must be alphabetized.***
这意味着在指定的文件中转到第 5 行并按 Enter 键在那里添加一个新的空行作为分隔符。
我这样做了,这解决了我的问题。有关此问题的更多参考,请查看此 page
在文件tslint.json
中添加
"rules": {
"ordered-imports": [false],
"object-literal-sort-keys": [false]
}
例如,文件 tslint.json
将如下所示
{
"extends": [
"tslint:recommended",
"tslint-react",
"tslint-config-prettier"
],
"linterOptions": {
"exclude": [
"config/**/*.js",
"node_modules/**/*.ts",
"coverage/lcov-report/*.js"
]
},
"rules": {
"ordered-imports": [false],
"object-literal-sort-keys": [false]
}
}
在我的项目中使用了 tslint 的 "import-ordering" 规则
import CopyLensModal from './CopyLensModal';
import FetchStatus from '../../../../../state/generic/models/FetchStatus';
import FlexRow from '../../../../generic/components/FlexRow';
import Geofilter from '../../../../../state/geofilter/models/Geofilter';
import Input from '../../../../generic/components/Input';
import * as React from 'react';
import * as salert from 'sweetalert';
import { func } from '../../../../../types/func';
import { Iterable } from 'immutable';
import { Button } from 'react-bootstrap';
tslint 对此命令不满意并因错误而崩溃
[2, 1]: Import sources within a group must be alphabetized.
[4, 1]: Import sources within a group must be alphabetized.
This page 并没有多大帮助,我尝试以多种不同的方式放置导入但没有运气。哪个顺序是正确的?
我同意这令人困惑。问题是源字符串比较包括模块名称的 ../..
部分,因此为了安抚规则,您需要像这样对它们进行排序:
import FetchStatus from '../../../../../state/generic/models/FetchStatus';
import Geofilter from '../../../../../state/geofilter/models/Geofilter';
import FlexRow from '../../../../generic/components/FlexRow';
import Input from '../../../../generic/components/Input';
import CopyLensModal from './CopyLensModal';
该规则有两部分,可以配置为分别强制执行导入名称和来源的排序。要仅强制执行名称的顺序,您可以使用这样的配置:
"ordered-imports": [true, {
"import-sources-order": "any",
"named-imports-order": "case-insensitive"
}]
这会引发这样的导入错误:
import { A, C, B } from 'some-module';
但不会强制对模块路径等进行排序
如果没有添加空的新行作为导入组之间的分隔,也会发生此错误。
import * as fs from 'fs';
import * as os from 'os';
import * as bar from './bar';
import * as foo from './foo';
另请注意错误是否如下所示:
***(5,1): Import sources within a group must be alphabetized.***
这意味着在指定的文件中转到第 5 行并按 Enter 键在那里添加一个新的空行作为分隔符。
我这样做了,这解决了我的问题。有关此问题的更多参考,请查看此 page
在文件tslint.json
中添加
"rules": {
"ordered-imports": [false],
"object-literal-sort-keys": [false]
}
例如,文件 tslint.json
将如下所示
{
"extends": [
"tslint:recommended",
"tslint-react",
"tslint-config-prettier"
],
"linterOptions": {
"exclude": [
"config/**/*.js",
"node_modules/**/*.ts",
"coverage/lcov-report/*.js"
]
},
"rules": {
"ordered-imports": [false],
"object-literal-sort-keys": [false]
}
}