refactor: 优化 prettier 配置

Author: crazyurus

.prettierrc.json

@@ -13,5 +13,18 @@
   "semi": true,
   "arrowParens": "avoid",
   "trailingComma": "none",
-  "endOfLine": "auto"
+  "endOfLine": "auto",
+  "bracketSameLine": true,
+  "plugins": [
+    "@ianvs/prettier-plugin-sort-imports",
+    "prettier-plugin-packagejson"
+  ],
+  "importOrder": [
+    "<BUILTIN_MODULES>",
+    "<THIRD_PARTY_MODULES>",
+    "",
+    "^@/(.*)$",
+    "",
+    "^[./]"
+  ]
 }

package.json

@@ -4,10 +4,27 @@
   "private": true,
   "description": "Web site created using create-react-app with craco",
   "scripts": {
-    "prepare": "husky install",
-    "start": "craco start",
+    "analyze": "cross-env ANALYZE=TRUE craco build",
     "build": "craco build",
-    "analyze": "cross-env ANALYZE=TRUE craco build"
+    "prepare": "husky install",
+    "start": "craco start"
+  },
+  "lint-staged": {
+    "src/**/*.{js,ts,tsx}": "eslint --fix",
+    "src/**/*": "prettier --write --ignore-unknown",
+    "src/**/*.{css,scss}": "stylelint"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
   },
   "dependencies": {
     "classnames": "^2.3.2",
@@ -33,6 +50,7 @@
     "husky": "^8.0.3",
     "lint-staged": "^13.1.2",
     "prettier": "^2.8.4",
+    "prettier-plugin-packagejson": "^2.4.9",
     "react-scripts": "^5.0.1",
     "sass": "^1.58.3",
     "speed-measure-webpack-plugin": "^1.5.0",
@@ -43,23 +61,6 @@
     "webpack-bundle-analyzer": "^4.8.0",
     "webpack-subresource-integrity": "^5.1.0"
   },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "cracoConfig": "./config/craco.js",
-  "lint-staged": {
-    "src/**/*.{js,ts,tsx}": "eslint --fix",
-    "src/**/*": "prettier --write --ignore-unknown",
-    "src/**/*.{css,scss}": "stylelint"
-  },
-  "packageManager": "[email protected]"
-}
+  "packageManager": "[email protected]",
+  "cracoConfig": "./config/craco.js"
+}

pnpm-lock.yaml

@@ -1,5 +1,6 @@
 import React from 'react';
-import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+
 import Layout from './layouts/Basic';
 import NotFound from './pages/Error/404';
 import routes from './routes';

src/App.tsx

@@ -1,4 +1,5 @@
 import React, { type PropsWithChildren } from 'react';
+
 import styles from './index.scss';
 
 interface Props {

src/components/Link/index.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
+
 import logo from '@/assets/images/logo.svg';
+
 import styles from './index.scss';
 
 function Logo(): JSX.Element {

src/components/Logo/index.tsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
+
 import App from './App';
+
 import './styles/global.scss';
 
 const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);

src/index.tsx

@@ -1,4 +1,5 @@
 import React, { type PropsWithChildren } from 'react';
+
 import styles from './index.scss';
 
 function Layout(props: PropsWithChildren): JSX.Element {

src/layouts/Basic/index.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
-import { Logo, Link } from '@/components';
+
+import { Link, Logo } from '@/components';
+
 import styles from './index.scss';
 
 function Home(): JSX.Element {

src/pages/Home/index.tsx

@@ -1,4 +1,5 @@
 import type { PathRouteProps } from 'react-router-dom';
+
 import Home from './pages/Home';
 
 interface Route extends PathRouteProps {
@@ -9,8 +10,8 @@ interface Route extends PathRouteProps {
 const routes: Route[] = [
   {
     path: '/',
-    page: Home,
-  },
+    page: Home
+  }
 ];
 
 export default routes;