From b67e4f7bd0f0ee0ac0a7a9940dbec9a9a0802d38 Mon Sep 17 00:00:00 2001
From: woohee Byun <cay107@naver.com>
Date: Thu, 5 Oct 2023 02:44:31 +0900
Subject: [PATCH] [Add] babel for styled-component

---
 .babelrc              |  4 ++++
 .vscode/settings.json |  4 ----
 app/globals.css       |  2 +-
 package-lock.json     | 22 +++++++++++++++++++++-
 package.json          |  1 +
 5 files changed, 27 insertions(+), 6 deletions(-)
 create mode 100644 .babelrc
 delete mode 100644 .vscode/settings.json

diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..a88b914
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,4 @@
+{
+  "presets": ["next/babel"],
+  "plugins": ["babel-plugin-styled-components"]
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
deleted file mode 100644
index d067910..0000000
--- a/.vscode/settings.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-  "typescript.tsdk": "node_modules/typescript/lib",
-  "typescript.enablePromptUseWorkspaceTsdk": true
-}
\ No newline at end of file
diff --git a/app/globals.css b/app/globals.css
index db13e63..9d18ecd 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -16,7 +16,7 @@ html,
 body {
   max-width: 100vw;
   overflow-x: hidden;
-  height: 100%;
+  height: 100vh;
 }
 
 /* @media (prefers-color-scheme: dark) {
diff --git a/package-lock.json b/package-lock.json
index 81b981b..f996c06 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,7 @@
       "dependencies": {
         "@nextcss/reset": "^0.2.4-beta",
         "axios": "^1.5.1",
+        "babel-plugin-styled-components": "^2.1.4",
         "next": "latest",
         "react": "latest",
         "react-dom": "latest",
@@ -2860,6 +2861,21 @@
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
       }
     },
+    "node_modules/babel-plugin-styled-components": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.1.4.tgz",
+      "integrity": "sha512-Xgp9g+A/cG47sUyRwwYxGM4bR/jDRg5N6it/8+HxCnbT5XNKSKDT9xm4oag/osgqjC2It/vH0yXsomOG6k558g==",
+      "dependencies": {
+        "@babel/helper-annotate-as-pure": "^7.22.5",
+        "@babel/helper-module-imports": "^7.22.5",
+        "@babel/plugin-syntax-jsx": "^7.22.5",
+        "lodash": "^4.17.21",
+        "picomatch": "^2.3.1"
+      },
+      "peerDependencies": {
+        "styled-components": ">= 2"
+      }
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -4814,6 +4830,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/lodash": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -5257,7 +5278,6 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "devOptional": true,
       "engines": {
         "node": ">=8.6"
       },
diff --git a/package.json b/package.json
index ef5a11b..894b08b 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "@nextcss/reset": "^0.2.4-beta",
     "axios": "^1.5.1",
+    "babel-plugin-styled-components": "^2.1.4",
     "next": "latest",
     "react": "latest",
     "react-dom": "latest",