style: add prettier-plugin-sort-imports (#44287)

* style: sort

* style: sort

* style: sort

* style: sort

* style: 规则调整

* style: 规则调整

.eslintrc.js

@@ -205,6 +205,7 @@ module.exports = {
     '@typescript-eslint/no-shadow': [2, { ignoreTypeValueShadow: true }],
     // https://github.com/typescript-eslint/typescript-eslint/issues/2528#issuecomment-689369395
     'no-undef': 0,
+    'import/order': 0,
   },
   globals: {
     gtag: true,

.prettierrc

@@ -4,6 +4,10 @@
   "trailingComma": "all",
   "printWidth": 100,
   "proseWrap": "never",
+  "importOrder": ["^(react|react-dom)$", "^([a-z]|@[a-z])", ".*"],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true,
+  "plugins": ["@trivago/prettier-plugin-sort-imports"],
   "overrides": [
     {
       "files": ".prettierrc",

components/affix/index.tsx

@@ -1,9 +1,11 @@
 'use client';
 
+import React, { createRef, forwardRef, useContext } from 'react';
+
 import classNames from 'classnames';
 import ResizeObserver from 'rc-resize-observer';
 import omit from 'rc-util/lib/omit';
-import React, { createRef, forwardRef, useContext } from 'react';
+
 import throttleByAnimationFrame from '../_util/throttleByAnimationFrame';
 import type { ConfigConsumerProps } from '../config-provider';
 import { ConfigContext } from '../config-provider';

components/collapse/__tests__/index.test.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
+
 import { act } from 'react-dom/test-utils';
+
 import { fireEvent, render, waitFakeTimer } from '../../../tests/utils';
 import { resetWarned } from '../../_util/warning';
 

components/color-picker/ColorPicker.tsx

@@ -1,11 +1,13 @@
+import type { CSSProperties, FC } from 'react';
+import React, { useContext, useMemo, useRef, useState } from 'react';
+
 import type {
   HsbaColorType,
   ColorPickerProps as RcColorPickerProps,
 } from '@rc-component/color-picker';
 import classNames from 'classnames';
 import useMergedState from 'rc-util/lib/hooks/useMergedState';
-import type { CSSProperties, FC } from 'react';
-import React, { useContext, useMemo, useRef, useState } from 'react';
+
 import genPurePanel from '../_util/PurePanel';
 import { getStatusClassNames } from '../_util/statusUtils';
 import warning from '../_util/warning';

components/tabs/demo/custom-tab-bar.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
-import StickyBox from 'react-sticky-box';
+
 import type { TabsProps } from 'antd';
 import { Tabs, theme } from 'antd';
+import StickyBox from 'react-sticky-box';
 
 const items = new Array(3).fill(null).map((_, i) => {
   const id = String(i + 1);

package.json

@@ -181,6 +181,7 @@
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.2",
+    "@trivago/prettier-plugin-sort-imports": "^4.2.0",
     "@types/fs-extra": "^11.0.1",
     "@types/gtag.js": "^0.0.13",
     "@types/http-server": "^0.12.1",