[Feat] 지원 안 되는 브라우저 안내 페이지 pre render 하기 (#465)

* feat: unsupported page  html 파일 생성하기

* fix: 지원 안되는 브라우저 경로 수정

* design: 문장 사이 공백 추가

* refactor: script 위치 수정

* design: css 파일 추출

* refactor: build 명령어 수정에 따른 html, css 파일 수정

* refactor: renderToStaticMarkup으로 변경

* feat: gitignore에 unsupported.html 추가

* design: css 수정

.gitignore

@@ -10,6 +10,7 @@ lerna-debug.log*
 node_modules
 dist
 dist-ssr
+public/unsupported.html
 *.local
 
 # Editor directories and files
@@ -25,4 +26,4 @@ dist-ssr
 
 .env
 .env.makers
-.env.sopt
+.env.sopt

index.html

@@ -12,6 +12,7 @@
 
       gtag('config', 'G-DNPBGP8WDE');
     </script>
+    <script async type="module" src="./src/views/UnsupportedPage/utils/checkBrowser.ts"></script>
 
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -24,6 +25,5 @@
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
     <script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
-    <script type="module" src="./src/views/UnsupportedPage/utils/checkBrowser.ts"></script>
   </body>
 </html>

package.json

@@ -4,12 +4,14 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vite --mode makers",
-    "dev:development": "vite --mode development",
-    "dev:sopt": "vite --mode sopt",
-    "build": "tsc && NODE_ENV=makers vite build --mode makers",
-    "build:makers": "tsc && vite build --mode development",
-    "build:sopt": "tsc && NODE_ENV=sopt vite build --mode sopt",
+    "dev": "NODE_ENV=makers vite --mode makers",
+    "dev:sopt": "NODE_ENV=sopt vite --mode sopt",
+    "dev:dev": "vite --mode development",
+    "build:ssg": "tsc && vite build --mode makers --ssr src/views/UnsupportedPage/pre-render.tsx && node dist/pre-render.js",
+    "build:ssg:sopt": "tsc && vite build --mode sopt --ssr src/views/UnsupportedPage/pre-render.tsx && node dist/pre-render.js",
+    "build": "yarn build:ssg && tsc && NODE_ENV=makers vite build --mode makers",
+    "build:sopt": "yarn build:ssg:sopt && tsc && NODE_ENV=sopt vite build --mode sopt",
+    "build:dev": "tsc && vite build --mode development",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
     "test": "vitest",