fix: storybook에서 babel 설정을 읽을 수 있도록 .babelrc.js 로 분리

woowacourse-teams · Sep 28, 2023 · 7dbc007 · 7dbc007
1 parent 6399bb3
commit 7dbc007
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 20 deletions.
diff --git a/client/.babelrc.js b/client/.babelrc.js
@@ -0,0 +1,16 @@
+import ReactFreshBabelPlugin from 'react-refresh/babel';
+
+/** @type {import('@babel/core').TransformOptions} */
+export default {
+  presets: [
+    [
+      '@babel/preset-react',
+      {
+        runtime: 'automatic',
+        development: process.env.NODE_ENV === 'development',
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
+  plugins: [process.env.NODE_ENV === 'development' && false && ReactFreshBabelPlugin].filter(Boolean),
+};
diff --git a/client/webpack.common.js b/client/webpack.common.js
@@ -3,11 +3,8 @@ import DotenvWebpackPlugin from 'dotenv-webpack';
 import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import { dirname } from 'path';
-import ReactFreshBabelPlugin from 'react-refresh/babel';
 import { fileURLToPath } from 'url';
 
-export const IS_DEV = process.env.NODE_ENV === 'development';
-
 /** @type {import('webpack').Configuration} */
 export default {
   // https://github.com/TypeStrong/fork-ts-checker-webpack-plugin#installation
@@ -26,23 +23,7 @@ export default {
       {
         test: /\.[tj]sx?$/i,
         exclude: /node_modules/,
-        use: {
-          loader: 'babel-loader',
-          /** @type {import('@babel/core').TransformOptions} */
-          options: {
-            presets: [
-              [
-                '@babel/preset-react',
-                {
-                  runtime: 'automatic',
-                  development: IS_DEV,
-                },
-              ],
-              '@babel/preset-typescript',
-            ],
-            plugins: [IS_DEV && ReactFreshBabelPlugin].filter(Boolean),
-          },
-        },
+        use: 'babel-loader',
       },
     ],
   },