refactor: ♻️ introduce more lint rules to enforce consistency

.eslintrc.cjs

@@ -3,7 +3,7 @@ module.exports = {
     browser: true,
     es2021: true,
   },
-  plugins: ['@typescript-eslint', 'react', 'react-refresh'],
+  plugins: ['simple-import-sort', 'react', 'react-refresh', 'node-import'],
   extends: [
     'eslint:recommended',
     'plugin:@typescript-eslint/strict-type-checked',
@@ -68,6 +68,16 @@ module.exports = {
       'warn',
       { allowConstantExport: true },
     ],
+
+    // stylistic
+    'object-shorthand': ['error', 'always'],
+    'func-style': ['error', 'expression'],
+    'simple-import-sort/imports': 'error',
+    'simple-import-sort/exports': 'error',
+    'node-import/prefer-node-protocol': 'error',
+    'import/consistent-type-specifier-style': ['error', 'prefer-inline'],
+    '@typescript-eslint/consistent-type-exports': 'error',
+    '@typescript-eslint/consistent-type-imports': 'error',
   },
   ignorePatterns: [
     'node_modules/',

e2e/app.spec.ts

@@ -1,4 +1,4 @@
-import { test, expect } from '@playwright/test'
+import { expect, test } from '@playwright/test'
 
 test('has title', async ({ page }) => {
   await page.goto('http://localhost:5173/')

package.json

@@ -44,9 +44,11 @@
     "eslint-plugin-jest": "27.6.0",
     "eslint-plugin-jest-dom": "5.1.0",
     "eslint-plugin-jsx-a11y": "6.8.0",
+    "eslint-plugin-node-import": "1.0.4",
     "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-plugin-react-refresh": "0.4.4",
+    "eslint-plugin-simple-import-sort": "10.0.0",
     "eslint-plugin-testing-library": "6.1.2",
     "gitzy": "4.0.0",
     "jsdom": "22.1.0",

src/App.tsx

@@ -6,7 +6,7 @@ import typeScriptLogo from './assets/typescript.svg'
 import viteLogo from './assets/vite.svg'
 import { Logo } from './components/Logo'
 
-function App() {
+export default function App() {
   const [count, setCount] = useState(0)
 
   return (
@@ -52,5 +52,3 @@ function App() {
     </div>
   )
 }
-
-export default App

src/main.tsx

@@ -1,8 +1,9 @@
+import './index.css'
+
 import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 
 import App from './App'
-import './index.css'
 
 const root = document.getElementById('root')
 

src/test/utils.tsx

@@ -16,5 +16,5 @@ const customRender = (ui: React.ReactElement, options = {}) => {
   }
 }
 
-export { screen, renderHook, within } from '@testing-library/react'
+export { renderHook, screen, within } from '@testing-library/react'
 export { customRender as render }

vite.config.ts

@@ -1,4 +1,4 @@
-import path from 'path'
+import path from 'node:path'
 
 import react from '@vitejs/plugin-react-swc'
 import { defineConfig } from 'vite'