組中的導入源必須按字母順序排列

Question

好像我不知道字母。 請告訴我不訂購的地方：

import * as React from 'react';
import {
  Badge,
  Button,
  ButtonGroup,
  Collapse,
  Dropdown,
  DropdownItem,
  DropdownMenu,
  DropdownToggle,
  Input,
  InputGroup,
  InputGroupAddon,
  Nav,
  Navbar,
  NavbarBrand,
  NavItem,
  NavLink,
  UncontrolledAlert,
} from 'reactstrap';
import {logoutUser} from '../actions/user';
import {positionSidebar,toggleSidebar,toggleVisibilitySidebar} from '../actions/navigation';

import s from './Header.scss';

import sender1 from '../../images/1.png';
import sender2 from '../../images/2.png';
import sender3 from '../../images/3.png';

它在第22行給了我錯誤： “組中的導入源必須按字母順序排列”。 （導入{positionSidebar ....）但是它們的順序正確！！ （或者也許我必須回到學校:(）。

我試圖禁用這種愚蠢的字母順序：但是我不能：

 "extends": ["tslint:recommended", "tslint-react", "tslint-config-prettier"],
 "ordered-imports": [true, {
   "import-sources-order": "any",
   "named-imports-order": "any",
   "grouped-imports": false,
   "module-source-path": "basename"
 }]

那是行不通的，錯誤會重復出現。 我會將其發布在github上，但是有很多關於此的帖子，也許這不是一個bug。 如果您認為這是錯誤，請告訴我，我會在此發布。

我的tslint導入：

"tslint": "^5.7.0",
"tslint-config-prettier": "^1.10.0",
"tslint-react": "^3.2.0",

Answer 1

排序棉絨錯誤不在單個命名的導入上，而是在文件路徑上：

import {logoutUser} from '../actions/user';
import {positionSidebar,toggleSidebar,toggleVisibilitySidebar} from '../actions/navigation';

文件路徑也用作排序的一部分，應為：

'../actions/navigation';
'../actions/user';

您可以使用以下tslint配置完全禁用導入順序：

"ordered-imports": false

Answer 2

如果有人像我一樣傻，我在Google中搜索了字母順序並將其復制粘貼到該工具中。 我將您使用過的鏈接鏈接到您，但可能是在頁面關閉時。 只需搜索“按字母順序排列”或類似的內容，肯定會有網頁可以做到這一點。

意識到。 正如@hackerrdave所說：有時問題出在路徑而不是導入（當您使用方括號{}或*導入某些內容時，我注意到path命令），因此也許您必須對路徑而不是導入進行排序。

https://alphabetizer.flap.tv/