Merge branch 'develop' into init/design-token-setting/#9

jstar000 · web-flow · commit 9f1d2ded5e9c · 2025-11-19T18:46:16.000+09:00
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -0,0 +1,2 @@
+# PR을 올릴 때 모든 파일에 대해 팀원 전체를 리뷰어로 자동 지정
+* @jstar000 @mimizae @odukong @qowjdals23
diff --git a/package.json b/package.json
@@ -28,6 +28,7 @@
     "globals": "^16.5.0",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.46.3",
-    "vite": "^7.2.2"
+    "vite": "^7.2.2",
+    "vite-plugin-svgr": "^4.5.0"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,3 +1,5 @@
+import Home from "@pages/home/home";
+
 function App() {
   return (
     <div></div>
diff --git a/src/assets/img/.gitkeep b/src/assets/img/.gitkeep
diff --git a/src/assets/svg/icnCredit.svg b/src/assets/svg/icnCredit.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0Z" fill="#6F00FF"/>
+<path d="M9.61426 8.67943H11.4853C11.2579 10.3174 9.86373 11.5 8.02201 11.5C5.93816 11.5 4.5 9.97954 4.5 7.99633C4.5 6.02046 5.93816 4.5 8.02201 4.5C9.90042 4.5 11.3092 5.734 11.5 7.41605H9.62893C9.50419 6.58604 8.90985 5.98374 8.02201 5.98374C6.9434 5.98374 6.23166 6.87251 6.23166 7.99633C6.23166 9.12749 6.9434 10.0163 8.02201 10.0163C8.86583 10.0163 9.46017 9.46537 9.61426 8.67943Z" fill="white"/>
+</svg>
diff --git a/src/assets/svg/index.ts b/src/assets/svg/index.ts
@@ -0,0 +1,3 @@
+// index.ts: SVG 파일들을 React 컴포넌트로 변환해 일괄적으로 관리
+// svg 폴더에 추가한 svg 이미지는 index.ts에서 아래와 같은 형식으로 export해 사용해주세요!
+export { default as IcnCredit } from "@svg/icnCredit.svg?react";
diff --git a/src/pages/home/home.tsx b/src/pages/home/home.tsx
@@ -0,0 +1,12 @@
+import { IcnCredit } from "@/assets/svg";
+
+const Home = () => {
+  return (
+    <div>
+      <IcnCredit />
+      <p>안녕</p>
+    </div>
+  );
+};
+
+export default Home;
diff --git a/src/router/.gitkeep b/src/router/.gitkeep
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="vite/client" />
+/// <reference types="vite-plugin-svgr/client" />
diff --git a/tsconfig.app.json b/tsconfig.app.json
@@ -16,6 +16,18 @@
     "noEmit": true,
     "jsx": "react-jsx",
 
+    /* Path Alias */
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"],
+      "@shared/*": ["./src/shared/*"],
+      "@pages/*": ["./src/pages/*"],
+      "@routes/*": ["./src/routes/*"],
+      "@img/*": ["./src/assets/img/*"],
+      "@svg/*": ["./src/assets/svg/*"],
+      "@styles/*": ["./src/shared/styles/*"]
+    },
+
     /* Linting */
     "strict": true,
     "noUnusedLocals": true,
diff --git a/vite.config.ts b/vite.config.ts
@@ -1,8 +1,31 @@
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react-swc";
 import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
+import react from "@vitejs/plugin-react-swc";
+import svgr from "vite-plugin-svgr";
+import path from "path";
 
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [react(), vanillaExtractPlugin()],
+  plugins: [
+    react(),
+    svgr({
+      svgrOptions: {
+        ref: true, // JavaScript로 SVG 직접 접근 가능(useRef 등)
+        svgo: false, // 원본 SVG 파일을 그대로 import, 최적화 비활성화(원본 유지)
+        titleProp: true, // SVG에 <Logo title="" />와 같이 title 추가 가능(접근성 증대)
+      },
+    }),
+  ],
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+      "@shared": path.resolve(__dirname, "./src/shared"),
+      "@pages": path.resolve(__dirname, "./src/pages"),
+      "@routes": path.resolve(__dirname, "./src/routes"),
+      "@svg": path.resolve(__dirname, "./src/assets/svg"),
+      "@img": path.resolve(__dirname, "./src/assets/img"),
+      "@styles": path.resolve(__dirname, "./src/shared/styles"),
+    },
+  },
 });

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+# PR을 올릴 때 모든 파일에 대해 팀원 전체를 리뷰어로 자동 지정`
	`2`	`+* @jstar000 @mimizae @odukong @qowjdals23`
Original file line number	Diff line number	Diff line change
`@@ -28,6 +28,7 @@`
`28`	`28`	`"globals": "^16.5.0",`
`29`	`29`	`"typescript": "~5.9.3",`
`30`	`30`	`"typescript-eslint": "^8.46.3",`
`31`		`- "vite": "^7.2.2"`
	`31`	`+ "vite": "^7.2.2",`
	`32`	`+ "vite-plugin-svgr": "^4.5.0"`
`32`	`33`	`}`
`33`	`34`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,5 @@`
	`1`	`+import Home from "@pages/home/home";`
	`2`	`+`
`1`	`3`	`function App() {`
`2`	`4`	`return (`
`3`	`5`	`<div></div>`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+// index.ts: SVG 파일들을 React 컴포넌트로 변환해 일괄적으로 관리`
	`2`	`+// svg 폴더에 추가한 svg 이미지는 index.ts에서 아래와 같은 형식으로 export해 사용해주세요!`
	`3`	`+export { default as IcnCredit } from "@svg/icnCredit.svg?react";`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+/// <reference types="vite/client" />`
	`2`	`+/// <reference types="vite-plugin-svgr/client" />`