merge: [REFACTOR] 트랜스파일러 Babel에서 SWC로 변경 (#420)

frontend/.storybook/main.ts

@@ -15,7 +15,7 @@ const config: StorybookConfig = {
     name: '@storybook/react-webpack5',
     options: {
       builder: {
-        useSWC: true,
+        useSWC: true, // Storybook의 SWC 설정 활성화
       },
     },
   },
@@ -25,16 +25,13 @@ const config: StorybookConfig = {
   webpackFinal: async (config: Configuration) => {
     const { resolve, module } = config;
 
-    // storybook에 emotion 관련 babel 설정 추가
+    // storybook에 emotion 관련 SWC 설정 추가
     module?.rules?.push({
       test: /\.(ts|tsx)$/,
       exclude: /node_modules/,
       use: [
         {
-          loader: require.resolve('babel-loader'),
-          options: {
-            plugins: [require.resolve('@emotion/babel-plugin')],
-          },
+          loader: require.resolve('swc-loader'),
         },
       ],
     });

frontend/.swcrc

@@ -4,11 +4,15 @@
       "syntax": "typescript",
       "tsx": true
     },
-    "target": "esnext",
     "transform": {
       "react": {
-        "runtime": "automatic"
+        "runtime": "automatic",
+        "importSource": "@emotion/react"
       }
     }
+  },
+  "env": {
+    "targets": "> 1%, not dead",
+    "coreJs": "3.37"
   }
 }

frontend/package.json

@@ -24,7 +24,6 @@
     "@emotion/react": "^11.11.4",
     "@sentry/react": "^8.24.0",
     "@tanstack/react-query": "^5.51.1",
-    "@tanstack/react-query-devtools": "^5.51.23",
     "copy-webpack-plugin": "^12.0.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -54,6 +53,7 @@
     "@swc/core": "^1.7.24",
     "@swc/jest": "^0.2.36",
     "@tanstack/eslint-plugin-query": "^5.51.1",
+    "@tanstack/react-query-devtools": "^5.62.1",
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.2",
@@ -90,6 +90,7 @@
     "stylelint": "^16.7.0",
     "stylelint-config-standard": "^36.0.1",
     "stylelint-order": "^6.0.4",
+    "swc-loader": "^0.2.6",
     "ts-loader": "^9.5.1",
     "typescript": "^5.5.3",
     "undici": "^6.19.2",

frontend/webpack.config.prod.js

@@ -20,7 +20,7 @@ module.exports = merge(common, {
       {
         test: /\.(js|jsx|ts|tsx)$/,
         exclude: /node_modules/,
-        use: ['babel-loader'],
+        use: ['swc-loader'],
       },
     ],
   },