chore: lint에 대한 packageExtentions 설정 추가

.yarnrc.yml

@@ -1,2 +1,15 @@
 yarnPath: .yarn/releases/yarn-4.5.1.cjs
 nodeLinker: pnp
+
+packageExtensions:
+  '@typescript-eslint/utils@*':
+    peerDependencies:
+      eslint: '*'
+      typescript: '*'
+  '@typescript-eslint/type-utils@*':
+    peerDependencies:
+      eslint: '*'
+      typescript: '*'
+  'typescript-eslint@*':
+    peerDependencies:
+      eslint: '*'

frontend/.gitignore

@@ -23,4 +23,6 @@ dist-ssr
 *.sln
 *.sw?
 
-.vite
+.vite
+
+.dist

frontend/eslint.config.js

@@ -5,7 +5,7 @@ import reactRecommended from 'eslint-plugin-react/configs/recommended.js';
 import reactHooks from 'eslint-plugin-react-hooks';
 import reactRefresh from 'eslint-plugin-react-refresh';
 
-export default tseslint.config({ ignores: ['dist'] }, js.configs.recommended, ...tseslint.configs.recommended, {
+export default tseslint.config({ ignores: ['.*'] }, js.configs.recommended, ...tseslint.configs.recommended, {
   files: ['**/*.{ts,tsx}'],
   languageOptions: {
     ecmaVersion: 2020,
@@ -34,6 +34,7 @@ export default tseslint.config({ ignores: ['dist'] }, js.configs.recommended, ..
         allowConstantExport: true
       }
     ],
+    'react/react-in-jsx-scope': 'off',
     eqeqeq: ['error', 'always'],
     indent: ['error', 2],
     quotes: ['error', 'single'],

frontend/package.json

@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "tsc -b && vite build",
+    "build": "vite build",
     "lint": "eslint .",
     "preview": "vite preview",
     "test": "vitest",
@@ -14,6 +14,7 @@
     "msw:init": "msw init public/"
   },
   "dependencies": {
+    "eslint-plugin-react": "^7.37.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.27.0",
@@ -26,12 +27,14 @@
     "@types/react-dom": "^18.3.1",
     "@types/react-router-dom": "^5.3.3",
     "@types/styled-components": "^5.1.34",
+    "@typescript-eslint/eslint-plugin": "^8.14.0",
+    "@typescript-eslint/parser": "^8.14.0",
     "@vitejs/plugin-react": "^4.3.3",
     "eslint": "^9.13.0",
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.14",
     "globals": "^15.11.0",
-    "typescript": "4.4.3",
+    "typescript": "^5.6.3",
     "typescript-eslint": "^8.11.0",
     "vite": "^5.4.10",
     "vite-plugin-svgr": "^4.3.0",

frontend/src/components/client/PlayerInfo.tsx

@@ -2,7 +2,7 @@ import { useState } from 'react';
 import styled from 'styled-components';
 
 const PlayerInfo = () => {
-  const [videoStatus, setVideoStatus] = useState(true);
+  const [videoStatus] = useState(true);
 
   return (
     <PlayerInfoContainer>

frontend/src/declarations.d.ts

@@ -1,5 +1,4 @@
 declare module '*.svg' {
-  import React = require('react');
   export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>;
   const src: string;
   export default src;

frontend/vite.config.ts

@@ -12,5 +12,8 @@ export default defineConfig({
       include: '**/*.svg'
     })
   ],
+  build: {
+    outDir: '.dist'
+  },
   cacheDir: '.vite'
 });