From d9633004bfc53e75c7e71eab956075e132b5be5b Mon Sep 17 00:00:00 2001
From: SangHoon Lee <50488780+bbearcookie@users.noreply.github.com>
Date: Thu, 25 Apr 2024 17:27:48 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=91=20fix:=20=ED=94=84=EB=A1=9C?=
 =?UTF-8?q?=EB=8D=95=EC=85=98=20=ED=99=98=EA=B2=BD=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?=EC=86=8C=EC=8A=A4=EB=A7=B5=20=ED=99=95=EC=9D=B8=ED=95=A0=20?=
 =?UTF-8?q?=EC=88=98=20=EC=97=86=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95=20?=
 =?UTF-8?q?(#311)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 📦 chore: Production용 환경 변수 예시 파일 작성

* 📦 chore: 소스맵이 프로덕션 환경에서 지워지도록 설정

* 📦 chore: 관리자 앱에 Sentry 테스트용 임시 버튼 추가
---
 .env.production.example |  3 +++
 src/AdminApp.tsx        |  7 ++++++
 vite.config.ts          | 54 +++++++++++++++++++++++------------------
 3 files changed, 41 insertions(+), 23 deletions(-)
 create mode 100644 .env.production.example

diff --git a/.env.production.example b/.env.production.example
new file mode 100644
index 00000000..20f05c12
--- /dev/null
+++ b/.env.production.example
@@ -0,0 +1,3 @@
+SENTRY_PROJECT= # Sentry Project
+SENTRY_AUTH_TOKEN= # Sentry Auth Token
+SENTRY_ORG= # Sentry Organization
diff --git a/src/AdminApp.tsx b/src/AdminApp.tsx
index 65d6bb4d..24a3a52a 100644
--- a/src/AdminApp.tsx
+++ b/src/AdminApp.tsx
@@ -12,6 +12,13 @@ import 'react-toastify/dist/ReactToastify.css';
 const AdminApp = () => {
   return (
     <Background imageUrl={BackgroundImg}>
+      <button
+        onClick={() => {
+          throw new Error('Sentry 테스트');
+        }}
+      >
+        Sentry 수집 테스트
+      </button>
       <UnknownErrorBoundary FallbackComponent={RootUnknownFallback}>
         <ApiErrorBoundary FallbackComponent={RootApiFallback}>
           <Outlet />
diff --git a/vite.config.ts b/vite.config.ts
index 3978a3c8..7bd1f23b 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,34 +1,42 @@
 /// <reference types="vitest" />
 import { sentryVitePlugin } from '@sentry/vite-plugin';
-import { defineConfig } from 'vite';
+import { defineConfig, loadEnv } from 'vite';
 import react from '@vitejs/plugin-react';
 import path from 'path';
 
 // https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [
-    react({
-      jsxImportSource: '@emotion/react',
-    }),
-    sentryVitePlugin({
-      org: 'oceanletter-y1',
-      project: 'oceanletter-react',
-    }),
-  ],
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd(), '');
 
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src'),
+  return {
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+      },
     },
-  },
 
-  test: {
-    globals: true,
-    environment: 'jsdom',
-    setupFiles: ['./src/setupTests.ts'],
-  },
+    test: {
+      globals: true,
+      environment: 'jsdom',
+      setupFiles: ['./src/setupTests.ts'],
+    },
+
+    build: {
+      sourcemap: true,
+    },
 
-  build: {
-    sourcemap: true,
-  },
+    plugins: [
+      react({
+        jsxImportSource: '@emotion/react',
+      }),
+      sentryVitePlugin({
+        org: env.SENTRY_ORG,
+        project: env.SENTRY_PROJECT,
+        authToken: env.SENTRY_AUTH_TOKEN,
+        sourcemaps: {
+          filesToDeleteAfterUpload: ['**/*.js.map'],
+        },
+      }),
+    ],
+  };
 });