🚌 develop

version: 2.8.0
- Nuxt 3.11.2 업데이트
- 모노레포 @nuxt/eslint 적용처리
- 린팅 스타일 변경
- 종속성 모듈 버전 업데이트

Author: yeonjulee1005

.gitignore

@@ -24,4 +24,5 @@ logs
 .env
 .env.*
 !.env.example
-.stylelintcache
+.stylelintcache
+.eslintcache

.vscode/settings.json

@@ -1,4 +1,5 @@
 {
+  "eslint.experimental.useFlatConfig": true,
   "cSpell.words": [
     "acceptable",
     "Accordion",

app.vue

@@ -15,7 +15,6 @@
 </template>
 
 <script setup lang="ts">
-
 const { coords, resume } = useGeolocation()
 
 const { meta, fullPath } = useRoute()
@@ -41,7 +40,7 @@ useHead({
     return title && !title?.includes(t('pageTitle.yeonju'))
       ? title?.concat(' | ', t('pageTitle.yeonju'))
       : null
-  }
+  },
 })
 
 watch(() => genDateFormat('HH'), () => {
@@ -51,7 +50,6 @@ watch(() => genDateFormat('HH'), () => {
   }
 })
 
-
 watch(() => coords.value, () => {
   if (coords.value.latitude === Infinity) {
     resume()
@@ -79,7 +77,7 @@ const initWeatherData = () => {
 const seoUrl = 'https://www.dewdew.dev'
 const seoImage = 'https://api.dewdew.dev/storage/v1/object/public/assets/banner/main_banner.webp'
 
-if (process.server) {
+if (import.meta.server) {
   useHead({
     title: (meta.title as string) ?? '개발자 이연주 | Dewdew',
     meta: () => [
@@ -99,7 +97,7 @@ if (process.server) {
       { property: 'og:image:height', content: '200' },
       { property: 'og:image:type', content: 'image/png' },
       { property: 'og:title', content: (meta.title as string) ?? t('pageTitle.yeonju') },
-      { property: 'og:description', content: (meta.description as string) ?? t('openGraph.main') }
+      { property: 'og:description', content: (meta.description as string) ?? t('openGraph.main') },
     ],
     link: [
       { rel: 'canonical', href: fullPath },
@@ -110,17 +108,16 @@ if (process.server) {
       { rel: 'icon', type: 'image/png', sizes: '32x32', href: '/favicon-32x32.png' },
       { rel: 'icon', type: 'image/png', sizes: '16x16', href: '/favicon-16x16.png' },
       { rel: 'manifest', href: '/manifest.webmanifest' },
-      { rel: 'mask-icon', href: '/safari-pinned-tab.svg', color: '#5bbad5' }
+      { rel: 'mask-icon', href: '/safari-pinned-tab.svg', color: '#5bbad5' },
     ],
     script: [
       {
         hid: 'spiine-viewer',
         src: 'https://unpkg.com/@splinetool/[email protected]/build/spline-viewer.js',
         type: 'module',
-        defer: true
-      }
-    ]
+        defer: true,
+      },
+    ],
   })
 }
-
 </script>

components/A/Accordion.vue

@@ -38,20 +38,19 @@
 </template>
 
 <script setup lang="ts">
-
 withDefaults(
   defineProps<{
-    accordionItems: AccordionItem[],
-    accordionVariant?: 'solid' | 'outline' | 'ghost' | 'soft',
-    accordionColor?: string,
-    accordionSize?: string,
-    educateGroupClass?: string,
-    careerGroupClass?: string,
-    educateIconClass?: string,
-    careerIconClass?: string,
-    educateIconName?: string,
-    careerIconName?: string,
-    educateText?: string,
+    accordionItems: AccordionItem[]
+    accordionVariant?: 'solid' | 'outline' | 'ghost' | 'soft'
+    accordionColor?: string
+    accordionSize?: string
+    educateGroupClass?: string
+    careerGroupClass?: string
+    educateIconClass?: string
+    careerIconClass?: string
+    educateIconName?: string
+    careerIconName?: string
+    educateText?: string
     careerText?: string
   }>(),
   {
@@ -65,8 +64,7 @@ withDefaults(
     educateIconName: 'line-md:buy-me-a-coffee-twotone',
     careerIconName: 'line-md:construction-twotone',
     educateText: 'text',
-    careerText: 'text'
-  }
+    careerText: 'text',
+  },
 )
-
 </script>

components/A/Badge.vue

@@ -22,13 +22,13 @@ import type { BadgeSize, BadgeVariant } from '@nuxt/ui/dist/runtime/types'
 
 withDefaults(
   defineProps<{
-    customClass?: string,
-    badgeColor?: string,
-    badgeSize?: BadgeSize | undefined,
-    badgeVariant?: BadgeVariant | undefined,
-    useIcon?: boolean,
-    iconName?: string,
-    iconSize?: number,
+    customClass?: string
+    badgeColor?: string
+    badgeSize?: BadgeSize | undefined
+    badgeVariant?: BadgeVariant | undefined
+    useIcon?: boolean
+    iconName?: string
+    iconSize?: number
     badgeText?: string | number
   }>(),
   {
@@ -39,8 +39,7 @@ withDefaults(
     useIcon: true,
     iconName: '',
     iconSize: 22,
-    badgeText: ''
-  }
+    badgeText: '',
+  },
 )
-
 </script>

components/A/Button.vue

@@ -48,20 +48,20 @@ import type { ButtonSize, ButtonVariant } from '@nuxt/ui/dist/runtime/types/butt
 
 withDefaults(
   defineProps<{
-    customClass?: string,
-    roundButton?: boolean,
-    buttonDisabled?: boolean,
-    buttonPadding?: boolean,
-    buttonColor?: string,
-    buttonSize?: ButtonSize | undefined,
-    buttonVariant?: ButtonVariant | undefined,
-    buttonLabel?: string,
-    useLeading?: boolean,
-    iconName?: string,
-    imageSrc?: string,
-    iconSize?: number,
-    imageSize?: number,
-    buttonTextStyle?: string,
+    customClass?: string
+    roundButton?: boolean
+    buttonDisabled?: boolean
+    buttonPadding?: boolean
+    buttonColor?: string
+    buttonSize?: ButtonSize | undefined
+    buttonVariant?: ButtonVariant | undefined
+    buttonLabel?: string
+    useLeading?: boolean
+    iconName?: string
+    imageSrc?: string
+    iconSize?: number
+    imageSize?: number
+    buttonTextStyle?: string
     buttonText?: string
   }>(),
   {
@@ -79,14 +79,13 @@ withDefaults(
     iconSize: 24,
     imageSize: 36,
     buttonTextStyle: '',
-    buttonText: ''
-  }
+    buttonText: '',
+  },
 )
 
 defineEmits([
   'click:button',
   'mouseenter:button',
-  'mouseleave:button'
+  'mouseleave:button',
 ])
-
 </script>

components/A/Dialog.vue

@@ -48,21 +48,20 @@
 </template>
 
 <script setup lang="ts">
-
 const modalTrigger = ref(false)
 
 const props = withDefaults(
   defineProps<{
-    dialogTrigger?: boolean,
-    fullScreen?: boolean,
-    preventClose?: boolean,
-    dialogTitleClass?: string,
-    title?: string,
-    doubleFirstText?: string,
-    doubleSecondText?: string,
-    hideDoubleButton?: boolean,
-    hideFirstButton?: boolean,
-    hideSecondButton?: boolean,
+    dialogTrigger?: boolean
+    fullScreen?: boolean
+    preventClose?: boolean
+    dialogTitleClass?: string
+    title?: string
+    doubleFirstText?: string
+    doubleSecondText?: string
+    hideDoubleButton?: boolean
+    hideFirstButton?: boolean
+    hideSecondButton?: boolean
     disableFirstButton?: boolean
   }>(),
   {
@@ -76,14 +75,14 @@ const props = withDefaults(
     hideDoubleButton: false,
     hideFirstButton: false,
     hideSecondButton: false,
-    disableFirstButton: false
-  }
+    disableFirstButton: false,
+  },
 )
 
 const emits = defineEmits([
   'close-dialog',
   'click-first-button',
-  'click-second-button'
+  'click-second-button',
 ])
 
 watch(() => props.dialogTrigger, (value) => {
@@ -95,5 +94,4 @@ watch(() => modalTrigger.value, (value) => {
     emits('close-dialog')
   }
 }, { immediate: true })
-
 </script>

components/A/Header.vue

@@ -16,7 +16,5 @@
 </template>
 
 <script setup lang="ts">
-
 const { isDesktop } = useDevice()
-
 </script>

components/A/IconText.vue

@@ -13,15 +13,14 @@
 </template>
 
 <script setup lang="ts">
-
 withDefaults(
   defineProps<{
-    useIcon?: boolean,
-    defaultClass?: string,
-    customClass?: string,
-    textClass?: string,
-    iconName?: string,
-    iconSize?: number,
+    useIcon?: boolean
+    defaultClass?: string
+    customClass?: string
+    textClass?: string
+    iconName?: string
+    iconSize?: number
     text?: string
   }>(),
   {
@@ -31,8 +30,7 @@ withDefaults(
     textClass: '',
     iconName: '',
     iconSize: 34,
-    text: ''
-  }
+    text: '',
+  },
 )
-
 </script>

components/A/LanguageChange.vue

@@ -20,21 +20,19 @@
 </template>
 
 <script setup lang="ts">
-
 const { t, locale, setLocale } = useLocale()
 
 const locales = [
   { label: t('localeMenu.korean'), value: 'ko' },
-  { label: t('localeMenu.english'), value: 'en' }
+  { label: t('localeMenu.english'), value: 'en' },
 ]
 
 const selectLocale = computed({
-  get () {
+  get() {
     return locale.value
   },
-  set (value) {
+  set(value) {
     setLocale(value)
-  }
+  },
 })
-
 </script>

components/A/NuxtDate.vue

@@ -10,20 +10,18 @@
 </template>
 
 <script setup lang="ts">
-
 const { locale } = useLocale()
 
 withDefaults(
   defineProps<{
-    dateTime?: string,
-    customClass?: string,
+    dateTime?: string
+    customClass?: string
     fullDate?: boolean
   }>(),
   {
     dateTime: '',
     customClass: 'time flex',
-    fullDate: true
-  }
+    fullDate: true,
+  },
 )
-
 </script>

components/A/NuxtTime.vue

@@ -25,22 +25,20 @@
 </template>
 
 <script setup lang="ts">
-
 const { locale } = useLocale()
 
 withDefaults(
   defineProps<{
-    dateTime?: string,
-    customClass?: string,
-    fullDateTime?: boolean,
+    dateTime?: string
+    customClass?: string
+    fullDateTime?: boolean
     capitalDateTime?: boolean
   }>(),
   {
     dateTime: '',
     customClass: 'time flex mb-default',
     fullDateTime: true,
-    capitalDateTime: true
-  }
+    capitalDateTime: true,
+  },
 )
-
 </script>