Merge pull request #74 from YAPP-Github/feature/PRODUCT-50

feat: Login 페이지 구현 및 TextButton / GNB 공통 컴포넌트 구현 (#37)

Author: wkdtnqls0506

.storybook/main.ts

@@ -1,34 +1,39 @@
-import type { StorybookConfig } from "@storybook/nextjs-vite";
-import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
-import svgr from "vite-plugin-svgr";
-import tsconfigPaths from "vite-tsconfig-paths";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import type { StorybookConfig } from "@storybook/nextjs";
+import { VanillaExtractPlugin } from "@vanilla-extract/webpack-plugin";
 
 const config: StorybookConfig = {
   stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
-  addons: [
-    "@chromatic-com/storybook",
-    "@storybook/addon-docs",
-    "@storybook/addon-a11y",
-    "@storybook/addon-vitest",
-  ],
+  addons: ["@storybook/addon-docs", "@storybook/addon-a11y"],
   framework: {
-    name: "@storybook/nextjs-vite",
+    name: "@storybook/nextjs",
     options: {},
   },
   features: {
     experimentalRSC: true,
   },
   staticDirs: ["../public"],
-  async viteFinal(config) {
-    return {
-      ...config,
-      plugins: [
-        ...(config.plugins ?? []),
-        svgr(),
-        vanillaExtractPlugin(),
-        tsconfigPaths(),
-      ],
-    };
+  webpackFinal: async (config: any) => {
+    const imageRule = config.module.rules.find(rule => {
+      const test = (rule as { test: RegExp }).test;
+
+      if (!test) {
+        return false;
+      }
+
+      return test.test(".svg");
+    }) as { [key: string]: any };
+
+    imageRule.exclude = /\.svg$/;
+
+    config.module.rules.push({
+      test: /\.svg$/,
+      use: ["@svgr/webpack"],
+    });
+
+    config.plugins.push(new VanillaExtractPlugin());
+
+    return config;
   },
 };
 export default config;

.storybook/preview.ts

@@ -1,6 +1,6 @@
 import "@/styles/reset.css.ts";
 
-import type { Preview } from "@storybook/nextjs-vite";
+import type { Preview } from "@storybook/nextjs";
 
 const preview: Preview = {
   parameters: {

.storybook/vitest.setup.ts

@@ -23,7 +23,7 @@
     "@vanilla-extract/dynamic": "^2.1.5",
     "@vanilla-extract/recipes": "^0.5.7",
     "iron-session": "^8.0.4",
-    "ky": "^1.8.1",
+    "ky": "1.7.5",
     "next": "15.3.2",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
@@ -40,8 +40,11 @@
     "@playwright/test": "^1.52.0",
     "@storybook/addon-a11y": "^9.0.15",
     "@storybook/addon-docs": "^9.0.15",
-    "@storybook/addon-vitest": "^9.0.15",
-    "@storybook/nextjs-vite": "^9.0.15",
+    "@storybook/nextjs": "^9.0.15",
+    "@vitejs/plugin-react": "^4.5.0",
+    "@vitest/browser": "^3.1.4",
+    "@vitest/coverage-v8": "^3.1.4",
+    "@vitest/eslint-plugin": "^1.2.1",
     "@svgr/webpack": "^8.1.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
@@ -50,12 +53,8 @@
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
-    "@vanilla-extract/next-plugin": "^2.4.11",
-    "@vanilla-extract/vite-plugin": "^5.0.7",
-    "@vitejs/plugin-react": "^4.5.0",
-    "@vitest/browser": "^3.1.4",
-    "@vitest/coverage-v8": "^3.1.4",
-    "@vitest/eslint-plugin": "^1.2.1",
+    "@vanilla-extract/next-plugin": "^2.4.14",
+    "@vanilla-extract/webpack-plugin": "^2.3.22",
     "chromatic": "^13.0.1",
     "commitizen": "^4.3.1",
     "eslint": "^9",
@@ -75,10 +74,8 @@
     "prettier": "^3.5.3",
     "storybook": "^9.0.15",
     "typescript": "^5",
-    "vite": "6.2.0",
-    "vite-plugin-svgr": "^4.3.0",
-    "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^3.1.4"
+    "vitest": "^3.1.4",
+    "vite-tsconfig-paths": "^5.1.4"
   },
   "msw": {
     "workerDirectory": [