chore: update prettier config in eslint (#4280)

Author: RylanBot

.eslintignore

@@ -14,3 +14,4 @@ temp*
 static/
 packages/common
 packages/ai-core
+site/engineering/static

.eslintrc.js

@@ -1,12 +1,12 @@
 module.exports = {
   extends: [
     'airbnb-base',
-    'prettier', // eslint-config-prettier 处理冲突
     'plugin:react/recommended',
     'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended',
   ],
   parser: '@typescript-eslint/parser',
-  plugins: ['@typescript-eslint', 'react-hooks', 'simple-import-sort'],
+  plugins: ['@typescript-eslint', 'react-hooks', 'simple-import-sort', 'prettier'],
   env: {
     browser: true,
     node: true,
@@ -69,7 +69,25 @@ module.exports = {
     ],
     'max-len': 'off',
     'no-shadow': 'off',
-
+    'prettier/prettier': [
+      'error',
+      {
+        printWidth: 120,
+        tabWidth: 2,
+        useTabs: false,
+        semi: true,
+        singleQuote: true,
+        quoteProps: 'as-needed',
+        jsxSingleQuote: false,
+        trailingComma: 'all',
+        bracketSpacing: true,
+        jsxBracketSameLine: false,
+        arrowParens: 'always',
+        proseWrap: 'preserve',
+        htmlWhitespaceSensitivity: 'css',
+        endOfLine: 'lf',
+      },
+    ],
     // import config
     'import/order': 'off',
     'import/extensions': 'off',
@@ -103,7 +121,6 @@ module.exports = {
       },
     ],
     'simple-import-sort/exports': 'error',
-
     // typescript config
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/ban-types': 'off',
@@ -125,7 +142,6 @@ module.exports = {
         disallowTypeAnnotations: false,
       },
     ],
-
     // react config
     'react/display-name': 'off',
     'react-hooks/exhaustive-deps': 'warn',

.prettierignore

@@ -3,23 +3,23 @@
   "eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"],
   "[html]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
   },
   "[typescriptreact]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
   },
   "[javascriptreact]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
   },
   "[typescript]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
   },
   "[javascript]": {
     "editor.formatOnSave": true,
-    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
   },
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": "explicit"

.prettierrc.js

@@ -17,8 +17,7 @@ import type { OptionsListProps } from './OptionList';
 import type { AutoCompleteOption, TdAutoCompleteProps } from './type';
 
 export interface AutoCompleteProps<T extends AutoCompleteOption = AutoCompleteOption>
-  extends TdAutoCompleteProps<T>,
-    StyledProps {}
+  extends TdAutoCompleteProps<T>, StyledProps {}
 
 export interface AutoCompleteRef {
   inputRef: InputRef;

.vscode/settings.json

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState } from 'react';
 import { Badge, Checkbox } from 'tdesign-react';
 
 const colors = [

packages/components/auto-complete/AutoComplete.tsx

@@ -12,8 +12,7 @@ import { buttonDefaultProps } from './defaultProps';
 import type { TdButtonProps } from './type';
 
 export interface ButtonProps
-  extends TdButtonProps,
-    Omit<React.AllHTMLAttributes<HTMLElement>, 'content' | 'shape' | 'size' | 'type'> {}
+  extends TdButtonProps, Omit<React.AllHTMLAttributes<HTMLElement>, 'content' | 'shape' | 'size' | 'type'> {}
 
 const Button = forwardRef((originProps: ButtonProps, ref: React.RefObject<HTMLElement>) => {
   const props = useDefaultProps(originProps, buttonDefaultProps);

packages/components/badge/_example/color.tsx

@@ -13,8 +13,7 @@ import type { CascaderContextType, TreeNode } from '../interface';
 import type { TdCascaderProps } from '../type';
 
 export interface CascaderPanelProps
-  extends StyledProps,
-    Pick<TdCascaderProps, 'trigger' | 'empty' | 'onChange' | 'loading' | 'loadingText' | 'option'> {
+  extends StyledProps, Pick<TdCascaderProps, 'trigger' | 'empty' | 'onChange' | 'loading' | 'loadingText' | 'option'> {
   cascaderContext: CascaderContextType;
 }
 

packages/components/button/Button.tsx

@@ -5,24 +5,23 @@ import type { TdSelectInputProps } from '../select-input/type';
 import type { CascaderChangeSource, CascaderValue, TdCascaderProps } from './type';
 
 export * from './type';
-export interface CascaderContextType
-  extends Pick<
-    TdCascaderProps,
-    | 'size'
-    | 'disabled'
-    | 'checkStrictly'
-    | 'lazy'
-    | 'multiple'
-    | 'filterable'
-    | 'filter'
-    | 'clearable'
-    | 'checkProps'
-    | 'showAllLevels'
-    | 'max'
-    | 'value'
-    | 'minCollapsedNum'
-    | 'valueType'
-  > {
+export interface CascaderContextType extends Pick<
+  TdCascaderProps,
+  | 'size'
+  | 'disabled'
+  | 'checkStrictly'
+  | 'lazy'
+  | 'multiple'
+  | 'filterable'
+  | 'filter'
+  | 'clearable'
+  | 'checkProps'
+  | 'showAllLevels'
+  | 'max'
+  | 'value'
+  | 'minCollapsedNum'
+  | 'valueType'
+> {
   treeStore: TreeStore;
   setValue: (val: CascaderValue, source: CascaderChangeSource, node?: TreeNodeModel) => void;
   visible: boolean;