pr check action 오류 수정 (#4)

* pr check action 오류 수정

* gitignore prettier 설정 포함

* path alias 설정 및 index.html public 하위로 이동

* action 라벨 라이브러리 수정

* 라벨 추가를 위한 권한 설정

* 액션 오류 수정

.github/workflows/action-check-pr.yaml

@@ -4,6 +4,10 @@ on:
   pull_request:
     types: [opened, edited, synchronize, reopened, ready_for_review]
 
+permissions:
+  pull-requests: write # PR에 대한 쓰기 권한 부여
+  issues: write # 이슈에 대한 쓰기 권한 부여 (라벨 추가를 위한)
+
 jobs:
   check:
     runs-on: ubuntu-latest
@@ -17,27 +21,27 @@ jobs:
         with:
           node-version: '18'
       - name: Install pnpm
-        run: npm install -g pnpm  # pnpm을 전역으로 설치
+        run: npm install -g pnpm # pnpm을 전역으로 설치
 
       - name: Install Dependencies
-        run: pnpm install  # pnpm을 사용하여 의존성 설치
+        run: pnpm install # pnpm을 사용하여 의존성 설치
 
       - name: Run Lint
-        run: pnpm lint  # 린트 실행
+        run: pnpm lint # 린트 실행
 
       - name: Run Prettier
-        run: pnpm format --check  # 프리티어 체크
+        run: pnpm format --check # 프리티어 체크
 
-      - name: Build
-        run: pnpm build  # 빌드 실행
+      - name: Build # 머지하려는 브랜치가 main 브랜치이면 build:prod, dev 브랜치이면 build:dev
+        run: pnpm build:${{ github.event.pull_request.base.ref == 'main' && 'prod' || 'dev' }}
 
   label:
     runs-on: ubuntu-latest
-    needs: check  # check 작업이 완료된 후 실행
+    needs: check # check 작업이 완료된 후 실행
 
     steps:
       - name: Add Labels
-        if: github.event.pull_request.draft == false  # 드래프트가 아닐 경우에만 실행
-        uses: actions/add-labels@v1
+        if: github.event.pull_request.draft == false # 드래프트가 아닐 경우에만 실행
+        uses: actions-ecosystem/action-add-labels@v1 # 라벨 추가 액션
         with:
-          labels: ${{ github.event.pull_request.base.ref == 'dev' && 'dev' || github.event.pull_request.base.ref == 'main' && 'main'}}  # dev로 머지 시 dev 라벨, main으로 머지 시 main 라벨
+          labels: ${{ github.event.pull_request.base.ref == 'dev' && 'dev' || github.event.pull_request.base.ref == 'main' && 'main'}} # dev로 머지 시 dev 라벨, main으로 머지 시 main 라벨

.gitignore

@@ -1,2 +1,2 @@
 node_modules
-.prettierrc
+build

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "printWidth": 120
+}

package.json

@@ -10,8 +10,8 @@
     "dev": "cross-env NODE_ENV=development webpack serve --open",
     "build:dev": "cross-env NODE_ENV=development webpack",
     "build:prod": "cross-env NODE_ENV=production webpack",
-    "start:dev": "npm run build:dev && node dist/bundle.js",
-    "start:prod": "npm run build:prod && node dist/bundle.js"
+    "start:dev": "npm run build:dev && serve -s build",
+    "start:prod": "npm run build:prod && serve -s build"
   },
   "keywords": [],
   "author": "",

src/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-import App from 'App';
+import App from '@/App';
 
 const root = ReactDOM.createRoot(document.getElementById('root')!);
 root.render(

webpack.config.js

@@ -7,16 +7,19 @@ module.exports = {
   entry: './src/index.tsx',
   output: {
     filename: 'bundle.js',
-    path: path.resolve(__dirname, 'dist'),
+    path: path.resolve(__dirname, 'build'),
     clean: true, // 이전 빌드 파일 삭제
   },
   resolve: {
+    alias: {
+      '@': path.resolve(__dirname, 'src'),
+    },
     extensions: ['.ts', '.tsx', '.js', '.jsx'], // 처리할 파일 확장자
   },
   module: {
     rules: [
       {
-        test: /\.tsx?$/, // 타입스크립트 파일 처리
+        test: /\.tsx?$/, // 타입스크립트 파일 처리 ts, tsx
         use: 'ts-loader',
         exclude: /node_modules/,
       },
@@ -25,7 +28,7 @@ module.exports = {
   mode: process.env.NODE_ENV || 'development',
   plugins: [
     new HtmlWebpackPlugin({
-      template: './index.html', // 기본 HTML 템플릿
+      template: './public/index.html', // 기본 HTML 템플릿
     }),
   ],
   devtool: process.env.NODE_ENV === 'development' ? 'source-map' : false, // 소스 맵